Comment créer un meilleur panneau d'options WordPress

Maintenant, le plus important est que le codage de cette opération ne soit pas manuel - nous devrions utiliser au maximum la flexibilité de PHP. Cela signifie efficacité: ne codez pas manuellement lorsque vous avez des boucles pour vous!

Étape 3

Commencez par ouvrir functions.php dans votre éditeur de code préféré (j'utilise Notepad ++). Entrez le code suivant:

  
Les deux variables PHP contiennent le nom de votre thème (Nettuts dans notre cas) et un nom abrégé que vous avez défini (nt dans notre cas). Le nom abrégé est utilisé pour préfixer tous les noms d’options de thème et est généralement unique pour un thème particulier. Nous allons ensuite écrire du code pour générer automatiquement une liste de catégories WordPress, au lieu de laisser les utilisateurs taper des numéros d'identification. Entrez le code ci-dessous sous le code déjà saisi:
 
 $ categories = get_categories ('hide_empty = 0 & orderby = name'); $ wp_cats = array (); foreach ($ categories comme $ category_list) $ wp_cats [$ category_list-> cat_ID] = $ category_list-> cat_name;  array_unshift ($ wp_cats, "Choisissez une catégorie");
 
Cet extrait utilise la fonction get_categories intégrée de WordPress pour extraire toutes les catégories, puis utilise une boucle foreach pour les stocker dans la variable $ wp_cats. Les options "Choisir une catégorie" sont ensuite ajoutées en haut du tableau.
 
Étape 4
 
Nous commençons maintenant à entrer une liste d’options pour le thème. Voir ci-dessous et collez-le dans votre fichier functions.php:
 
 $ options = array (array ("name" => $ themename. "Options", "type" => "title"), array ("name" => "Général", "type" => "section"), array ("type" => "open"), array ("name" => "Schéma de couleurs", "desc" => "Sélectionnez le schéma de couleurs du thème", "id" => $ shortname. "_ color_scheme" , "type" => "select", "options" => tableau ("bleu", "rouge", "vert"), "std" => "bleu"), tableau ("nom" => "URL du logo "," desc "=>" Entrez le lien vers votre image de logo "," id "=> $ shortname." _ logo "," type "=>" texte "," std "=>" "), tableau (" name "=>" CSS personnalisé "," desc "=>" Voulez-vous ajouter du code CSS personnalisé? Mettez-le ici, le reste est pris en charge. Ceci remplace toutes les autres feuilles de style. Par exemple: a.button color: green  "," id "=> $ shortname." _ custom_css "," type "=>" textarea "," std "=>" "), array (" type "=>" close "), array (" nom " => "Homepage", "type" => "section"), array ("type" => "open"), array ("name" => "Image d'en-tête de la page d'accueil", "desc" => "Entrez le lien à une image utilisée pour l'en-tête de la page d'accueil. "," id "=> $ shortname." _ header_img ", "type" => "texte", "std" => ""), tableau ("nom" => "Catégorie sélectionnée de la page d'accueil", "desc" => "Choisissez une catégorie dans laquelle les messages sélectionnés sont tirés", "id "=> $ shortname." _ feat_cat "," type "=>" select "," options "=> $ wp_cats," std "=>" Choisir une catégorie "), array (" type "=>" close ") , array ("name" => "Footer", "type" => "section"), array ("type" => "open"), array ("name" => "Texte du copyright du pied de page", "desc" => "Entrez le texte utilisé dans le côté droit du pied de page. Il peut s'agir de HTML "," id "=> $ shortname." _ Footer_text "," type "=>" text "," std "=>" "), array (" name "=>" Code Google Analytics "," desc "=>" Vous pouvez coller votre code Google Analytics ou un autre code de suivi dans cette zone. Ce dernier sera automatiquement ajouté au pied de page. "," id "=> $ shortname." _ ga_code "," tapez "=>" textarea " , "std" => ""), array ("name" => "Favicon personnalisé", "desc" => "Un favicon est une icône de 16 x 16 pixels qui représente votre site; collez l’URL de l’image .ico que vous veux utiliser comme image "," id "=> $ shortname." _ favicon "," type "=>" text "," std "=> get_bloginfo ('url')." / favicon.ico "), tableau ("name" => "URL Feedburner", "desc" => "Feedburner est un service Google qui prend soin de votre flux RSS. Collez votre URL Feedburner ici pour que les lecteurs le voient sur votre site Web", "id" => $ shortname. "_ feedburner", "type" => "text", "std" => get_bloginfo ('rss2_url')), array ("type" => "close"));
 
C'était un gros morceau de code, qui mérite certainement une explication. Alors on y va: 
 
 
La variable PHP $ options stocke la liste complète des options pour le thème.
 
Il est composé d'un certain nombre de tableaux, chacun avec une clé "type" pour indiquer comment il sera affiché et ce qu'il fait..
 
Nous commençons avec un tableau "type" => "title" - il sera utilisé pour afficher le nom du thème et un titre en haut de la page
 
Chaque section (Général, page d'accueil et pied de page) contient une liste d'options distincte..
 
Nous commençons une nouvelle section en fermant les sections précédentes, en déclarant une nouvelle section en utilisant array ("name" => "Footer",
"type" => "section") et ouvrir une nouvelle section.
 
Chaque option peut avoir les options spécifiées ci-dessous:
prénom: Le nom du champ de saisie.
desc: Une courte description expliquant ce que c'est à l'utilisateur.
id: l'identifiant du champ, préfixé par le nom abrégé. Il sera utilisé pour stocker et accéder aux options.
type: le type d'entrée - select, text ou textarea
options: utilisé pour déclarer un tableau d'options pour une entrée de type select.
std: la valeur d'entrée par défaut, utilisée si aucune autre entrée n'est donnée. 
 
 
Étape 5
 
Essayez de naviguer vers WordPress. Vous verrez qu'il n'y a pas d'option n'importe où pour réellement vue la page du panneau d'administration; alors comment pouvons-nous le voir? Ajoutez les éléments de code suivants au fichier functions.php:
 
 fonction mytheme_add_admin () global $ nomme, $ nom abrégé, $ options; if ($ _GET ['page'] == nom de base (__ FILE__)) if ('save' == $ _REQUEST ['action']) foreach ($ options comme $ valeur) update_option ($ valeur ['id' ], $ _REQUEST [$ value ['id']]);  foreach ($ options as $ value) if (isset ($ _REQUEST [$ value ['id']])) update_option ($ value ['id']], $ _REQUEST [$ value ['id']]) ;  else delete_option ($ value ['id']);  header ("Emplacement: admin.php? page = functions.php & saved = true"); mourir;  else if ('reset' == $ _REQUEST ['action']) foreach ($ options comme $ valeur) delete_option ($ value ['id']);  header ("Emplacement: admin.php? page = functions.php & reset = true"); mourir;  add_menu_page ($ nom de domaine, $ nom de domaine, 'administrateur', nom de base (__ FILE__), 'mytheme_admin');  fonction mytheme_add_init () 
 
Cette fonction est destinée à la mise à jour des options, ainsi qu’à l’ajout d’une page de menu. Si les options sont en cours de sauvegarde (indiquées par une variable masquée save), toutes les options sont mises à jour avec leurs nouvelles valeurs. Si les options sont en cours de réinitialisation (indiquées par une autre variable masquée avec une valeur réinitialisée), toutes les options sont supprimées. La dernière ligne ajoute une page de menu - les paramètres sont respectivement, nom et titre, le niveau d'autorisation de l'utilisateur requis pour afficher la page, la page de sauvegarde et la fonction utilisée pour l'affichage / la sauvegarde (appelée mytheme_admin dans notre cas). Voir le mytheme_add_init, une fonction blanbk? Que ce soit, nous y viendrons plus tard.
 
Étape 6
 
Toujours pas de page d'options de thème, non? Eh bien, rappelez-vous le mytheme_admim fonction dont nous avions parlé il y a quelques lignes? Nous n'avons toujours pas écrit cette fonction. Utilisez donc le code des étapes 6, 7 et 8 pour écrire cette fonction. En partant: 
 
 function mytheme_admin () global $ nomme, $ nom abrégé, $ options; $ i = 0; if ($ _REQUEST ['saved']) echo '
'. $ nomme' paramètres sauvegardés.
'; if ($ _REQUEST ['reset']) echo '
'. $ nomme' paramètres réinitialisés.
'; ?> 
 
 Réglages
 
 
 
Assez simple, non? Si les options ont été enregistrées, écrivez un message l’indiquant. De même pour les réinitialisations. Vous remarquerez a - WordPress l’affaiblira automatiquement en quelques sections. Nifty, non? Ensuite, nous commençons le "rm_wrap" div. 
 
Étape 7
 
En continuant par le haut, collez le code suivant: