Adattare un sito alle varie risoluzioni

studiograficoroma

Ciao lucaeffe,
il sito da te realizzato in dimensioni fisse non è possibile ridimensionarlo per altre risoluzioni.
Una struttura invece liquida può essere ridimensionata a seconda della risoluzione.
Ti sconsiglio comunque di progettare a 1280, per ora la risoluzione ottimale è 1024 massimo e 980 per il template.

lucaeffe

Quindi la mia risoluzione è poco usata o la più usata è la 1024 x768?

Ho già progettato tutto il sito a 1280 x 800 (in realta è un portfolio che si estende in verticale con container di 950px in cui è compreso tutto) e non mi va di cancellare tutto.

Avevo pensato quindi di usare quello script che ti permette di adattare diversi fogli di stile a seconda della risoluzione.
Ti ricordi per cas come si chiama cosi cerco qualche articolo ?

studiograficoroma

La risoluzione più usata ora è 1024, puoi ovviare al problema creando più stili per risoluzioni e farli cambiare con uno script che ti posto qui:

<script type="text/javascript" language="javascript">
<!-- //
var l=screen.width;
switch(l) {
 case 800:
  document.write("<link rel='stylesheet' href='stile800.css' type='text/css'>");
 break;
 case 1024:
  document.write("<link rel='stylesheet' href='stile1024.css' type='text/css'>");
 break;
 default:
  document.write("<link rel='stylesheet' href='stiledefault.css' type='text/css'>");
}
// -->
</script>

Devi creare gli stili e formattare il sito con più risoluzioni.

lucaeffe

Grazie mille!
In href='stiledefault.css' ci va il link al sito che ho sviluppato a 1280?

studiograficoroma

Hai capito benissimo.:)
Ciao e buon lavoro.

happydesign2

@studiograficoroma said:

La risoluzione più usata ora è 1024, puoi ovviare al problema creando più stili per risoluzioni e farli cambiare con uno script che ti posto qui:

><script type="text/javascript" language="javascript">
<!-- //
var l=screen.width;
switch(l) {
 case 800:
  document.write("<link rel='stylesheet' href='stile800.css' type='text/css'>");
 break;
 case 1024:
  document.write("<link rel='stylesheet' href='stile1024.css' type='text/css'>");
 break;
 default:
  document.write("<link rel='stylesheet' href='stiledefault.css' type='text/css'>");
}
// -->
</script>
>```Devi creare gli stili e formattare il sito con più risoluzioni.
:ciauz:

Ciao a tutti sono nuovo del vostro forum e m i chiamo Paolo, desideravo avere maggiori informazioni sullo script sopra quotato e per la precisione, dove va piazzato e come interagisce con i fogli di stile che io creo.

GRAZIE

studiograficoroma

Ciao happydesign2 e benvenuto nel Forum GT,
lo script deve essere inserito tra il tag di apertura <head> e quello di chiusura </head>.

Agisce riconoscendo le impostazioni del monitor al momento del caricamento della pagina e associa lo stile assegnato a quella risoluzione.

Ciao!

happydesign2

Grazie mille sia per il benvenuto che per la spiegazione! Però mentre davo un occhiata al contenuto della cartella del template, ho visto che non ci sono file HTML o meglio sono presenti nella cartella i seguenti file:

index.php

component.php

I tag da te indicati sono presenti in tutti e due i file su citati e quindi sorge il dubbio: in quale di questi due va inserito lo script? :():

studiograficoroma

Posso sapere che se piattaforma stai usando?
joomla, wordpress, drupal...

happydesign2

Giusto non ne ho fatto neanche il più piccolo cenno....
La piattaforma è la Joomla

studiograficoroma

In joomla devi andare nella cartella template, sprire la cartella del template che stai usando e aprire il file index.php. Inserisci lo scirpt prima della chiusura del tag </head>.

A volte i template joomla possono avere i file separati, controlla se nella cartella html è presente una pagina head.php

Ciao

happydesign2

Grazie mille mi sei stato davvero d'aiuto!!!

happydesign2

Ciao giusto un'ultimissima spiegazione: alla voce "default:" cosa devo scrivere? Il riferimento al foglio di stile che dovrebbe apparire di default? Era un dubbio che mi era venuto leggendo:

"In href='stiledefault.css' ci va il link al sito che ho sviluppato a 1280?"

studiograficoroma

Devi inserire il css di default che vuoi far aprire alle risoluzioni che non hai settato.