Tutoriel : Masquer ou ajouter des raccourcis dans le porte-plume

Préalable

Ce tutoriel nécessite de passer par un plugin. Dans cet article, il faut donc remplacer le terme prefixe, dans les exemples suivants, par le préfixe de votre plugin.

Les pipelines

Comme le précise la documentation, il existe 2 pipelines qui permettent de manipuler les boutons d’une barre d’outil existante :

  • porte_plume_barre_charger sert à afficher ou masquer certains boutons
  • porte_plume_barre_pre_charger sert à ajouter des boutons à une barre

Il faudra donc déclarer ces pipelines dans paquet.xml en ajoutant :

<pipeline nom="porte_plume_barre_charger" inclure="prefixe_pipelines.php" />
<pipeline nom="porte_plume_barre_pre_charger" inclure="prefixe_pipelines.php" />

Il faudra également créer un fichier prefixe_pipelines.php à la racine de votre plugin pour y ajouter les codes suivants.

Masquer certains raccourcis

Pour simplifier le barre d’édition du porte-plume de SPIP, il est possible de cacher certains raccourcis à partir de leurs classes.

Exemple : le bouton permettant d’ajouter des notes a la classe outil_notes, il faut donc utiliser notes.

Ajouter dans le fichier prefixe_pipelines.php

function prefixe_porte_plume_barre_charger($barres) {
	$barre = &$barres['edition'];
 
	// Masquer des boutons
	$barre->cacher('notes');
	$barre->cacher('indenter');
	$barre->cacher('desindenter');
	$barre->cacher('barre_poesie');
	$barre->cacher('guillemets');
	$barre->cacher('sepCode');
	$barre->cacher('grpCode');
 
	return $barres;
}

Ajouter des raccourcis dans la barre d’édition

Note : Les styles CSS ne sont pas traités dans ce tutoriel, à vous de les gérer dans votre feuille de styles via les classes correspondantes. Idem pour les chaines de langues à déclarer dans votre fichier de langue.

Exemple 1 : encadrer un texte

Dans cet exemple, nous allons ajouter un raccourci <encadre> permettant d’avoir un encadré (un élément div avec une classe encadre) dans le contenu d’un article et nous allons placer le bouton après celui du lien dont la classe est outil_link.

Ajouter le bouton

// Ajouter un bouton
function prefixe_porte_plume_barre_pre_charger($barres) {
	$barre = &$barres['edition'];
 
	$barre->ajouterApres('link', array(
		'id' => 'encadre',
		'name' => _T('prefixe:outil_encadre'),
		'className' => 'outil_encadre',
		'openWith' => '<encadre>',
		'closeWith' => '</encadre>',
		'display' => true,
		'selectionType' => 'line',
	));
 
	return $barres;
}

Ajouter le traitement

Pour que notre nouveau raccourci soit utilisable, il doit être traité par SPIP via une wheel : créer un fichier /wheels/prefixe.json (depuis SPIP 4) contenant :

{
    "encadre":{
        "_comment":"Traitement du raccourci <encadre>",
        "match":[
           "<encadre>",
           "</encadre>"
        ],
        "replace":[
           "div class=\"encadre\"><p",
           "div"
        ],
        "priority":-50
     }
 }

Note : le <p> en ouverture d’encadré est nécessaire.

Exemple 2 : du gras de couleur

Dans cet exemple, nous allons ajouter un raccourci {{** ... **}} permettant d’avoir du gras de couleur (un élément strong avec une classe emphase) et nous allons placer le bouton sous celui du gras normal dont la classe est outil_bold.

Ajouter le bouton

function prefixe_porte_plume_barre_pre_charger($barres) {
	$barre = &$barres['edition'];
 
	$barre->set('bold', array(
		'dropMenu' => array(
			array(
				'id' => 'gras_emphase',
				'name' => _T('prefixe:outil_gras_emphase'),
				'className' => 'outil_gras_emphase',
				'openWith' => '{{*',
				'closeWith' => '*}}',
				'display' => true,
				'selectionType' => 'word',
			),
		),
	));
 
	return $barres;
}

Ajouter le traitement

{
    "emphase":{
       "_comment":"Traitement du raccourci {{* ... *}}",
       "match":[
          "/\\{\\{\\*/S",
          "/\\*\\}\\}/S"
       ],
       "replace":[
          "<strong class=\"emphase\">",
          "</strong>"
       ],
       "priority":-50
    }
 }

Déclarer les wheels

Pour déclarer les wheels à SPIP, ajouter ce code à votre fichier fonctions prefixe_fonctions.php :

$GLOBALS['spip_wheels']['raccourcis'][] = 'prefix';

Discussion

One discussion

Add a comment

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite / PostgreSQL
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparait.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Who are you?
[Log in]

To show your avatar with your message, register it first on gravatar.com (free et painless) and don’t forget to indicate your Email addresse here.

Enter your comment here

This form accepts SPIP shortcuts {{bold}} {italic} -*list [text->url] <quote> <code> and HTML code <q> <del> <ins>. To create paragraphs, just leave empty lines.

Add a document

Follow the comments: RSS 2.0 | Atom