Maison > Tutoriel CMS > WordPresse > Comment créer des shortcodes WordPress personnalisés pour vos éditeurs

Comment créer des shortcodes WordPress personnalisés pour vos éditeurs

尊渡假赌尊渡假赌尊渡假赌
Libérer: 2025-02-10 16:27:10
original
419 Les gens l'ont consulté

How to Create Custom WordPress Shortcodes for Your Editors

Guide rapide de shortcode wordpress: intégrez facilement les composants HTML sans codage

WordPress Shortcodes fournit un moyen pratique pour les auteurs d'insérer des composants HTML dans des pages rendues sans écrire de code. Ces codes courts peuvent être créés dans le code du plugin ou placés dans le fichier functions.php du thème.

Avantages clés du code court:

  • Simplifiez l'intégration HTML: Ajouter facilement du contenu HTML complexe sans écrire directement du code HTML.
  • Personnalisation paramétrée: Personnalisez la sortie des codes courts à travers des paramètres pour obtenir des paramètres personnalisés flexibles.
  • Fonction de nidification: prend en charge le code court de création pour créer des fonctions de page plus complexes.
  • Améliorer l'efficacité: Simplifier la gestion du contenu et améliorer l'efficacité de la création de contenu.

Il est recommandé de créer un tableau de recherche rapide de code court contenant divers exemples, en particulier lorsqu'il s'agit de fonctionnalités complexes, ce qui rendra la gestion du contenu plus pratique et conviviale.

Emplacement de la création de code court:

Généralement, les codes courts créés pour les plugins personnalisés doivent être placés dans le code du plugin lui-même. Cependant, vous pouvez également placer la définition de shortcode dans le fichier functions.php du thème. Un moyen plus pratique consiste à créer un fichier shortcodes.php séparé, puis à l'inclure dans functions.php en utilisant l'énoncé suivant:

include('shortcodes.php');
Copier après la connexion
Copier après la connexion

Le premier shortcode "Hello World":

La définition du code court comprend:

  1. une fonction qui renvoie la chaîne de code html;
  2. L'appel du crochet WordPress add_shortcode() qui lie la définition du texte de shortcode à la fonction.

l'exemple le plus élémentaire:

// "Hello World" 短代码
function shortcode_HelloWorld() {
  return '<p>Hello World!</p>';
}
add_shortcode('helloworld', 'shortcode_HelloWorld');
Copier après la connexion
Copier après la connexion

Enregistrez le fichier et entrez [helloworld] dans la page ou l'article. Visitez la page et vous verrez qu'elle a été remplacée par le "Hello World!"

Paramètres de code court:

Les codes courts peuvent avoir des paramètres facultatifs, tels que:

<code>[sitemap title='网页列表', depth=3]</code>
Copier après la connexion
Copier après la connexion
Le paramètre

est passé sous forme de tableau à la fonction Shortcode comme premier paramètre. Le code complet pour générer un site de hiérarchie de page:

// sitemap 短代码
function shortcode_GenerateSitemap($params = array()) {

  // 默认参数
  extract(shortcode_atts(array(
    'title' => '站点地图',
    'id'    => 'sitemap',
    'depth' => 2
  ), $params));

  // 创建站点地图
  $sitemap = wp_list_pages("title_li=&depth=$depth&sort_column=menu_order&echo=0");
  if ($sitemap) {
    $sitemap =
      ($title ? "<h2>$title</h2>" : '') .
      '<ul>' . $sitemap . '</ul>';
  }

  return $sitemap;
}
add_shortcode('sitemap', 'shortcode_GenerateSitemap');
Copier après la connexion

shortcode_atts() La fonction affecte les valeurs par défaut aux paramètres en cas de besoin. La fonction PHP extract() convertit ensuite chaque valeur de tableau en variables réelles $title, $id et $depth. (Si vous utilisez PHP 5.4 ou version ultérieure, vous pouvez remplacer [...] par la syntaxe plus courte array(...).) Ajouter [sitemap] shortcodes à n'importe quel article ou page et modifier les paramètres au besoin, tels que [sitemap depth=5].

Shortcode BBcode imbriqué:

BBCODE (code de blockboard) est un format de balise léger qui utilise [方括号] pour représenter les commandes, tout comme les shortcodes standard. Cela permet à Shortcodes de contenir du contenu texte ou d'être imbriqué les uns avec les autres. Supposons que votre page nécessite des boutons de référence et d'appel commun à l'action. La création d'un seul shortcode n'est pas pratique, surtout si le bouton peut être utilisé seul ou intégré dans une référence. Nous pouvons avoir besoin de HTML comme ceci:

include('shortcodes.php');
Copier après la connexion
Copier après la connexion

Cela peut mal tourner lorsque l'éditeur est très familier avec HTML. Heureusement, les codes courts fournissent un moyen plus facile, comme:

// "Hello World" 短代码
function shortcode_HelloWorld() {
  return '<p>Hello World!</p>';
}
add_shortcode('helloworld', 'shortcode_HelloWorld');
Copier après la connexion
Copier après la connexion
Le contenu entre le

Le contenu entre les balises est passé comme deuxième paramètre à la fonction Shortcode. Nous pouvons créer deux fonctions de raccourcis:

<code>[sitemap title='网页列表', depth=3]</code>
Copier après la connexion
Copier après la connexion

Veuillez noter l'utilisation de la fonction do_shortcode($content), qui applique d'autres codes short au contenu lorsqu'il existe. Les codes courts sont faciles à mettre en œuvre et peuvent être modifiés ou améliorés rapidement. Je suggère de créer une table de recherche rapide de code court avec des exemples afin que l'éditeur puisse se référer lorsque des fonctionnalités complexes sont nécessaires.

How to Create Custom WordPress Shortcodes for Your Editors

(Une partie de l'article est parrainée par Siteground. Merci pour votre soutien aux partenaires qui ont rendu le point de point possible.)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal