Titan Framework offre une vaste gamme d'options que vous pouvez ajouter dans un plugin ou un thème pour fournir aux utilisateurs finaux des paramètres dynamiques. Aujourd’hui, je vais aborder deux des options les plus élémentaires: un texte type option et un zone de texte option. Voyons comment créer une option de type texte dans un panneau d'administration, une section metabox ou un personnaliseur de thème..

Options de type de texte dans Titan Framework

Titan Framework propose plusieurs types d’options. Nous allons maintenant examiner celle qui contient le type texte. Voici à quoi ça ressemble:

le texteL'option type de Titan Framework comporte une vaste gamme de paramètres de réglage:

• prénom: Ceci contrôle le nom avec lequel l'option est affichée.
• identifiant: Un nom unique utilisé pour obtenir les valeurs sauvegardées.
• desc: Il affiche une brève description avec le nom de l'option.
• défaut: Ce paramètre spécifie la valeur par défaut de l'option.
• livepreview: (Facultatif) Ce paramètre n'est utilisé que lorsqu'un texte L'option type est utilisée dans la section de personnalisation du thème. Il est utile d’afficher un aperçu en direct des modifications apportées à votre thème..
• css: (Facultatif) Lorsqu'un champ de texte est ajouté dans une page d'administration ou une section de personnalisation de thème, ce paramètre peut aider à la génération de CSS. Comment?
• espace réservé: (Facultatif) Ceci affiche un texte factice chaque fois que le champ de texte est vide..
• is_password: (Facultatif) Une étiquette supplémentaire, située immédiatement après le champ de formulaire. Accepte les caractères alphanumériques et les symboles. Les applications potentielles incluent l’indication d’une unité, en particulier si le champ est utilisé avec des nombres. Par exemple, si vous utilisez le champ comme entrée pour le nombre de pixels, vous devez entrer la valeur sous la forme "px". Ou, si en unité de pourcentage, vous entrez% comme valeur.

Tous ces paramètres sont de type chaîne attendre pour le is_password paramètre qui est booléen. Si vous n'avez pas besoin des paramètres facultatifs, il n'est pas nécessaire de les inclure..

Conteneurs disponibles pour l'option de type de texte

Les conteneurs sont essentiellement vos pages d’administrateur, vos onglets, vos boîtes à méta et vos sections de personnalisation de thème. Ce sont essentiellement les domaines dans lesquels vous mettez vos options. Tous les types d'options ne peuvent pas être placés dans ces conteneurs. Mais le texte L’option type peut être utilisée dans n’importe quel conteneur, à savoir:

• panneau d'administration
• Onglet Admin
• Metabox
• Personnalisateur de thème

Révisons comment créer des options dans Titan Framework:

• Appelez une instance unique via le getInstance () une fonction.
• Créer des options via le createOption () fonctionner à l'intérieur d'un conteneur.
• Obtenir les valeurs de l'option enregistrée via le getOption () une fonction.

Alors, passons en revue comment un texte L'option type est créée dans chacun de ces conteneurs.

Création d'une option de type de texte dans un panneau d'administration

Exemple de déclaration

Le code suivant est utilisé lorsque vous ajoutez un texteoption dans un panneau d'administration:

