Créez un widget dynamique dans WordPress en dix minutes-WordPresse-php.cn

Créez un widget dynamique dans WordPress en dix minutes

Christopher Nolan

Libérer： 2025-02-09 10:51:11

original

381 Les gens l'ont consulté

Create a Dynamic Widget in WordPress in Ten Minutes

Créer rapidement des widgets dynamiques WordPress: aucune expérience de programmation requise

Ce tutoriel vous guidera comment créer des widgets dynamiques dans WordPress qui peuvent être facilement démarrés même si vous avez des connaissances de programmation limitées.

Les widgets WordPress sont des blocs de code qui peuvent être ajoutés à n'importe quel domaine spécifique d'un site Web WordPress. WordPress a de nombreux widgets intégrés (tels que Tag Cloud et Catégories), mais ce tutoriel vous aidera à créer rapidement des widgets personnalisés à partir de zéro.

Nous allons démontrer avec un exemple: créer un widget dynamique qui affiche les données de correspondance de cricket en temps réel. Cela vous aidera à vous familiariser avec les différentes fonctions liées aux widgets WordPress.

PRÉPARATION

Assurez-vous de sauvegarder votre code WordPress avant de commencer à écrire n'importe quel code en cas d'erreurs inattendues. Il est recommandé de comprendre les bases de la programmation orientée objet PHP. Ce tutoriel a été créé sur WordPress version 4.9.8.

Emplacement du code

Si vous souhaitez utiliser des widgets uniquement dans un sujet spécifique, vous pouvez mettre le code dans le fichier functions.php de ce sujet. Cependant, cela limite l'utilisation du widget.

Ce tutoriel créera un nouveau plugin pour stocker des widgets afin qu'ils puissent être utilisés sur des sujets. Le plugin utilisera l'API pour afficher une liste de correspondances de cricket en direct.

Bases du développement des gadgets

Pour créer un widget WordPress, vous devez étendre la classe WP_Widget. Dans votre classe de widget, vous devez définir la fonction suivante:

Constructeur (__construct)
Fonction d'affichage de l'outil de démarche (widget): afficher le contenu du widget
Fonction de formulaire (form): si vous avez besoin de définir un formulaire qui accepte l'entrée
Fonction de mise à jour (update): si vous devez mettre à jour les paramètres du gadget

Dans cet exemple, nous avons seulement besoin de définir les deux premières fonctions. Après avoir créé la classe Widget, vous devez utiliser la fonction register_widget pour vous inscrire.

Basiques: bonjour gadget mondial

Créer un plug-in vide: Créer un nouveau répertoire (par exemple, /wp-content/plugins/) sous le répertoire live-score-custom, et créer un fichier index.php qui contient le contenu suivant:

<?php /*
Plugin Name: 实时比分自定义
Plugin URI: https://www.sitepoint.com/
Description: 获取并显示体育数据
Version: 1.0
Author: Shaumik
Author URI: https://www.sitepoint.com/
License: GPL2
*/
?>

Copier après la connexion

Définir les widgets dans le plug-in: Ajouter le code suivant dans index.php:

class My_Custom_Widget extends WP_Widget {

    public function __construct() {
        $options = array(
            'classname' => 'custom_livescore_widget',
            'description' => '实时比分小工具',
        );
        parent::__construct(
            'live_score_widget', '实时比分小工具', $options
        );
    }

    public function widget( $args, $instance ) {
        echo $args['before_widget'];
        echo $args['before_title'] . apply_filters( 'widget_title', '实时板球比赛' ) . $args['after_title'];
        echo 'Hello, World!';
        echo $args['after_widget'];
    }
}

function my_register_custom_widget() {
    register_widget( 'My_Custom_Widget' );
}
add_action( 'widgets_init', 'my_register_custom_widget' );

Copier après la connexion

Après l'activation du plugin, ajoutez le widget nouvellement créé à l'apparence & gt;

Create a Dynamic Widget in WordPress in Ten Minutes

Ajouter le score en direct

Nous utiliserons l'API de CRICAPI (nécessite l'enregistrement et l'obtention de la clé API). Modifiez la fonction widget:

<?php /*
Plugin Name: 实时比分自定义
Plugin URI: https://www.sitepoint.com/
Description: 获取并显示体育数据
Version: 1.0
Author: Shaumik
Author URI: https://www.sitepoint.com/
License: GPL2
*/
?>

Copier après la connexion

Create a Dynamic Widget in WordPress in Ten Minutes