Guide du débutant pour Titan Framework Ajout d'une option de type d'activation

Il est assez courant de permettre aux utilisateurs finaux d'activer ou de désactiver certaines fonctionnalités d'un plugin premium ou d'un thème. Titan Framework a récemment poussé une nouvelle option à sa base qui fait exactement cela. Voyons comment ajouter un bouton activer / désactiver dans un panneau d'administration, une section metabox ou un personnaliseur de thème avec Titan Framework (TF)..

L'option Activer le type dans Titan Framework

Il y a un activer type d’option dans Titan Framework pour créer les boutons bascule activer / désactiver. Dans le tableau de bord, le activer L'option type apparaît comme ceci: 

Voici ses paramètres:

  • prénom: Il assigne le nom d'affichage d'un activer option de type.
  • identifiant: Ce paramètre spécifie un nom unique qui obtient les valeurs des options enregistrées.
  • desc: Ajoute une brève description avec le nom de l’option.
  • défaut: (Facultatif) Attribue la valeur par défaut.
  • activée: (Facultatif) C’est l’étiquette du bouton de la activée Etat. La valeur par défaut est définie sur Activée.
  • désactivée: (Facultatif) C’est l’étiquette du bouton de la désactivée Etat. La valeur par défaut est définie sur désactivé.
  • livepreview: (Facultatif) Chaque fois que vous ajoutez un activer type option dans une section de personnalisation de thème, ce paramètre vous permet de prévisualiser en direct les modifications apportées.

Tous les paramètres sont chaîne par type, sauf défaut qui est booléen.

Conteneurs disponibles pour l'option Activer le type

Vous pouvez ajouter cette option à l'intérieur de:

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

Ajouter un activer tapez option dans ces conteneurs, procédez comme suit:

  • Obtenir une instance via le getInstance () une fonction.
  • Créer une option via le createOption () une fonction.
  • Obtenir les valeurs enregistrées via le getOption () une fonction.

Si vous souhaitez apprendre à créer ces conteneurs avec TF, lisez les articles précédents de cette série..

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

Exemple de déclaration

Créons d'abord cette option dans un panneau d'administration.