createOption (array ('id' => 'aa_txt', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'text', // Le type d'option que nous créons est 'name' => 'Mon option texte', // Nom de l'option qui sera affichée dans le panneau d'administration 'desc' => 'Ceci est notre option' // Description de l'option qui sera affichée dans le panneau d'administration));

Ce code va ajouter un textetype option dans un panneau d'administration $ aa_panel. le createOption () fonction prend un tableau de paramètres qui sont pris en charge par le texte option. 

Dans ce cas, j'ai utilisé des paramètres tels que identifiant, type, nom et desc. Parmi tous ceux-ci, l'ID est le paramètre le plus important et doit toujours être unique. Il sera utilisé plus tard pour obtenir les valeurs sauvegardées. 

Donc, un texte option avec ID aa_txt et nom 'Mon option de texte'a été créé dans le panneau d'administration $ aa_panel. 

La capture d'écran ci-dessus montre Mon option de texte à l'intérieur du panneau d'administration Options soignées. 

Il s'agit d'un panneau d'administration personnalisé créé avec Titan Framework. Si vous voulez savoir comment, alors référez-vous aux précédents articles de cette série.  

Exemple d'utilisation

Utilisez le code suivant pour récupérer les valeurs enregistrées à partir de cette texte option.

getOption ('aa_txt'); / ** * * Affiche la valeur de l'option * * / echo $ aa_txt_val; // Affiche la valeur enregistrée dans l'option aa_txt 

J'ai utilisé l'identifiant du texte option en tant que paramètre à l'intérieur du getOption () fonction et enregistré la valeur dans une variable $ aa_txt_val. Voila! Tout ce qui reste à faire est d’utiliser cette valeur, ce que j’ai fait en utilisant le écho commander.

Affichage du résultat au début

Supposons que je suis entré dans la valeur de démonstration 'Paramètres de texte AA ' et sauvé. Alors, voici la capture d'écran de la sortie du code ci-dessus.

Création d'une option de type de texte dans un onglet Admin

Exemple de déclaration

Regardons le code d'un texte option dans un onglet administrateur.

createOption (array ('id' => 'aa_txt_in_tab1_panel2', // les ID doivent toujours être uniques. L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'text', // Type d'option que nous sommes creation 'name' => 'Mon option texte', // Nom de l’option qui sera affichée dans le panneau d’administration 'desc' => 'Ceci est notre option' // Description de l’option qui sera affichée dans l ’admin panneau));

Cette fois j'ai créé un texte type option avec ID aa_txt_in_tab1_panel2 à l'intérieur $ aa_tab1. $ aa_tab1 est un onglet administrateur qui existe dans un panneau d'administration personnalisé $ aa_panel2. Le processus de création d'un onglet administrateur a été expliqué dans mes articles précédents. Donc, vous pouvez vous y référer pour obtenir de l'aide.

Notez que j'ai utilisé le même nom, ce qui signifie que les noms peuvent être identiques, mais les identifiants sont toujours uniques.

La capture d'écran ci-dessus montre la Mon option de texte à l'intérieur Onglet 1 de panneau Options soignées 2.

Exemple d'utilisation

Récupérons les valeurs sauvegardées de cette texte option.

getOption ('aa_txt_in_tab1_panel2'); / ** * * Affiche la valeur de l’option * * /?> 
 La valeur du premier onglet est la suivante:  

le getOption () fonction récupère la valeur enregistrée via ID aa_txt_in_tab1_panel2 et puis je l'ai imprimé via le écho commander.

Affichage du résultat au début

La valeur que j'ai entrée était 'Paramètres de texte AA ' et sa sortie sur le front-end ressemble à ceci:

Création d'une option de type de texte dans une metabox

Exemple de déclaration

Vous pouvez ajouter un textetype option dans une metabox via le code suivant:

createOption (array ('id' => 'aa_mb_txt', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'text', // Type d'option que nous créons 'name' => 'Mon option texte', // Nom de l'option qui sera affichée dans le panneau d'administration 'desc' => 'Ceci est notre option' // Description de l'option qui sera affichée dans le panneau d'administration)); 

Encore la createOption () la fonction ajoute un texte option dans une metabox nommée $ aa_metbox. Les mêmes paramètres sont utilisés ici et l'ID est aa_mb_txt.

La capture d'écran ci-dessus affiche un écran de modification de page dans lequel vous pouvez trouver une nouvelle métabox avec 'Mon option de texte ' à l'intérieur. Nous avons créé des métaboxes dans un article précédent de cette série. Consultez-le si vous avez besoin de réviser vos concepts..

Exemple d'utilisation

Alors, voici le code pour obtenir les valeurs sauvegardées.

getOption ('aa_mb_txt', get_the_ID ()); / ** * * Affiche la valeur de l’option * * /?> 
 La valeur de l'option metabox txt pour cette page est:  
 

Tout est à peu près la même chose sauf à la ligne 15 où le getOption () fonction a deux paramètres:

• aa_mb_txt, qui est l'ID de l'option de type de texte que nous avons créée
  
• get_the_ID () fonction, qui retournera l'ID de la publication / page / type_passe en cours.

Après cela, je viens d'utiliser le écho commande et imprimé la valeur.

Affichage du résultat au début

J'ai sauvé 'Paramètres de texte AA ' comme valeur de cette option et publié la page. Le code ci-dessus a été utilisé pour afficher cette valeur au début du processus..

Création d'une option de type de texte dans le personnaliseur de thème

Exemple de déclaration

Enfin, écrivons le code pour créer un texteoption de type dans une section de personnalisation de thème.

createOption (array ('id' => 'aa_sec_head_txt', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'text', // Type d'option que nous créons 'name' => 'Texte d'en-tête de site', // Nom de l'option qui sera affichée dans le panneau d'administration 'desc' => 'Ceci est l'en-tête du site' // Valeur par défaut de notre option));

UNE textetype option avec ID aa_sec_head_txt est créé dans une section de personnalisation de thème $ aa_section1. Reportez-vous à mes articles précédents si vous souhaitez savoir comment ajouter des sections de personnalisation dans Titan Framework..

La capture d'écran ci-dessus montre une section de personnalisation de thème nommée Ma section dans lequel un Texte d'en-tête de site l'option est affichée.

Exemple d'utilisation

Voici le code pour obtenir les valeurs sauvegardées.

getOption ('aa_sec_head_txt'); / ** * * Affiche la valeur de l’option * * /?> 
  

aa_sec_head_txt est un textetapez option, et j'ai récupéré sa valeur à nouveau avec le getOption () une fonction. Aucune science de fusée ici.

Affichage du résultat au début

Je suis entré 'Mon texte Option Entête' et vous pouvez voir le résultat de l'aperçu en direct ci-dessous:

Ensuite, couvrons le zone de texte option de type dans Titan Framework. Passons en revue comment vous pouvez utiliser Titan Framework pour créer un zone de texte option de type dans les panneaux d'administration, les boîtes à méta et la section de personnalisation avec seulement quelques lignes de code.

L'option de type Textarea dans Titan Framework

Vous devez avoir vu le zone de texte type option dans plusieurs plugins et thèmes WordPress. Avec Titan Framework, vous pouvez ajouter ce type d’option avec le createOption () une fonction. Certains paramètres de cette option sont:

• prénom: Ce paramètre détermine le nom d'affichage du zone de texte.
• identifiant: Il s'agit d'un nom unique utilisé pour récupérer les valeurs d'option enregistrées.
• desc: Il affiche une description d'une ligne avec le nom de l'option.
• défaut: (Facultatif) Il représente le paramètre par défaut du zone de texteoption.
• livepreview: (Facultatif) Ce paramètre fonctionne exclusivement avec la section de personnalisation du thème et affiche un aperçu en direct des modifications apportées..
• css: (Facultatif) Il génère du CSS chaque fois qu'un zone de texteL'option est créée dans une page d'administrateur et / ou une section de personnalisation de thème..
• espace réservé: (Facultatif) Si vous voulez qu'un texte factice apparaisse à l'intérieur de votre zone de texteoption puis utilisez ce paramètre.
• is_code: (Facultatif) Ce paramètre vérifie la qualité de la saisie de code. Si la valeur est true, la police du code devient monospace..

Tous les paramètres sont du type chaîne, sauf pour le is_code lequel est booléen. 

Conteneurs disponibles pour l'option Type de Textarea

Cette option a le type zone de texte et peut être ajouté dans des endroits tels que:

• Page d'administration
• Onglet Admin
• Metabox
• Personnalisateur de thème

Mais avant d’expliquer comment ajouter cette option dans tous ces conteneurs, permettez-moi de résumer les étapes de base à suivre:

• Appeler le getInstance () fonctionne au début de chaque nouveau fichier lorsque Titan Framework est utilisé.
• Utilisez le createOption () fonction pour ajouter une nouvelle option.
• Obtenez les valeurs des options enregistrées en appelant le getOption () une fonction.

En gardant les choses au point, je vais seulement expliquer comment ajouter cette option dans ces conteneurs. Si vous voulez savoir comment créer ces conteneurs, lisez les articles précédents de cette série..

Création d'une option de type Textarea dans un panneau d'administration

Exemple de déclaration

Je vais créer un zone de texteoption dans un panneau d'administration avec le code suivant.

createOption (array ('id' => 'aa_txtarea', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'textarea', // Type d'option que nous créons 'nom' => 'Mon option Textarea', // Nom de l'option qui sera affichée dans le panneau d'administration 'desc' => 'Ceci est notre option' // Description de l'option qui sera affichée dans le panneau d'administration));

UNE zone de texteest créé dans un panneau d'administration $ aa_panel via le createOption ()une fonction. Cette fonction prend un tableau de paramètres et je n'utiliserai que ceux que l'option prend en charge. J'ai utilisé identifiant, type, prénom et desc. Le paramètre type est ce qui détermine quel type d'option il est.

UNE zone de texteoption avec ID aa_txtarea et nom Mon option Textarea est montré dans la capture d'écran ci-dessus, que nous venons de créer.

Exemple d'utilisation

Maintenant, je vais récupérer la valeur enregistrée de ce que l'utilisateur final entre dans cette zone de texte.

getOption ('aa_txtarea'); / ** * * Affiche la valeur de l'option * * / echo $ aa_txtarea_val; // Affiche la valeur enregistrée dans l'option aa_txt

Pour récupérer les valeurs enregistrées, commencez par obtenir une instance unique via le getInstance () fonction, suivie de la getOption () fonction, dans laquelle on utilise l'ID de zone de texteen paramètre. 

Plus tard, imprimez la valeur sauvegardée sur le front-end via le bouton écho commander.

Affichage du résultat au début

Entrons n'importe quel texte factice à l'intérieur de notre zone de texte et enregistrez-le.

Voici la capture d'écran de la sortie au front-end.

Créons maintenant cette option dans un onglet administrateur.

Création d'une option de type Textarea dans un onglet Admin

Exemple de déclaration

Voici le code:

createOption (array ('id' => 'aa_txtarea_in_tab1_panel2', // les ID doivent toujours être uniques. L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'textarea', // Type d'option que nous sommes creation 'name' => 'Mon option Textarea', // Nom de l’option qui sera affichée dans le panneau d’administration 'desc' => 'Ceci est notre option' // Description de l’option qui sera affichée dans l ’admin panneau)); 

J'ai créé un zone de texte option avec ID aa_txtarea_in_tab1_panel2 dans un onglet administrateur $ aa_panel2. Il apparaît contre le nom Mon option Textarea.

La capture d'écran ci-dessus montre cette option dans mon deuxième panneau d'administration, c'est-à-dire. Options soignées 2. 

Exemple d'utilisation

Récupérons les valeurs sauvegardées.

getOption ('aa_txtarea_in_tab1_panel2'); / ** * * Affiche la valeur de l'option * * / 
 
 La valeur de la première zone de texte de tabulation est: 
 
  

Encore une fois obtenir une instance, puis utilisez le getOption () fonction et entrez ID en tant que paramètre. Ensuite, je vais imprimer la sortie sur le front-end en utilisant le échocommande dans une balise div.

Affichage du résultat au début

J'utilise encore le même texte factice à titre d'exemple.

Le résultat final est montré ci-dessus.

Création d'une option de type Textarea à l'intérieur d'un Metabox

Exemple de déclaration

Maintenant, je vais créer un zone de texteoption dans un metabox.

createOption (array ('id' => 'aa_mb_txtarea', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'textarea', // Type d'option que nous créons 'nom' => 'Mon option Textarea', // Nom de l'option à afficher 'desc' => 'Ceci est notre option' // Description de l'option à afficher));

le createOption () la fonction ajoute un zone de texte avec ID aa_mb_txtarea dans un metabox $ aa_metbox. Cette option apparaît sur tous les écrans de page / post-édition.

La capture d'écran ci-dessus montre un zone de texte nommé Mon option Textarea à la fin d'un écran de modification de page. La même chose apparaît également à l'intérieur du Ajouter un nouveau message section.

Exemple d'utilisation

Maintenant, je vais écrire le code pour récupérer ses valeurs d'options sauvegardées.

getOption ('aa_mb_txtarea', get_the_ID ()); / ** * Affiche la valeur de l'option * / 
 
La valeur de l'option metabox textarea pour cette page est:
 
  

Répétez le processus, c’est-à-dire commencez par obtenir une instance, puis utilisez le getOption () fonction et soumettre l'ID du zone de texte avec l'ID de notre post_type. Le résultat est enregistré dans une variable appelée $ aa_mb_txtarea_val. Enfin, j'ai repris la sortie dans une balise div.

Affichage du résultat au début

Téléchargeons la sortie finale au début du processus.

Passons à la dernière partie où je créerai un zone de texteoption dans une section de personnalisation de thème.

Création d'une option de type Textarea dans une section de personnalisation de thème

Exemple de déclaration

Utilisez le code suivant.

createOption (array ('id' => 'aa_sec_desc_txtarea', // l'identifiant qui sera utilisé pour obtenir la valeur de cette option 'type' => 'textarea', // type d'option que nous créons 'nom' => 'Description du site Textarea', // Nom de l'option à afficher 'desc' => 'Ceci est la description du site' // Valeur par défaut de notre option));

UNE zone de texteavec ID aa_sec_desc_txtarea existe dans une section de personnalisation de thème $ aa_section1. 

UNEzone de texte L'option de type dans la figure ci-dessus est affichée en regard du nom Description du site Textarea dans le Ma section section de personnalisation de thème.

Exemple d'utilisation

Récupérons les valeurs des options sauvegardées.

getOption ('aa_sec_desc_txtarea'); / ** * * Affiche la valeur de l'option * * / 
  
  

Ce code récupère et affiche la valeur à peu près de la même manière que celle décrite ci-dessus..

Affichage du résultat au début

Voici l'aperçu en direct de mon entrée.

Vous pouvez utiliser cette option, par exemple, pour ajouter une brève description sur votre page de destination..

Conclusion

C'est à peu près ça. Maintenant vous savez où et comment texteoption de type et le zone de texte L'option type peut être ajoutée avec Titan Framework. 

J'ai vu des personnes qui construisent des produits abuser de l'option de type texte dans des endroits où un utilisateur final peut vouloir ajouter plus de données que quelques mots. Vous devriez toujours utiliser le zone de texte type option dans un tel cas.

L'ensemble du processus est assez simple et facile. J'espère que vous avez apprécié la lecture de cet article. Si vous avez des questions, vous pouvez commenter ci-dessous ou me contacter sur Twitter.