Share
Les options de case à cocher, radio et type de sélection permettent aux utilisateurs de faire un choix unique parmi un ensemble de choix prédéfinis. Qu'en est-il de la nécessité de donner à un utilisateur final la possibilité de faire plus d'un choix??
C'est exactement ce que le multicheck option de type fait dans Titan Framework. Aujourd'hui, j'ai l'intention de vous montrer comment ajouter une option de type multicheck via Titan Framework dans un panneau d'administration personnalisé, une boîte méta ou à l'intérieur du personnalisateur de thème..
UNE multicheck L'option type de Titan Framework vous permet de créer plusieurs cases à cocher qui peuvent toutes être activées ou désactivées simultanément. Voici à quoi ça ressemble:
Les paramètres de réglage pris en charge par cette option sont les suivants:
Accentsconagua
multicheck option de type.Les deux derniers paramètres, défaut et options, sont tableau, tandis que les autres sont chaîne par type.
Les conteneurs dans lesquels vous pouvez ajouter cette option sont:
le multicheck L'option type est ajoutée en suivant un format général:
getInstance () une fonction.createOption () une fonction.getOption () une fonction. Vous voulez savoir comment ces conteneurs sont créés avec Titan Framework? Lire les articles précédents de cette série.
Créons d'abord cette option dans un panneau d'administration.
createOption (array ('id' => 'aa_multicheck_opt', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'multicheck', // Type d'option que nous créons 'nom' => 'Mon option Multicheck', // 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 'options' = > array (// Tableau associatif de paires valeur-étiquette contenant les options 'aa_hdr_logo' => 'Afficher le logo de l'en-tête', 'aa_hdr_bg_img' => 'Afficher l'image de fond de l'en-tête', 'aa_hdr_clr_overlay' => 'Autoriser la superposition de la couleur de l'en-tête'), 'default' => array ('aa_hdr_logo', 'aa_hdr_bg_img')));J'ai utilisé le createOption () fonction dans la ligne # 8 pour ajouter un multicheck option de type dans un panneau d'administration personnalisé $ aa_panel. Il y a une liste de paramètres que j'ai mentionnés, c'est-à-dire. nom, id, type, options, desc et défaut. L'identifiant de mon option est aa_multicheck_opt; assurez-vous que chaque ID que vous ajoutez est unique.
Le 'options ' Le paramètre de la ligne 14 occupe un tableau associatif. Il contient étiquette de valeur paires. Chaque paire indique une option distincte qui apparaît comme une case à cocher. Donc, j'ai défini trois paires valeur-étiquette, ce qui signifie trois options.
L'étiquette de chaque option est unique. Par conséquent, les étiquettes aa_hdr_logo, aa_hdr_bg_img et aa_hdr_clr_overlay créer des options nommées 'Afficher le logo d'en-tête','Afficher l'image de fond de l'en-tête' et 'Autoriser la superposition de couleur d'en-tête' respectivement.
Dans la capture d'écran ci-dessus, il y a un panneau d'administration Options soignées qui contient un multicheck option nommée Mon option Multicheck. Notez que les deux premières options sont activées en raison des paramètres par défaut (que j'ai définis à la ligne 16).
Récupérons les valeurs des options sauvegardées.
getOption ('aa_multicheck_opt'); / ** * * Impression des valeurs enregistrées pour un panneau d'administration * * / var_dump ($ aa_multicheck_opt_val); À la ligne 3, j’ai ajouté une instance unique via le getInstance () une fonction. Il est recommandé d'utiliser votre nom de thème en tant que paramètre ici. Puis à la ligne 6, j'ai utilisé le getOption () fonction qui récupère les valeurs enregistrées en enregistrant l'ID d'option aa_multicheck_opt en paramètre. Après cela, j'ai sauvegardé son résultat dans une variable $ aa_multicheck_opt_val. Jusqu'à ce point, les paramètres de saisie de l'utilisateur sont enregistrés dans cette variable.
Nous allons maintenant imprimer les résultats sauvegardés au début. Comme cette option utilise un tableau associatif, je vais utiliser la méthode la plus élémentaire pour imprimer le contenu du tableau, c’est-à-dire le var_dump () commande (ligne 15).
Si vous prévisualisez le front-end, cela ressemble à ceci:
Les paramètres par défaut ont été imprimés correctement. Vous avez une idée de ce que vous pouvez faire avec cette option.
Ajoutons quelques lignes de code imprimant une sortie si les paramètres sont modifiés dynamiquement. J'ai remplacé la ligne 15 du code ci-dessus par ces lignes.
"; else echo" Afficher le logo d'en-tête n'est pas activé."; if (in_array ('aa_hdr_bg_img', $ aa_multicheck_opt_val)) echo" Afficher l'image de fond de l'en-tête a été activé."; else echo" Afficher l'image de fond de l'en-tête n'est pas activé."; if (in_array ('aa_hdr_clr_overlay', $ aa_multicheck_opt_val)) echo" Autoriser le recouvrement des couleurs d'en-tête a été activé."; else echo" Autoriser la superposition des couleurs d'en-tête n'était pas activé.";?> Ici j'utilise le in_array () fonctionner à l'intérieur sinon vérifier les déclarations. Trois contrôles différents sont effectués ici pour la sortie.
aa_hdr_logo existe à l'intérieur du tableau $ aa_multicheck_opt_val, impression 'Afficher le logo d'en-tête activé.'aa_hdr_bg_img existe à l'intérieur du tableau $ aa_multicheck_opt_val, impression 'Autoriser la superposition des couleurs d'en-tête a été activé.'aa_hdr_clr_overlay existe à l'intérieur du tableau $ aa_multicheck_opt_val, impression 'Afficher en-tête l'image de fond a été activé.'Commençons par les paramètres par défaut, c’est-à-dire que les deux premières cases à cocher sont activées.
Le front-end doit imprimer les lignes suivantes comme ceci:
Ensuite, je vais ajouter cette option dans un onglet administrateur.
createOption (array ('id' => 'aa_multicheck_opt_in_tab', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'multicheck', // Type d'option que nous créons 'nom' => 'Mon option Multicheck', // 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 'options' = > array (// Tableau associatif de paires valeur-étiquette contenant les options 'aa_hdr_logo' => 'Afficher le logo de l'en-tête', 'aa_hdr_bg_img' => 'Afficher l'image de fond de l'en-tête', 'aa_hdr_clr_overlay' => 'Autoriser la superposition de la couleur de l'en-tête'), 'default' => array ('aa_hdr_logo', 'aa_hdr_bg_img')));Ici j'ai ajouté le même multicheck option de type dans un onglet administrateur $ aa_tab1. L'identifiant unique de l'option est aa_multicheck_opt_in_tab. Le reste des réglages de paramètres sont les mêmes.
UNE multicheck option de type existe à l'intérieur Onglet 1 du panneau d'administration Options soignées 2.
Maintenant, je vais obtenir les valeurs sauvegardées à partir d'un onglet administrateur.
getOption ('aa_multicheck_opt_in_tab'); / ** * * Impression des valeurs enregistrées pour un onglet Admin * * / if (in_array ('aa_hdr_logo', $ aa_multicheck_opt_in_tab_val))) echo "Le logo d'en-tête a été activé."; else echo" Afficher le logo d'en-tête n'est pas activé."; if (in_array ('aa_hdr_bg_img', $ aa_multicheck_opt_in_tab_val)) echo" Afficher l'image de fond de l'en-tête a été activé."; else echo" Afficher l'image de fond de l'en-tête n'est pas activé."; if (in_array ('aa_hdr_clr_overlay', $ aa_multicheck_opt_in_tab_val)) echo" Autoriser le superposition de couleurs d'en-tête a été activé."; else echo" Autoriser la superposition des couleurs d'en-tête n'était pas activé."; Ce code est assez similaire à ce que j'ai écrit dans le cas d'un panneau d'administration. Vous pouvez l'essayer vous-même. Permettez-moi de résumer les étapes:
getInstance () une fonction.getOption () fonction pour obtenir les valeurs sauvegardées dans la ligne # 6.$ aa_multicheck_opt_in_tab_val.in_array () fonction (lignes 15 à 30) pour imprimer les résultats souhaités.Activons toutes les cases à cocher en tant que paramètres de démonstration. Le front-end ressemble à ceci:
Maintenant je vais créer un multicheck option de type dans un metabox.
createOption (array ('id' => 'aa_multicheck_opt_in_metabox', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'multicheck', // Type d'option que nous créons 'nom' => 'Mon option Multicheck', // Nom de l'option qui sera affichée 'desc' => 'Ceci est notre option', // Description de l'option qui sera affichée 'options' => array (// Tableau associatif de paires valeur-étiquette contenant les options 'aa_hdr_logo' => 'Afficher le logo de l’en-tête', 'aa_hdr_bg_img' => 'Afficher l’image d’arrière-plan de l’en-tête', 'aa_hdr_clr_overlay' => 'Autoriser la superposition des couleurs de l’en-tête'), 'default' => array aa_hdr_logo ',' aa_hdr_bg_img ')));J'ai ajouté cette option avec un identifiant unique aa_multicheck_opt_in_metabox dans un metabox $ aa_metbox.
Dans l'image ci-dessus, il y a un écran de modification de page et à la fin, vous pouvez repérer un multicheck option nommée Mon option Multicheckdans un metabox.
Utilisez le code suivant pour récupérer les valeurs enregistrées.
getOption ('aa_multicheck_opt_in_metabox', get_the_ID ()); / ** * * Impression des valeurs enregistrées pour un Metabox * * / if (in_array ('aa_hdr_logo', $ aa_multicheck_opt_in_metabox_val)) echo "Le logo d'en-tête a été activé."; else echo" Afficher le logo d'en-tête n'est pas activé."; if (in_array ('aa_hdr_bg_img', $ aa_multicheck_opt_in_metabox_val)) echo" Afficher l'image de fond de l'en-tête a été activé."; else echo" Afficher l'image de fond de l'en-tête n'est pas activé."; if (in_array ('aa_hdr_clr_overlay', $ aa_multicheck_opt_in_metabox_val)) echo" Autoriser le superposition de couleurs d'en-tête a été activé."; else echo" Autoriser la superposition des couleurs d'en-tête n'était pas activé.";?>Le code utilise à nouveau les fonctions pour obtenir une instance et des valeurs enregistrées. Mais dans la ligne 6, il y a un paramètre supplémentaire, le get_the_ID () fonction, qui obtient les valeurs de n'importe quel ID de page ou de post. Au final, j'ai utilisé le même sinon vérifier les déclarations.
Cette fois, activons la première et la dernière option. Voici la capture d'écran du front-end.
Enfin, je vais ajouter cette option dans une section de personnalisation de thème..
createOption (array ('id' => 'aa_multicheck_opt_in_sec', // L'ID qui sera utilisé pour obtenir la valeur de cette option 'type' => 'multicheck', // Type d'option que nous créons 'nom' => 'Mon option Multicheck', // Nom de l'option qui sera affichée 'desc' => 'Ceci est notre option', // Description de l'option qui sera affichée 'options' => array (// Tableau associatif de paires valeur-étiquette contenant les options 'aa_hdr_logo' => 'Afficher le logo de l’en-tête', 'aa_hdr_bg_img' => 'Afficher l’image d’arrière-plan de l’en-tête', 'aa_hdr_clr_overlay' => 'Autoriser la superposition des couleurs de l’en-tête'), 'default' => array (' aa_hdr_logo ',' aa_hdr_bg_img ')));J'ai ajouté un multicheck option de type dans une section de personnalisation de thème $ aa_section1. Son identifiant est aa_multicheck_opt_in_sec.
Dans l'image, il y a une section de personnalisation nommée Ma section, dans lequel il y a une liste d'options de case à cocher.
Utilisez ce code pour obtenir les valeurs d'une section de personnalisation.
getOption ('aa_multicheck_opt_in_sec'); / ** * * Impression des valeurs enregistrées pour une section de personnalisation * * / if (in_array ('aa_hdr_logo', $ aa_multicheck_opt_in_sec_val))) echo "Afficher le logo d'en-tête activé."; else echo" Afficher le logo d'en-tête n'est pas activé."; if (in_array ('aa_hdr_bg_img', $ aa_multicheck_opt_in_sec_val)) echo" Afficher l'image de fond de l'en-tête a été activé."; else echo" Afficher l'image de fond de l'en-tête n'est pas activé."; if (in_array ('aa_hdr_clr_overlay', $ aa_multicheck_opt_in_sec_val)) echo" Autoriser le superposition de couleurs d'en-tête a été activé."; else echo" Autoriser la superposition des couleurs d'en-tête n'était pas activé.";?>Ce code est à nouveau assez similaire à ce que j’avais utilisé pour d’autres types de conteneurs. Seuls les noms d'identifiant et de variable sont différents.
J'ai activé uniquement la première option. Les modifications peuvent être observées en mode aperçu en direct:
Donc c'est à peu près tout. Vous pouvez intégrer le multicheck Saisissez une option dans votre projet de développement Web pour permettre aux utilisateurs d'activer plusieurs fonctionnalités de thème en quelques clics..
Rappelez-vous que je vous ai donné un exemple dans le tutoriel de l'option de type de case à cocher, selon lequel vous pouvez autoriser un utilisateur final à activer / désactiver n'importe quelle partie de single.php. Ce même exemple peut être appliqué ici, avec un peu de contexte. Donc, si vous fournissez des options utilisateur liées à un domaine particulier, tel que l'en-tête, vous devez utiliser la fonction multicouche pour éviter les options supplémentaires.
Il existe d'autres types d'options que l'on peut appeler les dérivées de ce type. Je vais en discuter dans mes prochains articles. Jusque-là, essayez ce tutoriel et faites-moi part de votre point de vue à ce sujet dans les commentaires ou sur Twitter.
