Porteapertesulweb Social

Premessa: Angelo Paganini e Lillo hanno inventanto un modo diverso e più confacente alla architettura del nostro sito per inserire il footer (un terzo menu da gestire proprio come gli altri due menu orizzontali presenti in tutte le nostre pagine).

Io mi sono arrangiata così…

1. All’interno dell’ambiente di amministrazione
Ho creato una “finta pagina” (nel senso che non si vede ma c’è – compare solo nelle breadcraumbs) che ho chiamato Footer, l’ho salvata.
sono andata nell’elenco di tutte le pagine pubblicate, ho cercato footer. Passando con il mause senza cliccare sulla voce al nome della pagina o a “Modifica”.
in basso a sinistra -se usi Mozzilla fire fox- ti compare un numero che indica la Id (numerazione univoca o chiave univoca) della pagina
una cosa come post=1234, segnati il tuo numero.

2. ho creato le pagine che mi servivano
negli “attibuti di pagina” di ciascuna di queste ho selezionato come “Genitore” il footer e ho dato un ordinamento crescente da 1 a 6

sono andata poi in Aspetto>>>>Editor (sulla sinistra dello schermo)

sulla destra tra i template ho scelto:
piè pagina Footer.php
dopo i comandi scritti qui in corsivo (ma nel file footer.php sono scritti “normali”), ho copiato quelli che seguono esattamente così come li vedi

Attenzione: al posto di 593 devi mettere la id, il numero post della tua pagina: stai dicendo al footer di inserire lì tutte le pagine figlie della pagina footer.
</div>
<div id=”footer”>

<div id=”piede”>
<ul class=”pie”>

<?php wp_list_pages(‘child_of=593&sort_column=menu_order&depth=1&title_li=’); ?>

<li>
<?php wp_loginout(); ?>
</li>

</ul>
</div>

Attenzione al posto di 593 devi mettere la id, il numero post della tua pagina: stai dicendo al footer di inserire lì tutte le pagine figlie della pagina footer.

salva

adesso senza uscire da aspetto>>> Editor,

scegli tra i template “Foglio di stile”e in fondo a tutto copia tutti questi comandi:

/***************** footer personalizzato *********************/

#piede ul.pie {
height: 20px;
width: 100%;
padding: 0;
margin: 0px;
background-color: #003399;
color: #F0F0F0;
}

#piede  ul li {
margin: 0px;
display: inline;
}

#piede ul li a {
text-decoration: none;
color: #F0F0F0;

}

#piede ul li a:hover, #piede ul li a:focus{
background: #F0F0F0;
color: #3A291F;
}

#piede ul.pie li a{
padding: 0px 10px 0px 10px;
float:none;

}

#piede ul.pie li.current_page_item a {
text-decoration:none !important;
color: #3A291F!important;
background: #F0F0F0;
}

#piede ul.pie li.current_page_item a:hover
{
text-decoration:none !important;
color: #3A291F!important;
background: #F0F0F0;
}

questi codici #F0F0F0 e simili sono i colori che vengono usati per le visualizzazioni, dovresti cambiarli armonizzandoli a quelli del tuo sito!