createOption (array ('id' => 'aa_enable_opt', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'enable', // Le type d'option que nous créons est 'name' => 'Autoriser CSS personnalisé', // Nom de l'option qui sera affichée dans le panneau d'administration 'desc' => 'Activer / Désactiver CSS personnalisé', // Description de l'option qui sera affichée dans le panneau d'administration 'par défaut' => true // Valeur par défaut de l'option)); 

À la ligne 8, j'ai ajouté un activer type option via le createOption () fonction dans un panneau d'administration $ aa_panel. Comme cette fonction occupe un tableau, j'ai défini les valeurs des paramètres nom, type, id, desc et défaut. La valeur de l'ID doit être unique, c'est-à-dire. aa_enable_opt. La valeur de défaut est réglé sur vrai, ce qui signifie que le statut de l'option est défini sur 'activée' par défaut.

Dans la capture d'écran ci-dessus, il y a un activer type option nommée Autoriser le CSS personnalisé dans un panneau d'administration Options soignées.

Exemple d'utilisation

Récupérons les valeurs sauvegardées.

getOption ('aa_enable_opt'); / ** * * Imprimer la valeur enregistrée * * / if (1 == $ aa_enable_opt_val) echo "Les CSS personnalisées dans l'onglet d'administration sont activées.";  else echo "CSS personnalisé dans l'onglet administrateur est désactivé."; ?>

Pour obtenir la valeur sauvegardée, commencez par obtenir une instance via le bouton getInstance () fonction (ligne n ° 3). Puis à la ligne 6, le getOption () fonction récupère la valeur enregistrée en enregistrant l'ID d'option aa_enable_opt comme paramètre. J'ai sauvegardé le résultat dans une nouvelle variable $ aa_enable_opt_val. Puis j'ai utilisé un sinon vérifier lequel imprime la valeur sauvegardée au début.  

Maintenant le activer L'option type peut contenir deux valeurs: soit 1/0 ou vrai faux. La valeur est "1" (état activé) ou "0" (état désactivé). Compte tenu de ce fait, j’ai écrit les lignes 15 à 20 du code, qui vérifie la valeur de la variable $ aa_enable_opt_val. Si c'est '1' alors ça s'imprime 'Le CSS personnalisé dans le panneau d'administration est activé ' au début. Si la valeur de la variable est '0', alors elle est imprimée 'CSS personnalisé dans le panneau d'administration est désactivé'.

Affichage du résultat au début

Supposons que j'ai activé l'option et que je l'ai sauvegardée.

Voici une capture d'écran du résultat final qui est apparu au début du processus.

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

Exemple de déclaration

Ensuite, je vais créer cette option dans un onglet administrateur.

createOption (array ('id' => 'aa_enable_opt_in_tab', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'enable', // Le type d'option que nous créons est 'name' => 'Autoriser CSS personnalisé', // Nom de l'option qui sera affichée dans le panneau d'administration 'desc' => 'Activer / Désactiver CSS personnalisé', // Description de l'option qui sera affichée dans le panneau d'administration 'activé' => 'On', // Libellé de l'option activée 'disabled' => 'Off' // Libellé de l'option désactivée)); 

Ici, j'ai ajouté cette option dans un onglet administrateur $ aa_tab1. La valeur de l'ID est aa_enable_opt_in_tab. Cette fois, j’ai aussi défini de nouvelles étiquettes pour le activée et désactivée paramètres. 

Dans l'image, il y a un activer option de type à l'intérieur Onglet 1 de panneau Options soignées 2. Notez également les étiquettes nouvellement définiesSur'pour permettre et'De'pour désactiver.

Exemple d'utilisation

Maintenant je vais avoir des valeurs sauvegardées.

getOption ('aa_enable_opt_in_tab'); / ** * * Imprimer la valeur enregistrée * * / if (1 == $ aa_enable_opt_in_tab_val) echo "Le CSS personnalisé dans l'onglet d'administration est activé.";  else echo "CSS personnalisé dans l'onglet administrateur est désactivé."; ?>

Le code est à peu près similaire à ce que j'ai écrit ci-dessus. Alors, laissez-moi résumer toutes les étapes:

  • Obtenez une instance unique via le getInstance () fonction à la ligne 4.
  • Obtenir la valeur enregistrée via le getOption () fonction à la ligne 7.
  • Imprimez la valeur sauvegardée sur le front-end via le bouton sinon vérifier la déclaration aux lignes 15 à 20.

Affichage du résultat au début

Cette fois, j’ai choisi l’option de De. Le front-end affiche la ligne suivante:

Création d'une option de type d'activation dans une métabox

Exemple de déclaration

Maintenant je vais créer un activer option de type dans un metabox.

createOption (array ('id' => 'aa_enable_opt_in_metabox', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'enable', // Le type d'option que nous créons est 'name' => 'Autoriser CSS personnalisé', // Nom de l'option à afficher 'desc' => 'Activer / Désactiver CSS personnalisé', // Description de l'option à afficher 'default' => false // Valeur par défaut de l'option ) ); 

Ici j'ai ajouté encore un autre activer option de type dans un metabox $ aa_metbox. Son identifiant est aa_enable_opt_in_metabox. La valeur de défaut est réglé sur faux.

Dans la capture d'écran ci-dessus, vous pouvez trouver cette option dans une metabox. Il apparaît sur toutes les pages et les écrans de post-édition.

Exemple d'utilisation

Récupérons la valeur sauvegardée pour cette option.

getOption ('aa_enable_opt_in_metabox', get_the_ID ()); / ** * Imprimer la valeur enregistrée * * / if (1 == $ aa_enable_opt_in_metabox_val) echo "Le CSS personnalisé dans une métabox est activé.";  else echo "Le CSS personnalisé dans un metabox est désactivé."; ?>

J'ai à nouveau écrit presque le même code. La seule différence peut être repérée à la ligne 6. Il existe un nouveau paramètre à l'intérieur du getOption () une fonction. C'est le get_the_ID () fonction utilisée pour récupérer une page ou un ID de poste spécifique.

Affichage du résultat au début

Revenons activer l'option et enregistrez-le. Le front-end apparaît comme ceci:

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

Exemple de déclaration

Enfin, je vais créer cette option dans une section de personnalisation de thème..

createOption (array ('id' => 'aa_enable_opt_in_sec', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'enable', // Type de l'option que nous créons 'name' => 'Autoriser CSS personnalisé', // Nom de l'option à afficher 'desc' => 'Activer / Désactiver CSS personnalisé', // Description de l'option à afficher 'default' => false // Valeur par défaut de l'option ) ); 

Ici, j'ai créé cette option dans une section de personnalisation de thème $ aa_section1. Son identifiant unique est aa_enable_opt_in_sec. Le reste des paramètres sont les mêmes.

Dans l'image ci-dessus, il y a un activer option de type dans une section de personnalisation de thème nommée Ma section.

Exemple d'utilisation

Utilisez le code suivant pour obtenir des valeurs enregistrées.

getOption ('aa_enable_opt_in_sec'); / ** * * Imprimer la valeur enregistrée * * / if (1 == $ aa_enable_opt_in_sec_val) echo "Le CSS personnalisé dans une section de personnalisation est activé.";  else echo "Le CSS personnalisé dans une section de personnalisation est désactivé."; ?>

Encore une fois, le code est exactement le même. Seuls les noms d'identifiant et de variable sont différents.

Affichage du résultat au début

Voici la capture d'écran, qui affiche les modifications en mode de prévisualisation en direct.

Conclusion

Du point de vue de l'utilisateur final, le activer L'option type est très utile, car vous pouvez activer ou désactiver n'importe laquelle des fonctionnalités en un seul clic. Alors, parcourez ce tutoriel et partagez votre point de vue à ce sujet dans la section commentaires..

À ce stade, nous avons couvert tout ce qu'il y a à couvrir sur le framework Titan. N'oubliez pas de consulter la page de la série si vous avez des questions ou des commentaires sur l'un des sujets abordés. Ou n'hésitez pas à me contacter sur Twitter.