Maison > Tutoriel CMS > WordPresse > le corps du texte

Comment ajouter une fonctionnalité de chat en ligne au plugin WordPress

王林
Libérer: 2023-09-05 10:13:14
original
1502 Les gens l'ont consulté

Comment ajouter une fonctionnalité de chat en ligne au plugin WordPress

Comment ajouter une fonction de chat en ligne au plugin WordPress

À l'ère moderne des médias sociaux, il est devenu de plus en plus important de rester instantanément connecté et de communiquer avec vos utilisateurs. Qu'il s'agisse de répondre aux questions des utilisateurs ou de fournir un support technique, il faut un moyen concis et efficace pour communiquer avec les utilisateurs en temps réel. Pour ce faire, on peut envisager d’ajouter une fonctionnalité de chat en ligne au plugin WordPress pour communiquer instantanément avec les utilisateurs.

Pour ajouter une fonctionnalité de chat en ligne au plug-in WordPress, nous pouvons utiliser l'interface API de la plateforme de chat tierce et l'intégrer dans notre plug-in. Vous trouverez ci-dessous un exemple qui montre comment utiliser l'interface API de la plateforme de chat tierce Tawk.to pour ajouter une fonctionnalité de chat en ligne à notre plugin WordPress.

Tout d'abord, nous devons créer un compte sur le site officiel de Tawk.to et créer une application. Une fois l'inscription terminée, nous recevrons une clé API unique pour communiquer avec Tawk.to.

Ensuite, nous devons ajouter le code de fonction suivant dans le code du plugin WordPress :

function add_chat_button() {
    $api_key = 'YOUR_TAWKTO_API_KEY';
    echo '<script type="text/javascript">
                var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
                (function(){
                    var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
                    s1.async=true;
                    s1.src="https://embed.tawk.to/" + $api_key + "/default";
                    s1.charset="UTF-8";
                    s1.setAttribute("crossorigin","*");
                    s0.parentNode.insertBefore(s1,s0);
                })();
            </script>';
}
add_action('wp_footer', 'add_chat_button');
Copier après la connexion

Dans le code ci-dessus, nous devons d'abord remplacer YOUR_TAWKTO_API_KEY par l'API que nous avons obtenue sur le Tawk. à la clé du site Web. Le code est intégré au bas du plugin WordPress à l'aide de JavaScript. YOUR_TAWKTO_API_KEY替换为我们在Tawk.to网站上获得的API密钥。代码使用了JavaScript嵌入到WordPress插件的底部。

接下来,我们需要在WordPress插件的设置页面中添加选项,以便用户可以输入他们自己的Tawk.to API密钥。我们可以使用WordPress提供的Settings API,添加如下设置:

function chat_settings_init() {
    add_settings_section('chat_settings_section', __('Chat Settings', 'wp_chat'), false, 'general');

    add_settings_field(
        'tawkto_api_key',
        __('Tawk.to API Key', 'wp_chat'),
        'chat_settings_callback',
        'general',
        'chat_settings_section'
    );

    register_setting('general', 'tawkto_api_key');
}
add_action('admin_init', 'chat_settings_init');

function chat_settings_callback() {
    $api_key = get_option('tawkto_api_key');
    echo '<input type="text" id="tawkto_api_key" name="tawkto_api_key" value="' . $api_key . '" />';
}
Copier après la connexion

在上述代码中,add_settings_section函数用于添加设置页面的部分,add_settings_field用于添加具体的设置字段,register_setting函数用于注册我们的设置。

最后,我们需要在WordPress插件的设置页面中调用上述设置,以便用户可以输入他们的Tawk.to API密钥。我们可以在插件的主文件中添加以下代码:

function chat_settings_page() {
    ?>
    <div class="wrap">
        <h1><?php echo esc_html(get_admin_page_title()); ?></h1>
        <form method="post" action="options.php">
            <?php
            settings_fields('general');
            do_settings_sections('general');
            submit_button();
            ?>
        </form>
    </div>
    <?php
}
function add_chat_settings_submenu() {
    add_submenu_page('options-general.php', __('Chat Settings', 'wp_chat'), __('Chat Settings', 'wp_chat'), 'manage_options', 'chat-settings', 'chat_settings_page');
}
add_action('admin_menu', 'add_chat_settings_submenu');
Copier après la connexion

在上述代码中,add_submenu_page用于添加一个子菜单,链接到我们的设置页面,chat_settings_page

Ensuite, nous devons ajouter une option à la page des paramètres du plugin WordPress afin que les utilisateurs puissent saisir leur propre clé API Tawk.to. Nous pouvons utiliser l'API Paramètres fournie par WordPress pour ajouter les paramètres suivants :

rrreee

Dans le code ci-dessus, la fonction add_settings_section est utilisée pour ajouter une section de la page des paramètres, et add_settings_field est utilisé pour ajouter un champ de paramètres spécifique, la fonction <code>register_setting est utilisée pour enregistrer nos paramètres.

Enfin, nous devons appeler les paramètres ci-dessus dans la page des paramètres du plugin WordPress afin que les utilisateurs puissent saisir leur clé API Tawk.to. Nous pouvons ajouter le code suivant au fichier principal du plugin : 🎜rrreee🎜Dans le code ci-dessus, add_submenu_page est utilisé pour ajouter un sous-menu qui renvoie à notre page de paramètres, chat_settings_page Méthode utilisée pour afficher le contenu de la page des paramètres. 🎜🎜Grâce aux étapes ci-dessus, nous avons ajouté avec succès la fonction de chat en ligne au plug-in WordPress. Les utilisateurs peuvent saisir leur clé API Tawk.to dans la page des paramètres du plugin et voir un bouton de chat en direct sur le frontend. Lorsque les utilisateurs cliqueront sur le bouton, ils pourront communiquer avec l'administrateur du site Web en temps réel. 🎜🎜Pour résumer, l'ajout d'une fonction de chat en ligne au plug-in WordPress peut considérablement améliorer l'efficacité de la communication instantanée avec les utilisateurs. En intégrant l'interface API d'une plateforme de chat tierce, nous pouvons facilement implémenter cette fonction. J'espère que les exemples de code dans cet article seront utiles ! 🎜

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!

Étiquettes associées:
source:php.cn
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