February 9
WordPress offre agli sviluppatori tema la capacità di afferrare il titolo del blog da un database e di uscita per l'intestazione. La funzione "bloginfo ()" gestisce questo compito ed è facile da usare, ma sostituendo il titolo con una foto richiede un piccolo sforzo in più. È necessario modificare il codice del titolo nel file "header.php" del vostro tema e aggiungere del codice Cascading Style Sheet (CSS) per scambiare il testo del titolo con l'immagine. In questo modo si permetterà di mantenere il testo del titolo nel browser, ma fuori dallo schermo, ed è possibile visualizzare un'immagine come logo per il tuo blog.
1 Carica la tua foto nella cartella del tuo tema sul server. Se il tema include una cartella separata per le immagini, posizionare l'immagine lì.
2 Passare alla directory "wp-admin" del tuo sito web e accedere al cruscotto di WordPress. Passare a "Editor" sotto "Aspetto" per caricare la schermata "Modifica Themes". Fare clic sul collegamento "header.php" per aprire il file nella casella Editor.
3 Trova l'involucro tag HTML intorno "<? Php bloginfo ( 'name');?>" E leggere il nome ID del tag di apertura. Ecco un esempio di come il codice è:
? <H1 id = "BlogTitle"> <? Php bloginfo ( 'name'); ?> </ H1>
Se non si trova un attributo ID nel tag di apertura, aggiungere un così sembra che il codice di cui sopra.
4 Aggiungere tag span intorno "<? Php bloginfo ( 'name');?>" In modo da poter indirizzare solo il testo del titolo nel codice CSS. Ecco il codice risultante:
? <H1 id = "BlogTitle"> <span> <? Php bloginfo ( 'name'); ?> </ Span> </ h1>
Fare clic sul pulsante blu "Update File" per salvare le modifiche.
5 Clicca sul link "style.css" sotto "Modelli" sullo schermo "modificare i temi". Aggiungere il seguente codice nella parte inferiore della "style.css" per nascondere il titolo del testo:
arco BlogTitle {
margin-left: -999em;
blocco di visualizzazione;
}
Il codice di cui sopra si sposta il testo del titolo fuori dallo schermo, ma mantiene leggibili per gli screen reader utilizzati dai non vedenti. È necessario impostare "display: block" per utilizzare i margini sui tag span.
6 Aggiungere questo codice al file "style.css" per impostare l'immagine come sfondo per l'elemento HTML che contiene il titolo:
Titolo del Blog {
fondo: URL ( 'path / to / picture.png') centro no-repeat;
Larghezza: XXpx;
altezza: XXpx;
}
È necessario impostare la larghezza e l'altezza in modo che corrisponda alle dimensioni della vostra immagine. Sostituire "XX" con il numero di pixel necessari. Impostare il percorso URL per il percorso relativo della foto, come ad esempio "images / picture.png" se si mette la foto in una cartella denominata "immagini".