Titan Framework offre una vasta gamma di opzioni che puoi aggiungere in un plug-in o in un tema per fornire agli utenti finali impostazioni dinamiche. Oggi parlerò di due delle opzioni più basilari: a testo tipo opzione e a textarea opzione. Vediamo come creare un'opzione per il tipo di testo in un pannello di amministrazione, in un metabox o in una sezione di personalizzazione del tema.

Opzioni del tipo di testo in Titan Framework

In Titan Framework ci sono diversi tipi di opzioni e oggi esamineremo quella con il tipo testo. Ecco come appare:

Il testol'opzione type in Titan Framework include un'ampia gamma di parametri di impostazione:

• nome: Controlla il nome con cui viene visualizzata l'opzione.
• id: Un nome univoco che viene utilizzato per ottenere i valori salvati.
• disc: Visualizza una breve descrizione con il nome dell'opzione.
• predefinito: Questo parametro specifica il valore predefinito dell'opzione.
• anteprima dal vivo: (Opzionale) Questo parametro viene utilizzato solo quando a testo l'opzione type è in uso nella sezione customizer del tema. Aiuta a visualizzare un'anteprima in tempo reale dei cambiamenti nel tuo tema.
• css: (Facoltativo) Quando un campo di testo viene aggiunto all'interno di una pagina di amministrazione o di una sezione di personalizzazione del tema, questo parametro può aiutare a generare CSS. Come?
• segnaposto: (Opzionale) Visualizza il testo fittizio ogni volta che il campo di testo è vuoto.
• is_password: (Facoltativo) Un'etichetta aggiuntiva, situata immediatamente dopo il campo modulo. Accetta caratteri alfanumerici e simboli. Le potenziali applicazioni includono l'indicazione di un'unità, specialmente se il campo viene usato con i numeri. Ad esempio, se si utilizza il campo come input per i numeri di pixel, si inserirà il valore come "px". Oppure, se come unità di percentuale, devi inserire '%' come valore.

Tutti questi parametri sono di tipo stringa aspettarsi per il is_password parametro che è booleano. Se non hai bisogno dei parametri opzionali, non è necessario includerli.

Contenitori disponibili per l'opzione Tipo testo

I contenitori sono fondamentalmente le pagine di amministrazione, le schede, i meta-box e le sezioni di personalizzazione del tema. Queste sono essenzialmente le aree in cui metti le tue opzioni. Non tutti i tipi di opzioni possono essere inseriti in questi contenitori. Ma il testo l'opzione di tipo può essere utilizzata in qualsiasi contenitore, ad es .:

• Pannello di Amministrazione
• Scheda Amministratore
• Metabox
• Personalizzazione del tema

Riesaminiamo come creare le opzioni in Titan Framework:

• Chiama un'istanza unica tramite getInstance () funzione.
• Creare opzioni tramite il createOption () funzione all'interno di un contenitore.
• Ottieni i valori dell'opzione salvata tramite getOption () funzione.

Quindi, rivediamo come a testo l'opzione di tipo viene creata all'interno di ciascuno di questi contenitori.

Creazione di un'opzione Tipo di testo all'interno di un pannello di amministrazione

Esempio di dichiarazione

Il codice seguente viene utilizzato mentre si aggiunge un testoopzione all'interno di un pannello di amministrazione:

