Come personalizzare la pagina di accesso di WordPress

Se lavoriamo con Wordpress è possibile che ci piaccia personalizzare la nostra pagina con tutti i dettagli possibili. Una delle personalizzazioni più richieste dai clienti è il login. Per impostazione predefinita, il design che Wordpress ci offre per il login è abbastanza semplice e pulito. Ecco perché potremmo voler includere in esso un tocco più personale, come il nostro marchio.

Se hai un blog sviluppato in Wordpress, saprai che per gestirlo devi accedere ad un url come http://www.midominio.com/wp-admin, che mostra la pagina di login dell'amministratore di installazione; Questo, per impostazione predefinita, include un logo Wodpress che possiamo cambiare. Ma non solo, possiamo anche modificare il collegamento a cui punta quando ci clicchi sopra, così come il suo tooltip (il poster che viene mostrato quando si posiziona il puntatore del mouse sul logo).

Ci sono due modi per effettuare questa personalizzazione: attraverso plugin specializzato o aggiungendo un pezzo codice al file di installazione corrispondente.

Durante l'esecuzione di qualsiasi personalizzazione in Wordpress È più semplice tramite un plugin, la verità è che questi influenzano direttamente il tempo di caricamento della nostra pagina in modo che ogni volta che sarà alla nostra portata, sarà più facile eseguire questo tipo di azioni "toccando" il codice.

In questo tutorial vedremo come farlo direttamente aggiungendo i tre frammenti di codice php corrispondenti ad ognuna delle personalizzazioni che effettueremo:

Personalizzazioni

  • Cambia il logo.
  • Modifica collegamento logo.
  • Personalizza il tooltip del logo.

1. Cambia logo


Passo 1
La prima cosa che dobbiamo fare è preparare l'immagine che useremo come logo. Questo dovrebbe essere quadrato, of 80 x 80 pixel e in formato .png.webp, preferibilmente con il Sfondo trasparente, poiché la pagina di login è grigiastra e, in questo modo, si "mescola" perfettamente con essa.

Passo 2
Una volta che abbiamo pronta l'immagine che useremo come logo, che nel nostro esempio si chiama logo.png.webp, dobbiamo salvarlo nella cartella immagini del nostro argomento attuale ( \ wp-content \ temi \argomento attuale\ immagini) dove argomento attuale corrisponde al nome del tema che hai attivo nella tua installazione.

Possiamo eseguire questo processo, sia attraverso un cliente FTP come attraverso il gestore di file di hosting, nel caso ce l'avessi.

Passaggio 3
Ora sarà necessario aggiungere al file il codice php corrispondente functions.php del nostro tema attivo. Il modo più rapido per farlo è utilizzare l'editor di file di Wordpress. Per fare ciò, all'interno dell'installazione di Wordpress, fai fai clic sul menu Personalizza e poi circa Editor. Ora nella colonna di sinistra clicca su functions.php file e scorrere fino alla fine.

Per indicare il logo che si desidera venga visualizzato, aggiungere il seguente codice. Nello snippet di codice devi sostituire il testo logo.png.webp dal nome che hai dato al tuo logo

 // personalizza la funzione logo di accesso my_custom_login_logo () {echo ''; } add_action ('login_head', 'my_custom_login_logo');

2. Cambia collegamento logo


Per modificare l'URL collegato al logo della pagina, devi anche aggiungere al file funzioni.php il seguente pezzo di codice:
 // personalizza la funzione di collegamento del logo put_my_url () {return ('http://www.solvetic.com'); // Qui indicare l'URL a cui si collega il logo} add_filter ('login_headerurl', 'put_my_url');

3. Personalizza il tooltip del logo


Infine, e per completare la personalizzazione della pagina di accesso, cambieremo il testo che appare quando passi il mouse sopra l'immagine del logo, che per impostazione predefinita è "Powered by WordPress".

Per questo dovrai aggiungere un ultimo frammento di codice al file funzioni.php dell'argomento attivo:

 // personalizza la funzione di collegamento del logo put_my_url () {return ('http://www.solvetic.com'); // Qui indicare l'URL a cui si collega il logo} add_filter ('login_headerurl', 'put_my_url');

Una volta terminata la modifica, sarà necessario salvare le modifiche apportate affinché abbiano effetto. Per farlo, clicca sul pulsante Aggiorna file trovato alla fine dell'editor. Ora se accedi alla tua pagina di accesso di Wordpres puoi vedere come appare dopo le modifiche applicate.

RicordarePuoi provare questi "trucchi" senza temere di deconfigurare il tuo sito in Wordpress utilizzando un'installazione locale come spiegato nel tutorial Come avere un'installazione portatile di WordPress

Scarica modelli Wordpress gratuiti

Ti è piaciuto e hai aiutato questo Tutorial?Puoi premiare l'autore premendo questo pulsante per dargli un punto positivo
wave wave wave wave wave