Nel creare un sito responsive, uno degli elementi che devi considerare è il template.

Per prima cosa ti vogliamo svelare una piccola scorciatoia che, se non l'hai ancora scoperta, ti aiuterà a risparmiare tempo quando ti troverai a lavorare sulla struttura del tuo template.

In Struttura del Modello, cliccando con il tasto destro del mouse sull’Anteprima richiami un menu contestuale attraverso il quale puoi Copiare e Incollare tutte le proprietà della struttura. 

In questo modo, una volta definita la struttura del modello per la Visualizzazione Desktop puoi semplicemente copiarla, passare alla Visualizzazione successiva e incollarla. Ricreata la stessa base di partenza, non ti rimarrà che modificare solo ciò che cambia da una Visualizzazione all’altra.

Definita la struttura del tuo template, puoi dedicarti a Header e Footer. Ovviamente lo spazio che queste due sezioni occuperanno diminuisce progressivamente partendo dalla Visualizzazione Desktop fino ad arrivare alla Visualizzazione Mobile. Il modo migliore per procedere è:

• Apri la sezione Header della finestra Contenuto Header e Footer e, per la Visualizzazione Desktop, inserisci tutti i contenuti che ti occorrono (Titolo, Logo, Immagini, ecc…) definendone proprietà, dimensioni e posizioni.

• Clicca sulla Responsive Bar per selezionare la Visualizzazione successiva: molto probabilmente gli Oggetti che hai inserito adesso risultano troppo grandi e sovrapposti.

• Nascondi i contenuti che non servono a questa Visualizzazione: seleziona l'Oggetto, clicca sul pulsante Mostra/Nascondi e scegli se utilizzare il comando Nascondi per questa visualizzazione o il comando Nascondi per questa visualizzazione e per quelle inferiori.

• Sistema gli Oggetti rimasti ridefinendone posizione e dimensioni.

• Ripeti queste operazioni per tutte le Visualizzazioni: la regola a cui ti devi attenere è di mantenere solo e sempre ciò che è necessario.

Una piccola nota. Se ti accorgi di aver nascosto un Oggetto che invece serve visualizzare non devi fare altro che cliccare di nuovo su Mostra/Nascondi e usare il comando Gestione Oggetti nascosti per questa visualizzazione. Nella finestra richiamata viene visualizzato l'elenco di tutti gli Oggetti nascosti per la Visualizzazione in corso: è sufficiente mettere il segno di spunta a fianco del nome per rendere nuovamente visibile un Oggetto.