Guida per principianti a Titan Framework aggiunta di un'opzione di tipo Abilita

Fornire agli utenti finali l'opzione di abilitare o disabilitare determinate funzionalità di un plug-in premium o di un tema è piuttosto comune. Titan Framework ha recentemente spinto una nuova opzione al suo nucleo che fa esattamente questo. Vediamo come è possibile aggiungere un pulsante di attivazione / disattivazione in un pannello di amministrazione, un metabox o una sezione di personalizzazione del tema con Titan Framework (TF).

L'opzione Abilita tipo in Titan Framework

C'è un abilitare digitare l'opzione in Titan Framework per creare abilita / disabilita i pulsanti di attivazione / disattivazione. Nella dashboard, il abilitare l'opzione type appare così: 

Ecco i suoi parametri:

• nome: Assegna il nome visualizzato di a abilitare tipo opzione.
• id: Questo parametro specifica un nome univoco che ottiene i valori delle opzioni salvate.
• disc: Aggiunge una breve descrizione con il nome dell'opzione.
• predefinito: (Opzionale) Assegna il valore predefinito.
• abilitato: (Opzionale) È l'etichetta per il pulsante del abilitato stato. L'impostazione predefinita è impostata su Abilitato.
• Disabilitato: (Opzionale) È l'etichetta per il pulsante del Disabilitato stato. L'impostazione predefinita è impostata su Disabilitato.
• anteprima dal vivo: (Opzionale) Ogni volta che aggiungi un abilitare digita l'opzione in una sezione di personalizzazione del tema, questo parametro ti consente di vivere in anteprima le modifiche che apporti.

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

Contenitori disponibili per l'opzione Abilita tipo

Puoi aggiungere questa opzione all'interno:

• Pannello di Amministrazione
• Scheda Amministratore
• Metabox
• Sezione di personalizzazione del tema

Per aggiungere un abilitare digitare l'opzione in questi contenitori, attenersi alla seguente procedura:

• Ottieni un'istanza tramite il getInstance () funzione.
• Creare un'opzione tramite il createOption () funzione.
• Ottieni valori salvati tramite il getOption () funzione.

Se sei interessato a imparare come creare questi contenitori con TF, leggi i precedenti articoli di questa serie.

Creazione di un'opzione Abilita tipo all'interno di un pannello di amministrazione

Esempio di dichiarazione

Creiamo prima questa opzione in un pannello di amministrazione.

