Création d'un custom BBCODE - Tooltip

Mathieu ?

Mathieu ?

IT Officer @STATION F
Premium
Inscription
19 Novembre 2016
Messages
1 247
Réactions
1 460
Points
12 310
RGCoins
45
XenForo - Développement d'un custom BBCODE ​

Pré-requis:
XenForo en mode debug
Vous devez être inscrit pour voir les liens ! Inscrivez-vous ou connectez-vous ici.


Dans un premier temps nous allons créer la structure de notre addon via une CLI, pour ce faire on ouvre le Terminal et nous allons a la racine de notre XenForo. Une fois cela fais il ne vous reste plus cas taper: php cmd.php xf-addon:create pour la suite voici une description des champs:
​
Enter an ID for this add-on: <directory_name>/<addon_name> Exemple: ForoAgency/BbCodeTooltip
Enter a title: addon_name Exemple: BBCODE Tooltip
Enter a version ID : <int> Exemple: 10000
Enter the version string: <version_string> Exemple: 1.0.0
Does this add-on supersede a XenForo 1 add-on? (y/n): y/n Pour notre cas on mettras n
Does your add-on need a Setup file? (y/n): y/n Pour notre cas on mettras n

Une fois cela fais ouvrer votre IDE avec en dossier de projet src/addons/<directory_name>/<addon_name> vous devriez y voir 1 fichier nommer addon.json.​

Passon maintenant a la creation de notre addon, dans un premier temps nous allons renseigner les données de notre futur BBCODE dans le panel. Pour ce faire rendez-vous dans admin.php?bb-codes/add. Une fois cela fais nous allons donc renseigner tout els champs utile pour notre addon:​
BB code tag: tooltip
Title: Tooltip
Description: (ce que vous voulez)
Replacement mode: PHP callback
Supports option parameter: Pour nous sa seras Yes cela signifie que notre BBCODE ne peut etre utiliser que si une option est renseigner ([blabla=option])
PHP callback: <directory_name>\<addon_name>\<class_name> :: <function_name> Pour nous sa seras: ForoAgency\BbCodeTooltip\Tooltip :: renderTooltip
Editor icon: Remplir uniquement si vous voulez voir un bouton apparaitre dans les options de l'editeur.
Example usage: [tooltip=Je suis dans un tooltip !]Passe ta souris sur moi ![/tooltip]
Add-on: On selection notre addon (BBCODE Tooltip)
Advanced options: Ici vous faites comme vous voulez !

Maintenant vous retourner sur votre IDE et au meme endroit que notre fichier addon.json on creer un fichier PHP nommer Tooltip.php votre fichier devras ressembler a sa:​
PHP: 
<?php
/**
* Created by PhpStorm.
* User: marentdev
* Date: 21/03/2018
* Time: 07:30
*/

namespace ForoAgency\BbCodeTooltip; //Biensure ici vous sa seras <directory_name>\<addon_name>


use XF\BbCode\Renderer\AbstractRenderer;

class Tooltip
{
    public static function renderTooltip($tagChildren, $tagOption, $tag, array $options, AbstractRenderer $renderer)
    {
        /**
        * Ici on parse tout les autres Balise BBCODE presente entre [tooltip][/tooltip] et on retourne le texte final.
        */
        $text = $renderer->renderSubTree($tagChildren, $options);
 
        /**
        * Ici pour finir on retourne le resultat en html du BBCODE Tooltip en n'oubliant pas de sécuriser un minimum pour éviter les failles XSS
        * $tabOption nous permet de récupérer le text insérer en option dans le BBCODE
        */
        return '<span data-xf-init="tooltip" title="' . \XF::escapeString($tagOption) . '">' . $text . '</span>';
    }
}

Voila il ne vous reste plus cas retourner sur votre page de creation d'un custom BBCODE et de valider ! Vous pouvez des maintenant aller tester sur un de vos topics :dance:

Pour release par la suite votre addon il vous suffie de taper la commande php cmd.php xf-addon:build-release <directory_name>/<addon_name> pour moi sa seras donc php cmd.php xf-addon:build-release ForoAgency/BbCodeTooltip et voila un dossier _releases est alors creer a la racine de votre addon contenant l'archive zip a partager !

Voila c'est la fin de ce petit tuto rapide mais j'espere qu'ils vous auras appris les bases d'un custom BBCODE ! :dance:​
 
Dernière édition:
Retour
Haut