Share
Vous souvenez-vous des moments où nous avions besoin de créer des pages d'options pour nos thèmes? Bien sûr que vous le faites, car nous en avons toujours besoin! Lorsque le personnaliseur de WordPress ne prend pas en charge les fonctionnalités de votre thème, vous devez créer une page Options supplémentaire pour offrir une meilleure expérience à vos utilisateurs..
Bien qu'il soit toujours possible de créer ces panneaux d'options à partir de rien, il est préférable d'utiliser les roues déjà inventées. Dans cette partie de la série "Boîte à outils du développeur WordPress intelligent", nous allons passer en revue Vafpress, un solide cadre d'options de thème WordPress pour votre prochain projet de thème..
L'heure est à la controverse: je ne pense pas que le personnaliseur soit prêt pour les thèmes,.
Même si j’admets que le Customizer est tout simplement un impressionnant outil, je peux aussi voir que ce n'est tout simplement pas qualifié pour servir toutes les fonctionnalités d'un simple thème polyvalent. Je sais, je sais, les thèmes multifonctionnels sont des thèmes sans âme et capitalistes qui ruinent le monde de WordPress… ou le sont-ils? Je veux dire, j’admettrais qu’il serait préférable que les thèmes à objectif unique soient plus populaires, mais pouvons-nous ignorer le fait que les thèmes à objectifs multiples constituent le premier choix de la plupart des agences de design, des pigistes et même des utilisateurs de WordPress débutants qui souhaitent créer un site web pour leurs entreprises?
À la fin de la journée, nous devons nous poser des questions afin de comprendre la nécessité de disposer de cadres d’options de thème contre le Customizer: WordPress pour WordPress, ou WordPress pour le bien des gens? Bien que je soutienne l’utilisation de plus en plus standardisée de WordPress dans divers aspects, je pense également que nous ne pouvons pas ignorer les demandes de la communauté des utilisateurs de WordPress. Après tout, si les développeurs avaient ignoré les demandes des utilisateurs, WordPress n'aurait pas grandi autant qu'il l'est maintenant..
De plus, je ne pense pas que le Customizer serait suffisant (encore) pour des thèmes à usage unique. Nous n'avons même pas encore de moyen normalisé et centralisé de créer des éléments de contenu (tels que des curseurs, des menus, etc.), et quoi que vous disiez contre cela, les utilisateurs de WordPress ont besoin (et auront toujours) d'une seule interface pour contrôler leurs thèmes..
Je garde cette section courte, parce que le sujet est Vafpress en tant qu'outil de développement WordPress et que je peux parler de "cadres de personnalisation par rapport à thème" pour mille autres mots. Mais ne me laissez pas raccourcir vous empêcher de commenter: J'aimerais entendre votre point de vue sur ce!
Inutile de préciser à ce stade, mais il est de coutume d'ouvrir chaque section avec une simple introduction: Vafpress est un cadre d'options de thème. Et un très bon, devrais-je dire. Créé par Vafour, une équipe indonésienne de développement Web, Vafpress affirme que la construction d'un thème WordPress n'a jamais été aussi simple et rapide.
Il suffit de télécharger Vafpress à partir de sa page de téléchargement officielle ou de son référentiel GitHub, et passons rapidement aux choses intéressantes.
A partir du jour où j'écris ce tutoriel, Vafpress a 19 champs de contrôle divisés en deux catégories appelées "Champs" et "Champs multiples"..
Accentsconagua
zone de texte: Génère une entrée de texte.zone de texte: Génère un zone de texte champ.basculer: Génère une bascule oui / non.curseur: Génère un curseur de plage.télécharger: Génère un champ de téléchargement à l'aide de WordPress Media Manager.Couleur: Génère un sélecteur de couleur.rendez-vous amoureux: Génère un sélecteur de date.éditeur de code: Génère un éditeur de code.wpeditor: Génère un éditeur WYSIWYG.fontawesome: Génère un sélecteur d'icônes à l'aide de Font Awesome.boîte à notes: Génère un champ que vous pouvez utiliser pour informer les utilisateurs de votre thème.html: Vous permet d'afficher du code HTML personnalisé.sélectionner: Génère un simple sélection multiple: Génère un menu déroulant multiple.case à cocher: Génère un groupe de cases à cocher.checkimage: Génère un groupe d’images sélectionnables, fonctionnant comme des cases à cocher.bouton radio: Génère un groupe de boutons radio.radioimage: Génère un groupe d’images sélectionnables, fonctionnant comme des boîtes radio.trieur: Génère un champ multisélect triable.Cela ne me semblerait pas juste de ne pas terminer cette section sans un exemple - faisons-en un seul, simple. Les lignes de code suivantes créent un champ Color Picker:
array (array ('type' => 'color', 'name' => 'example_color_picker', 'label' => 'Color Picker', 'description' => 'Définissez une couleur pour vos en-têtes ici!', 'par défaut '=>' rgba (255,255,255, .75) ',' format '=>' hex ',), tableau (// autre champ),)?> Cette partie peut être délicate au début, mais elle a une courbe d'apprentissage douce.
Le panneau d'options que nous pouvons créer avec Vafpress est composé de deux blocs de construction:
Commençons par voir la construction du "constructeur de page d'options":
false, // le nom des paramètres de la base de données 'option_key' => 'vpt_option', // le slug de votre page d'options 'page_slug' => 'vpt_option', // le chemin du fichier de modèle ou du modèle de tableau '=> get_template_directory (). '/options-template.php', // page de menu parent 'menu_page' => 'themes.php', // décide s'il faut nommer automatiquement les menus ou non 'use_auto_group_naming' => true, // show (par défaut) ou cache la page "Export / Import" 'use_exim_menu' => true, // rôle d'utilisateur minimum pour afficher le panneau d'options 'minimum_role' => 'edit_theme_options', // type de la mise en page (fixée par défaut) 'layout' => 'fixed', // titre de la page d'options 'page_title' => __ ('Options du thème', 'vp_textdomain'), // titre de l'élément de menu principal 'menu_label' => __ ('Options du thème', 'vp_textdomain '),)); // accrochez-le à l'action after_setup_theme add_action ('after_setup_theme', 'mes_options')?> Une bonne chose à propos du "générateur de page d'options" est que vous pouvez pointer sur un fichier séparé dans lequel vous conservez tous vos menus (et sections à l'intérieur des menus et champs à l'intérieur des sections). Dans l'exemple ci-dessus, nous avons indiqué un fichier modèle appelé options-template.php. Voyons avec quoi remplir ce fichier aussi:
__ ('Panneau d'options Vafpress', 'vp_textdomain'), 'logo' => ", 'menus' => array (array ('title' => __ ('Contrôles spéciaux', 'vp_textdomain'), 'name' = > 'menu_2', 'icon' => '/icon/special.png', 'controls' => array (//… collection de sections et ou de champs de contrôle…),),));?> Si vous le souhaitez, vous pouvez également créer des "menus imbriqués":
__ ('Panneau d'options Vafpress', 'vp_textdomain'), 'logo' => ", 'menus' => array (array ('title' => __ ('Contrôles HTML standard', 'vp_textdomain'), 'name' => 'menu_1', 'icon' => 'font-awesome: icon-magic', 'menus' => array (array ('title' => __ ('Normal', 'vp_textdomain'), 'name' = > 'submenu_1', 'icon' => 'font-awesome: icon-th-large', 'controls' => array (//… collection de sections et ou champs de contrôle…),), array ('title' = > __ ('Image', 'vp_textdomain'), 'name' => 'submenu_2', 'icon' => 'font-awesome: icon-picture', 'controls' => array (//… collection de sections et ou Champs de contrôle…),),),),),));?> Et à l'intérieur du tableau de la 'les contrôles' arguments, nous utilisons quelque chose comme ce qui suit:
array (array ('title' => __ ('TextBox et TextArea', 'vp_textdomain'), 'name' => 'section_1', 'description' => __ ('TextBox et TextArea Showcase', 'vp_textdomain'), 'fields' => array (//… collection de champs de contrôle…),),)?> Encore une fois, cela pourrait prendre un peu de pratique au début, mais c'est une promenade dans le parc une fois que l'on s'y habitue.
Toutes ces fonctionnalités devraient suffire pour un framework comme Vafpress, mais Vafpress ne s’arrête pas là: il a encore quelques astuces dans sa manche:
Vafpress permet d’obtenir beaucoup plus que ce que nous avons présenté ici dans ce tutoriel. N'oubliez pas de consulter la documentation de Vafpress pour en savoir plus à ce sujet..
Que pensez-vous de Vafpress? Pensez-vous que vous allez lui donner une chance dans votre prochain projet de thème? Dites-nous ce que vous pensez dans la section Commentaires ci-dessous. Et si vous avez aimé l'article, n'oubliez pas de le partager avec vos amis!
Rendez-vous dans la prochaine partie où nous aborderons CMB2, une métabox, des champs personnalisés et une bibliothèque de formulaires pour WordPress..