createOption (array ('id' => 'aa_txt', // L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'text', // Tipo di opzione che stiamo creando 'name' => 'My Text Option', // Nome dell'opzione che verrà visualizzata nel pannello di amministrazione 'desc' => 'Questa è la nostra opzione' // Descrizione dell'opzione che verrà visualizzata nel pannello di amministrazione));

Questo codice aggiungerà a testodigitare l'opzione all'interno di un pannello di amministrazione $ aa_panel. Il createOption () funzione prende una serie di parametri che sono supportati dal testo opzione. 

In questo caso, ho usato parametri come id, tipo, nome e disc. Al di fuori di tutto ciò, l'ID è il parametro più importante e deve sempre essere unico. Sarà usato in seguito per ottenere i valori salvati. 

Quindi, a testo opzione con ID aa_txt e il nome 'La mia opzione di testo'è stato creato all'interno del pannello di amministrazione $ aa_panel. 

Lo screenshot qui sopra mostra La mia opzione di testo all'interno del pannello di amministrazione Opzioni ordinate. 

Questo è un pannello di amministrazione personalizzato ed è stato creato con Titan Framework. Se vuoi sapere come, fai riferimento ai precedenti articoli di questa serie.  

Esempio di utilizzo

Utilizzare il seguente codice per recuperare i valori salvati da questo testo opzione.

getOption ('aa_txt'); / ** * * Stampa il valore dell'opzione * * / echo $ aa_txt_val; // Stampa il valore salvato nell'opzione aa_txt 

Ho usato l'ID del testo opzione come parametro all'interno di getOption () funzione e salvato il valore in una variabile $ aa_txt_val. Ecco! Tutto ciò che resta da fare è usare questo valore, che ho fatto usando il eco comando.

Visualizzazione del risultato sul front-end

Supponiamo di aver inserito il valore demo 'Impostazioni di testo AA ' e salvato. Quindi ecco lo screenshot dell'output del codice sopra.

Creazione di un'opzione di tipo di testo all'interno di una scheda di amministrazione

Esempio di dichiarazione

Diamo un'occhiata al codice di a testo opzione all'interno di una scheda di amministrazione.

createOption (array ('id' => 'aa_txt_in_tab1_panel2', // ID deve essere sempre univoco. L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'text', // Type of option we are creando 'name' => 'My Text Option', // Nome dell'opzione che verrà visualizzata nel pannello di amministrazione 'desc' => 'Questa è la nostra opzione' // Descrizione dell'opzione che verrà visualizzata nell'admin pannello));

Questa volta ho creato un testo digitare l'opzione con ID aa_txt_in_tab1_panel2 dentro $ aa_tab1. $ aa_tab1 è una scheda di amministrazione che esiste all'interno di un pannello di amministrazione personalizzato $ aa_panel2. Il processo di creazione di una scheda di amministrazione è stato spiegato nei miei articoli precedenti. Quindi, puoi fare riferimento a loro per aiuto.

Nota che ho usato lo stesso nome, il che significa che i nomi possono essere gli stessi, ma gli ID sono sempre unici.

L'immagine sopra mostra il La mia opzione di testo dentro Scheda 1 di pannello Opzioni Neat 2.

Esempio di utilizzo

Recuperiamo i valori salvati da questo testo opzione.

getOption ('aa_txt_in_tab1_panel2'); / ** * * Stampa il valore dell'opzione * * /?> 
 Il valore della casella di testo della prima scheda è:  

Il getOption () la funzione recupera il valore salvato tramite ID aa_txt_in_tab1_panel2 e poi l'ho stampato tramite il eco comando.

Visualizzazione del risultato sul front-end

Il valore che ho inserito era 'Impostazioni di testo AA ' e il suo output sul front-end assomiglia a questo:

Creazione di un'opzione di testo all'interno di un metabox

Esempio di dichiarazione

Puoi aggiungere un testodigitare l'opzione all'interno di un metabox tramite il seguente codice:

createOption (array ('id' => 'aa_mb_txt', // L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'text', // Tipo di opzione che stiamo creando 'name' => 'My Text Option', // Nome dell'opzione che verrà visualizzata nel pannello di amministrazione 'desc' => 'Questa è la nostra opzione' // Descrizione dell'opzione che verrà visualizzata nel pannello di amministrazione)); 

Di nuovo il createOption () la funzione aggiunge a testo opzione all'interno di un metabox chiamato $ aa_metbox. Gli stessi parametri sono usati qui e l'ID è aa_mb_txt.

L'immagine sopra mostra una schermata di modifica della pagina in cui puoi trovare un nuovo metabox con 'Opzione My Text ' dentro. Abbiamo creato i metabox in un precedente articolo di questa serie, quindi fai riferimento a questo se hai bisogno di rivedere i tuoi concetti.

Esempio di utilizzo

Quindi, ecco il codice per ottenere i valori salvati.

getOption ('aa_mb_txt', get_the_ID ()); / ** * * Stampa il valore dell'opzione * * /?> 
 Il valore dell'opzione di metabox txt per questa pagina è:  
 

Tutto è praticamente lo stesso eccetto che alla linea # 15 dove il getOption () la funzione ha due parametri:

• aa_mb_txt, che è l'ID del tipo di testo che abbiamo creato
  
• get_the_ID () funzione, che restituirà l'ID del post corrente / pagina / post_type.

Dopo ciò, ho appena usato il eco comando e stampa il valore.

Visualizzazione del risultato sul front-end

Ho salvato 'Impostazioni di testo AA ' come il valore di questa opzione e pubblicato la pagina. Il codice sopra è stato usato per mostrare quel valore sul front-end.

Creazione di un'opzione Tipo testo all'interno di Personalizzazione tema

Esempio di dichiarazione

Infine, scriviamo il codice per creare un testoinserisci un'opzione all'interno di una sezione di personalizzazione del tema.

createOption (array ('id' => 'aa_sec_head_txt', // L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'text', // Tipo di opzione che stiamo creando 'name' => 'Site Header Text', // Nome dell'opzione che verrà visualizzata nel pannello di amministrazione 'desc' => 'Questa è l'intestazione del sito' // Valore predefinito della nostra opzione));

UN testodigitare l'opzione con ID aa_sec_head_txt viene creato all'interno di una sezione di personalizzazione del tema $ aa_section1. Fare riferimento ai miei articoli precedenti se si desidera imparare come aggiungere sezioni di personalizzazione in Titan Framework.

L'immagine sopra mostra una sezione di personalizzazione del tema chiamata La mia sezione in cui a Testo dell'intestazione del sito l'opzione viene visualizzata.

Esempio di utilizzo

Ecco il codice per ottenere i valori salvati.

getOption ('aa_sec_head_txt'); / ** * * Stampa il valore dell'opzione * * /?> 
  

aa_sec_head_txt è un testotipo opzione, e ho recuperato il suo valore di nuovo con il getOption () funzione. Nessuna scienza missilistica qui.

Visualizzazione del risultato sul front-end

Entrai 'Il mio testo Opzione Intestazione' e puoi vedere il risultato dell'anteprima dal vivo di seguito:

Quindi, copriamo il textarea tipo di opzione in Titan Framework. Esaminiamo come è possibile sfruttare Titan Framework per creare un textarea digita l'opzione nei pannelli di amministrazione, nelle caselle meta e nella sezione di personalizzazione con solo poche righe di codice.

L'opzione Textarea Type in Titan Framework

Devi aver visto il textarea inserisci l'opzione in diversi plugin e temi di WordPress. Con Titan Framework, puoi aggiungere questo tipo di opzione con createOption () funzione. Alcuni parametri di questa opzione sono:

• nome: Questo parametro decide il nome visualizzato di textarea.
• id: Questo è un nome univoco che viene utilizzato per recuperare i valori delle opzioni salvate.
• disc: Visualizza una descrizione di una riga con il nome dell'opzione.
• predefinito: (Opzionale) Rappresenta l'impostazione predefinita di textareaopzione.
• anteprima dal vivo: (Facoltativo) Questo parametro funziona esclusivamente con la sezione di personalizzazione del tema e mostra un'anteprima in tempo reale delle modifiche apportate.
• css: (Opzionale) Genera CSS ogni volta a textareal'opzione è creata all'interno di una pagina di amministrazione e / o sezione di personalizzazione del tema.
• segnaposto: (Opzionale) Se vuoi che compaia del testo fittizio all'interno del tuo textareaopzione quindi utilizzare questo parametro.
• is_code: (Facoltativo) Questo parametro esegue un controllo per l'input del codice più bello e se è vero, il carattere del codice diventa monospazio.

Tutti i parametri sono del tipo stringa, tranne per il is_code che è booleano. 

Contenitori disponibili per l'opzione Tipo area di testo

Questa opzione ha tipo textarea e può essere aggiunto in luoghi come:

• Pagina di amministrazione
• Scheda Amministratore
• Metabox
• Personalizzazione del tema

Ma prima di spiegare come aggiungere questa opzione in tutti questi contenitori, vorrei riassumere i passaggi fondamentali che dovrebbero essere seguiti:

• Chiama il getInstance () funzione all'inizio di ogni nuovo file quando viene utilizzato Titan Framework.
• Utilizzare il createOption () funzione per aggiungere qualsiasi nuova opzione.
• Ottieni i valori delle opzioni salvate chiamando il getOption () funzione.

Tenendo le cose al punto, spiegherò solo come aggiungere questa opzione all'interno di questi contenitori. Se vuoi sapere come creare questi contenitori, leggi gli articoli precedenti di questa serie.

Creazione di un'opzione Textarea Type All'interno di un pannello di amministrazione

Esempio di dichiarazione

Creerò a textareaopzione all'interno di un pannello di amministrazione con il seguente codice.

createOption (array ('id' => 'aa_txtarea', // L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'textarea', // Tipo di opzione che stiamo creando 'name' => 'My Textarea Option', // Nome dell'opzione che verrà visualizzata nel pannello di amministrazione 'desc' => 'Questa è la nostra opzione' // Descrizione dell'opzione che verrà visualizzata nel pannello di amministrazione));

UN textareaviene creato all'interno di un pannello di amministrazione $ aa_panel via il createOption ()funzione. Questa funzione occupa una serie di parametri e userò solo quelli supportati dall'opzione. Ho usato id, genere, nome e disc. Il parametro genere è ciò che determina quale tipo di opzione è.

UN textareaopzione con ID aa_txtarea e nome La mia opzione Textarea è mostrato nello screenshot qui sopra, che abbiamo appena creato.

Esempio di utilizzo

Ora recupererò il valore salvato di qualunque cosa un utente finale entri in questa textarea.

getOption ('aa_txtarea'); / ** * * Stampa il valore dell'opzione * * / echo $ aa_txtarea_val; // Stampa il valore salvato nell'opzione aa_txt

Per recuperare i valori salvati, prima ottenere un'istanza unica tramite il getInstance () funzione, seguita dal getOption () funzione, all'interno della quale utilizziamo l'ID di textareacome parametro. 

Successivamente, stampare il valore salvato sul front-end tramite eco comando.

Visualizzazione del risultato sul front-end

Inseriamo qualsiasi testo fittizio all'interno del nostro textarea e salvalo.

Ecco lo screenshot dell'output sul front-end.

Ora creiamo questa opzione all'interno di una scheda di amministrazione.

Creazione di un'opzione Tipo area di testo all'interno di una scheda Amministrazione

Esempio di dichiarazione

Ecco il codice:

createOption (array ('id' => 'aa_txtarea_in_tab1_panel2', // ID deve essere sempre univoco. L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'textarea', // Tipo di opzione che siamo creando 'nome' => 'My Textarea Option', // Nome dell'opzione che verrà visualizzata nel pannello di amministrazione 'desc' => 'Questa è la nostra opzione' // Descrizione dell'opzione che verrà visualizzata nell'admin pannello)); 

Ho creato un textarea opzione con ID aa_txtarea_in_tab1_panel2 all'interno di una scheda di amministrazione $ aa_panel2. Sembra contro il nome La mia opzione Textarea.

L'immagine sopra mostra questa opzione all'interno del mio secondo pannello di amministrazione, cioè. Opzioni Neat 2. 

Esempio di utilizzo

Prendiamo i valori salvati.

getOption ('aa_txtarea_in_tab1_panel2'); / ** * * Stampa il valore dell'opzione * * / 
 
 Il valore della casella textarea della prima scheda è: 
 
  

Ancora una volta ottieni un'istanza, quindi usa il getOption () funzione e inserire ID come parametro. Successivamente stamperò l'output sul front-end usando il ecocomando all'interno di un tag div.

Visualizzazione del risultato sul front-end

Sto usando lo stesso testo fittizio ancora una volta come esempio.

Il risultato finale è mostrato sopra.

Creazione di un'opzione di tipo textarea all'interno di un metabox

Esempio di dichiarazione

Ora creerò un textareaopzione all'interno di un metabox.

createOption (array ('id' => 'aa_mb_txtarea', // L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'textarea', // Tipo di opzione che stiamo creando 'name' => 'My Textarea Option', // Nome dell'opzione che verrà visualizzata 'desc' => 'Questa è la nostra opzione' // Descrizione dell'opzione che verrà visualizzata));

Il createOption () la funzione aggiunge a textarea con ID aa_mb_txtarea all'interno di un metabox $ aa_metbox. Questa opzione viene visualizzata su tutte le schermate di modifica di pagina / post.

Lo screenshot qui sopra mostra a textarea di nome La mia opzione Textarea proprio alla fine di una schermata di modifica della pagina. Lo stesso appare anche all'interno del Aggiungi nuovo post sezione.

Esempio di utilizzo

Ora scriverò il codice per recuperare i valori delle opzioni salvate.

getOption ('aa_mb_txtarea', get_the_ID ()); / ** * Stampa il valore dell'opzione * / 
 
Il valore dell'area di testo opzione metabox per questa pagina è:
 
  

Ripeti di nuovo il processo, cioè prendi prima un'istanza e poi usa il getOption () funzione e inviare l'ID del textarea con l'ID del nostro post_type. Il risultato è salvato in una variabile chiamata $ aa_mb_txtarea_val. Infine, ho fatto eco all'output in un tag div.

Visualizzazione del risultato sul front-end

Carichiamo l'output finale sul front-end.

Passiamo alla parte finale in cui creerò a textareaopzione all'interno di una sezione di personalizzazione del tema.

Creazione di un'opzione di tipo area di testo all'interno di una sezione di personalizzazione di temi

Esempio di dichiarazione

Usa il seguente codice.

createOption (array ('id' => 'aa_sec_desc_txtarea', // L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'textarea', // Tipo di opzione che stiamo creando 'name' => 'Descrizione del sito Textarea', // Nome dell'opzione che verrà visualizzata 'desc' => 'Questa è la descrizione del sito' // Valore predefinito della nostra opzione));

UN textareacon ID aa_sec_desc_txtarea esiste all'interno di una sezione di personalizzazione del tema $ aa_section1. 

UNtextarea l'opzione di tipo nella figura sopra è visualizzata rispetto al nome Descrizione del sito Textarea all'interno del La mia sezione sezione di personalizzazione del tema.

Esempio di utilizzo

Prendiamo i valori delle opzioni salvate.

getOption ('aa_sec_desc_txtarea'); / ** * * Stampa il valore dell'opzione * * / 
  
  

Questo codice recupera e stampa il valore più o meno allo stesso modo di cui sopra.

Visualizzazione del risultato sul front-end

Ecco l'anteprima dal vivo del mio contributo.

Puoi utilizzare questa opzione, ad esempio, per aggiungere una breve descrizione sulla tua pagina di destinazione.

Conclusione

Questo è tutto. Ora sai dove e come a testotipo opzione e il textarea l'opzione type può essere aggiunta con Titan Framework. 

Ho visto persone che creano prodotti abusare dell'opzione del tipo di testo in luoghi in cui un utente finale potrebbe voler aggiungere più dati di poche parole. Dovresti sempre usare il textarea digitare l'opzione in questo caso.

L'intero processo è abbastanza semplice e facile. Spero ti sia piaciuto leggere questo articolo. Se hai qualche domanda puoi commentare qui sotto o contattarmi su Twitter.