Recentemente ho chiesto a un cliente di proteggere una delle sue pagine WordPress, nessun problema! Poi è tornato e ha detto: puoi cambiare il testo e farlo sembrare migliore? Hmm? Sicuro! Ecco come?
Bene, apriamo il file functions.php e aggiungiamo questo blocco di codice:
ID)? rand (): $ post-> ID); $ o = '
?IL TESTO EXTRA PUOI ANDARE QUI? QUESTO MOSTRERÀ SOTTO IL MODULO
'; ritorno $ o; ?>Lascia che analizzi questo per te molto velocemente. Il codice di protezione della password viene generato da un file nella cartella wp-includes. "Cool", pensi, "ci andrò e farò i miei cambiamenti". Non farlo! Per quanto possa essere allettante, la modifica del codice base è terribile, in basso, nessuna buona idea. Per una ragione: cosa succede se aggiorni WordPress? Viene spazzato via? spiacente. Va bene, quindi mettendo questo blocco di codice nel file functions.php, modificarlo e non preoccuparti di perdere alcuna modifica al modulo quando si aggiorna.
Come puoi vedere, ho effettivamente aggiunto delle classi al modulo stesso, all'etichetta del modulo, al campo della password e al pulsante. Ora abbiamo tutto ciò di cui abbiamo bisogno per modellarlo completamente con i CSS. Oh, e in realtà non stiamo cambiando nulla nella cartella wp-includes, quindi non stiamo infrangendo le regole.
Il testo in maiuscolo sopra mostra anche ciò che ho cambiato? il primo set di testo:
QUESTO È IL TUO NUOVO PASSWORD INTRO TESTO CHE MOSTRA SOPRA IL MODULO DELLA PASSWORD
Come puoi vedere questo era il tuo testo introduttivo? era solito dire questo:
Questo post / pagina è protetto da password. Per vederlo, inserisci la tua password qui sotto
Ora siamo in grado di cambiarlo in qualunque testo tu voglia lassù. Puoi anche cancellare tutto tra quelle citazioni e non avere nulla da mostrare.
L'etichetta predefinita visualizzata a sinistra del campo di immissione è Password. Qui puoi cambiarlo in qualsiasi cosa tu voglia dire. Nel mio caso, l'ho assegnato a una classe che ha eliminato l'etichetta in css mettendo il display su none.
.pass-label display: none;
Puoi anche cambiare la dimensione del carattere, il colore, il lavoro su questa etichetta
Odio come appaiono le forme, ma con questa aggiunta al campo di inserimento della password di default sono in grado di renderlo un po 'più "aggiornato". Sentiti libero di cambiarlo come meglio credi.
Nel codice delle funzioni, ho aggiunto una classe al pulsante di invio chiamato "pulsante". L'ho fatto perché volevo che tutti i pulsanti sul sito del mio cliente sembrassero esattamente gli stessi. L'uniformità in un sito è fondamentale. Ecco il CSS che ho usato:
.button background-color: # 000; color: #fff; confine: 0; font-family: Impact, Arial, sans-serif; margine: 0; altezza: 33 px; imbottitura: 0px 6px 6px 6px; font-size: 15px; cursore: puntatore;
Per qualche ragione stavo ricevendo la freccia quando passavo il mouse sopra il pulsante, così ho appena cambiato il cursore per mostrare il puntatore e sono tornati alla mano al passaggio del mouse.
In realtà avevo bisogno di aggiungere una piccola nota per dire alla gente che il campo password è case sensitive così da aggiungere del testo extra sotto al form, ho appena aggiunto un codice di paragrafo e inserito un tag di stile per rendere lo stile del testo separatamente dal resto del pagina.
E abbiamo finito!