Come creare un Multi-Column widgetized Footer per Wordpress

June 25

Come creare un Multi-Column widgetized Footer per Wordpress


Mentre WordPress progettato widget - piccole programmi che è possibile trascinare e rilasciare in luogo dal back-end - per l'uso in barre laterali blog, alcuni temi anche utilizzare i widget nei loro piè di pagina. Questi temi pongono spesso tre o quattro sezioni "widgetized" a piè di pagina, che può contenere widget come "Post più popolari" e "Commenti recenti". È necessario modificare il codice HTML del piè di pagina, il PHP nel file "functions.php" e il CSS (Cascading Style Sheet) di codice del file "style.css" nel tema per creare la stessa funzionalità nei propri temi .

istruzione

1 Passare a "Aspetto" dalla barra laterale del cruscotto WordPress. Questo è il back-end che si accede a dalla directory "wp-admin" del tuo sito web. Clicca sul link "Editor" che consente di visualizzare nel sottomenu "Aspetto".

2 Individuare il file "footer.php" elencati sotto "Modelli" sullo schermo "modificare i temi" e fare clic sul collegamento. Creare tre DIV nel piè di pagina e dare ad ognuno un nome ID univoco:

<Div id = "footer">

<Div id = "left">

</ Div>

<Div id = "center">

</ Div>

<Div id = "right">

</ Div>

</ Div>

3 Aggiungere questo codice all'interno di ciascuna delle tre div piè di pagina:

<? Php if (function_exists ( 'dynamic_sidebar') || dynamic_sidebar ( 'sidebar')!!):?>

<? Php endif; ?>

Cambiare il nome "Sidebar" nel "dynamic_sidebar ()" la funzione per ciascuno dei tre div, rendendo ognuno unico. Nomi come "sinistra piè di pagina" funzionano bene. Fare clic sul pulsante blu "Update File" per salvare il lavoro.

4 Vai alla scheda "functions.php" nella schermata "modificare i temi". Aggiungere questo codice al di sopra della chiusura tag PHP delimitatore ">?":

if (function_exists ( 'register_sidebar'))

register_sidebar (array (

'name' => 'Left Footer',

'Before_widget' => '& lt; div id = "% 1 $ s" class = "widget di% 2 $ s">',

'After_widget' => '& lt; / div>',

'Before_title' => '& lt; h3>',

'After_title' => '& lt; / h3>',

));

Modificare il "nome" per corrispondere al nome della vostra prima area widget di piè di pagina. Aggiungere questo codice altre due volte, in modo che ogni zona widget ha il codice corrispondente. Ogni volta che si aggiunge il codice, modificare il "nome" per abbinare uno dei tuoi piè di pagina aree di widget. Salvare il file.

5 Caricare il file "style.css" nella schermata "Modifica Themes" e aggiungere questo codice in fondo:

piè di pagina div {float: left; width: 33%; }

Questo codice allinea ogni sezione widgetized orizzontalmente attraverso il tuo footer. Aggiungere tutti gli altri stili a seconda delle necessità.

Consigli e avvertenze

  • La comprensione della CSS "box model" è molto utile per questo tipo di layout piè di pagina. Se non si conosce il modello, si dovrebbe studiare e conoscere gli effetti dei margini e padding in particolare.
  • Eseguire il backup del tema prima di modificare e ri-caricare il tema tramite FTP se non si può tornare a WordPress causa di un errore di PHP.