createOption (array ('id' => 'aa_enable_opt', // L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'enable', // Tipo di opzione che stiamo creando 'name' => 'Permetti CSS personalizzati', // Nome dell'opzione che verrà visualizzata nel pannello di amministrazione 'desc' => 'Abilita / Disabilita CSS personalizzato', // Descrizione dell'opzione che verrà visualizzata nel pannello di amministrazione 'default' => true // Valore predefinito dell'opzione)); 

Alla riga n. 8, ho aggiunto un abilitare digitare l'opzione tramite il createOption () funzione in un pannello di amministrazione $ aa_panel. Poiché questa funzione occupa un array, ho definito i valori dei parametri nome, tipo, id, desc e predefinito. Il valore dell'ID deve essere univoco, vale a dire. aa_enable_opt. Il valore di predefinito è impostato per vero, il che significa che lo stato dell'opzione è impostato suabilitato'Di default.

Nello screenshot qui sopra, c'è un abilitare digitare l'opzione denominata Consenti CSS personalizzato in un pannello di amministrazione Opzioni ordinate.

Esempio di utilizzo

Prendiamo i valori salvati.

getOption ('aa_enable_opt'); / ** * * Stampa valore salvato * * / if (1 == $ aa_enable_opt_val) echo "Custom CSS nella scheda admin è On.";  else echo "Custom CSS nella scheda admin è Off."; ?>

Per ottenere il valore salvato, prima ottenere un'istanza tramite il getInstance () funzione (riga # 3). Quindi alla riga n. 6, il getOption () la funzione recupera il valore salvato registrando l'ID opzione aa_enable_opt come il suo parametro. Ho salvato il risultato all'interno di una nuova variabile $ aa_enable_opt_val. Quindi ho usato un se altro controlla quale stampa il valore salvato sul front-end.  

Ora il abilitare l'opzione type può contenere due valori: o 1/0 o vero falso. Il valore è '1' (stato abilitato) o '0' (stato disabilitato). Considerando questo fatto, ho scritto le righe da 15 a 20 del codice, che controlla il valore della variabile $ aa_enable_opt_val. Se è "1", allora stampa "Il CSS personalizzato nel pannello di amministrazione è abilitato ' al front-end. Se il valore della variabile è '0', allora stampa 'CSS personalizzato nel pannello di amministrazione è disabilitato'.

Visualizzazione del risultato sul front-end

Supponiamo che abbia abilitato l'opzione e l'abbia salvata.

Ecco uno screenshot del risultato finale che è apparso sul front-end.

Creazione di un'opzione Abilita tipo in una scheda Amministrazione

Esempio di dichiarazione

Successivamente creerò questa opzione in una scheda di amministrazione.

createOption (array ('id' => 'aa_enable_opt_in_tab', // L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'enable', // Tipo di opzione che stiamo creando 'name' => 'Consenti CSS personalizzato', // Nome dell'opzione che verrà visualizzata nel pannello di amministrazione 'desc' => 'Abilita / Disabilita CSS personalizzato', // Descrizione dell'opzione che verrà visualizzata nel pannello di amministrazione 'abilitato' => 'On', // Etichetta per l'opzione abilitata 'disabled' => 'Off' // Etichetta per l'opzione disabilitata)); 

Qui, ho aggiunto questa opzione in una scheda di amministrazione $ aa_tab1. Il valore dell'ID è aa_enable_opt_in_tab. Questa volta, ho anche definito nuove etichette per il abilitato e Disabilitato parametri. 

Nell'immagine, c'è un abilitare digitare l'opzione all'interno Scheda 1 di pannello Opzioni Neat 2. Nota anche le nuove etichette definiteSopra'per abilitare e'via'per disabilitare.

Esempio di utilizzo

Ora avrò i valori salvati.

getOption ('aa_enable_opt_in_tab'); / ** * * Stampa valore salvato * * / if (1 == $ aa_enable_opt_in_tab_val) echo "Custom CSS nella scheda admin è On.";  else echo "Custom CSS nella scheda admin è Off."; ?>

Il codice è molto simile a quello che ho scritto sopra. Quindi, mi permetta di riassumere tutti i passaggi:

• Ottieni un'istanza unica tramite getInstance () funzione alla linea # 4.
• Ottieni il valore salvato tramite getOption () funzione alla linea # 7.
• Stampa il valore salvato sul front-end tramite se altro dichiarazione di controllo sulle righe da 15 a 20.

Visualizzazione del risultato sul front-end

Questa volta ho attivato l'opzione via. Il front-end stampa la seguente riga:

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

Esempio di dichiarazione

Ora creerò un abilitare digita l'opzione in un metabox.

createOption (array ('id' => 'aa_enable_opt_in_metabox', // L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'enable', // Tipo di opzione che stiamo creando 'name' => 'Permetti CSS personalizzati', // Nome dell'opzione che verrà visualizzata 'desc' => 'Abilita / Disabilita CSS personalizzato', // Descrizione dell'opzione che verrà visualizzata 'default' => false // Valore predefinito di l'opzione ) ); 

Qui ho aggiunto ancora un altro abilitare digita l'opzione in un metabox $ aa_metbox. Il suo ID è aa_enable_opt_in_metabox. Il valore di predefinito è impostato per falso.

Nello screenshot qui sopra, puoi trovare questa opzione in un metabox. Appare su tutte le pagine e le schermate di post-editing.

Esempio di utilizzo

Prendiamo il valore salvato per questa opzione.

getOption ('aa_enable_opt_in_metabox', get_the_ID ()); / ** * Stampa valore salvato * * / if (1 == $ aa_enable_opt_in_metabox_val) echo "Il CSS personalizzato in un metabox è abilitato.";  else echo "I CSS personalizzati in un metabox sono disabilitati."; ?>

Ho scritto di nuovo lo stesso codice. L'unica differenza può essere individuata alla riga n. Esiste un nuovo parametro all'interno del getOption () funzione. Questo è il get_the_ID () funzione che viene utilizzata per recuperare una pagina specifica o un ID post.

Visualizzazione del risultato sul front-end

Andiamo di nuovo abilitare l'opzione e salvarlo. Il front-end appare così:

Creazione di un'opzione Abilita tipo in una sezione di personalizzazione di temi

Esempio di dichiarazione

Infine, creerò questa opzione in una sezione di personalizzazione del tema.

createOption (array ('id' => 'aa_enable_opt_in_sec', // L'ID che verrà utilizzato per ottenere il valore di questa opzione 'type' => 'enable', // Tipo di opzione che stiamo creando 'name' => 'Permetti CSS personalizzati', // Nome dell'opzione che verrà visualizzata 'desc' => 'Abilita / Disabilita CSS personalizzato', // Descrizione dell'opzione che verrà visualizzata 'default' => false // Valore predefinito di l'opzione ) ); 

Qui ho creato questa opzione in una sezione di personalizzazione del tema $ aa_section1. Il suo ID univoco è aa_enable_opt_in_sec. Il resto dei parametri sono gli stessi.

Nell'immagine sopra, c'è un abilitare digitare l'opzione in una sezione di personalizzazione del tema denominata La mia sezione.

Esempio di utilizzo

Utilizzare il seguente codice per ottenere i valori salvati.

getOption ('aa_enable_opt_in_sec'); / ** * * Stampa valore salvato * * / if (1 == $ aa_enable_opt_in_sec_val) echo "Il CSS personalizzato in una sezione di personalizzazione è abilitato.";  else echo "I CSS personalizzati in una sezione di personalizzazione sono disabilitati."; ?>

Ancora una volta, il codice è esattamente lo stesso. Solo l'ID e i nomi delle variabili sono diversi.

Visualizzazione del risultato sul front-end

Ecco lo screenshot, che mostra le modifiche nella modalità di anteprima dal vivo.

Conclusione

Dal punto di vista dell'utente finale, il abilitare l'opzione type è abbastanza utile, in quanto è possibile abilitare o disabilitare qualsiasi funzionalità con un solo clic. Quindi segui questo tutorial e condividi le tue opinioni al riguardo nella sezione dei commenti.

A questo punto, abbiamo coperto tutto quello che c'è da sapere su Titan Framework. Ricordati di controllare la pagina della serie se hai domande o commenti su uno qualsiasi degli argomenti trattati. Oppure sentiti libero di contattarmi su Twitter.