Documentation du Dr FRAPPE

Ce wiki regroupe les résultats de mes expériences en informatique accumulés au cours de mes recherches sur le net.

Dans la mesure du possible, j'ai cité mes sources ; il en manque certainement…

Cette page est en lecture seule. Vous pouvez afficher le texte source, mais ne pourrez pas le modifier. Contactez votre administrateur si vous pensez qu'il s'agit d'une erreur.

====== Ajouter ses propres boutons à la barre d'outils ======

Ce tutoriel est destiné aux administrateurs. Les utilisateurs du wiki ne peuvent pas avoir accès aux fichiers de configuration. Si vous n'êtes qu'un simple utilisateur, et que vous désirez ajouter des boutons dans la barre d'outils, vous pouvez renvoyer l'administrateur de votre wiki à cette page.

Ajouter des éléments à la barre d'outil est relativement simple, mais il faut avoir une connexion ftp au serveur pour uploader les icônes et éditer les fichiers. 

====== Types de boutons ======

Il y a trois type principaux d'éléments :
  * format - ouvre et ferme des balises autours du texte sélectionné, pour insérer par exemple un titre.
  * insert - ajoute du texte au niveau du curseur.
  * picker - ouvre un sous-menu contenant des éléments "insert"

====== Ajouter des éléments à la barre d'outils ======

  - Trouvez ou créez un icône dont la taille est de 16x16  (une image png en taile 16x16 convient également)
  - Uploadez l'icône dans le dossier <wiki>/lib/images/toolbar/
  - Créez ou éditez le fichier <wiki>/conf/userscript.js et ajoutez le code nécessaire (voir plus bas)

<WRAP center round info 60%>
La moindre erreur de code dans le fichier userscript.js aura des conséquences sur votre toolbar. (Ex : plus de toolbar) \\
Dans ce cas corriger l'erreur et revenez dans votre page, n'oubliez pas de rafraichir votre page (touche F5 du clavier) pour recharger le nouveau code.
</WRAP>

===== Élément "format" =====

L'élément "format" est utilisé pour ajouter des balises avant et après une partie du texte. Si le texte est sélectionné, il sera encadré par les balises correspondant au bouton "format" cliqué. Sinon, les deux balises s'insèreront autours du curseur. Vous pouvez trouver, par exemple, des balises de titre, gras, italique... L'exemple suivant montre comment ajouter un bouton "format" pour le plugin %%<note>%% (cf la page des plugins).

<code javascript|Elémént "format" : exemple du plugin "note">
/* creating a 'format' toolbar item */
if(toolbar){ 
    toolbar[toolbar.length] = {"type":"format",         /*type de l'élément*/
                               "title":"note",          /*titre de l'élément*/
                               "icon":"note_note.png",  /*nom de l'icône*/
                               "key":"",                /*touche de raccourcis*/
                               "open":"<note>",         /*texte inséré à gauche du curseur/texte (balise ouvrante)*/
                               "close":"</note>"}; }    /*texte inséré à droite du curseur/texte (balise fermante)*/
</code>

===== Élément "insert" =====

L'élément "insert" est utilisé pour ajouter du texte à la position du curseur. Voici un exemple : 

<code javascript|Element "insert">
/* creating an 'insert' toolbar item */
if(toolbar){ 
    toolbar[toolbar.length] = {"type":"insert",            /*type de l'élément*/
                               "title":"Table Header",     /*titre de l'élément*/
                               "icon":"header.png",        /*nom de l'icône*/
                               "insert":"^"; }             /*texte à insérer*/
</code>

===== Élément "picker" =====

L'élément "picker" est utilisé pour faire apparaître un sous-menu quand l'utilisateur clique sur le bouton. Le sous-menu peut contenir des caractères ou des icônes, et ajoute (lorsqu'il est cliqué) du texte à la position du curseur (comme pour l'élément "insert"). Ce type d'élément est utilisé par dokuwiki pour montrer les smiley du wiki, ou pour la liste des caractères spéciaux. L'exemple suivant montre comment créer un élément "picker" pour le plugin "note" (cf la page des plugins).

<code javascript|Element "picker" : exemple du plugin "note">
/* creating a 'picker' toolbar item */
var notes_arr = new Array();                               /*Initialisation de l'array contenant le sous-menu*/
notes_arr['<note></note>']='note_note.png';                /*titre_de_array['texte_à_insérer']='icône';*/
notes_arr['<note tip></note>']='note_tip.png';             /*titre_de_array['texte_à_insérer']='icône';*/
notes_arr['<note important></note>']='note_important.png'; /*titre_de_array['texte_à_insérer']='icône';*/
notes_arr['<note warning></note>']='note_warning.png';     /*titre_de_array['texte_à_insérer']='icône';*/
 
if(toolbar){
  toolbar[toolbar.length] = {"type":"picker",        /*type de l'élément*/
                             "title":"Notes",        /*titre de l'élément*/
                             "icon":"note_note.png", /*icône de l'élément*/
                             "key":"",               /*touche de raccourcis*/
                             "list": notes_arr,      /*titre de l'array*/
                             "icobase":"toolbar/"};  /*subdir of lib/images/*/
}
</code>

<WRAP center round info 60%>

Ce texte est une traduction inspirée de : http://www.thefreyers.net/doku.php?id=wikiisms:toolbar.

N'hésitez pas à visiter ce site pour en savoir plus !
</WRAP>

Piste : • Ajouter ses propres boutons à la barre d'outils • @!PAGE@ • Lios : interface graphique pour cuneiform et tesseract • Grsync • De Nginx à Apache : remplacer Nginx par Apache sans perdre les données du site Web et avec le minimum de temps d'arrêt • toolbox : ajoute divers outils à la barre d'outils de l'éditeur • cli : plugin Command Line Interface pour Dokuwiki • Apache : configurer les hôtes virtuels • navigation • Nginx : le serveur Web hautes performances (LEMP)

Documentation du Dr FRAPPE

Recherche

Navigation

Imprimer/exporter

Outils