Come convertire un modello di WordPress per Larghezza Fluid

August 1

Come convertire un modello di WordPress per Larghezza Fluid


template wordpress, o temi, utilizzare un foglio di stile CSS per definire il disegno. temi larghezza fluida regolare per ospitare diverse risoluzioni del monitor. Ad esempio, impostare la larghezza di fluido al 80 per cento e non importa quale monitor con risoluzione tuoi visitatori usano il tema assumerà l'80 per cento dello schermo. Questo aiuta a dare il vostro sito WordPress un layout relativo coerente tra diversi monitor. Convertire un tema di larghezza di fluido con un ritocco del codice CSS.

istruzione

1 Aprire la cartella del tema WordPress sul proprio computer. È scaricato e installato il tema ad un certo punto nel passato. Se si è eliminato la copia sul proprio computer dopo aver caricato il tema per il vostro sito, scaricare un'altra copia da qualsiasi sito web fornito il vostro tema.

2 Cercare il file denominato "style.css" e fare doppio click per aprirlo. Se viene richiesto di scegliere un programma per aprirlo con, scegliere Blocco note (Windows) o TextEdit (Mac). Qualsiasi programma Web design funziona anche, ma il Blocco note e TextEdit sono facili da leggere il codice a.

3 scorrere con attenzione attraverso il file per tutte le righe di codice etichettati "width: 000px;" dove 000 può essere qualsiasi numero. Stai andando a modificare i valori px a valori percentuali.

4 Decidere che le percentuali si intende utilizzare. Molti modelli di WordPress, o temi, hanno tre sezioni principali: una sezione "#header" definisce l'area orizzontale nella parte superiore della pagina, una sezione "#main", dove i messaggi appaiono e una o più sezioni "#sidebar". L'intestazione è spesso impostato a 100% mentre la sezione principale è 80% e la barra laterale 20% se solo uno c'è.

5 Cambiare ogni valore "000px" per il valore percentuale si è scelto. Utilizzando l'esempio precedente, digitare "width: 100%;" nella sezione #header, "width: 80%;" sotto #main e "width: 20%;" sotto #sidebar. Lasciare fuori le virgolette.

6 Salvare il file e caricare il file nuova "style.css" al tuo sito web. Utilizzare qualsiasi metodo di solito si usa per caricare. Visita il sito on-line per visualizzare le modifiche. Premi il pulsante Aggiorna per ricaricare la pagina se non si nota il cambiamento subito.

Consigli e avvertenze

  • La sezione "#header" definisce la parte più ampia del tuo sito web, è per questo che è generalmente definito come il 100%. Le altre sezioni dovrebbero aggiungere fino al 100% in modo da allinearsi all'interno della larghezza della testata. Se si dispone di due colonne, considerare la creazione della larghezza principale per il 60% e ogni colonna al 20% ciascuno.
  • Alcuni disegni hanno piè di pagina e più colonne. Controllare attentamente le percentuali per assicurarsi che essi aggiungere fino a 100 o la vostra pagina non verranno visualizzati correttamente in linea.