ToME

Question

Comment puis-je ajouter une barre de boutons dans la fenêtre d'édition comme sur le site pmwiki.org ?

Réponse

Dans le fichier local/config.php ajouter :

$EnableGUIButtons = 1;

C'est tout !

Si vous avez concocté vous-même votre thème PmWiki, assurez-vous d'y avoir la balise  à l'intérieur de la section <head>, sinon vous ne verrez jamais la barre de boutons (en plus de vous retrouver avec une erreur Javascript...) Benoît Pruneau ? 10 juin 2009 à 23h17

Options

Boutons plus grands

Vous trouvez peut-être les boutons originaux un peu petits (22x22), utilisez alors un nouveau jeu de boutons plus grands (34x32) :

GUIButtons32.zip

Ces boutons seront installés dans un nouveau sous-répertoire de /pub, par exemple pub/guiedit32.
Ajoutez la ligne suivante au fichier local/config.php :

$GUIButtonDirUrlFmt = "$FarmPubDirUrl/guiedit32";

Nouveaux boutons

Vous pouvez ajouter de nouveaux boutons en mettant leur description dans le fichier local/config.php.

Ce script ajoute une barre de boutons au formulaire d'édition.

Les boutons sont placés dans le tableau $GUIButtons, chaque bouton est décrit par un tableau de cinq valeurs :

la position du bouton relativement aux autres (un nombre)
la séquence de balise d'ouverture
la séquence de balise de fermeture
le texte par défaut si rien n'est sélectionné
le texte du bouton, soit (a) une balise HTML ou (b) l'URL d'une image gif/jpg/png à utiliser pour le bouton (avec le "title" optionnel entre guillemets).

La position est juste un numéro d'ordre, vous pouvez avoir des écarts supérieurs à 1 entre les nombres, ce qui permet de réserver de la place pour insérer des boutons plus tard.

Les positions actuelles sont :

'em' : 100
'strong' : 110
'pagelink' : 200
'extlink' : 210
'attach' : 220
'big' : 300
'small' : 310
'sup' : 320
'sub' : 330
'h2' : 400
'center' : 410

Autres boutons du fichier sample-config

Pour les en-têtes - la différence avec l'existant est l'image

$GUIButtons['h2'] = array(400, '\\n!! ', '\\n', '$[Heading]', '$GUIButtonDirUrlFmt/h2.gif"$[Heading]"');

Pour les sous en-têtes

$GUIButtons['h3'] = array(402, '\\n!!! ', '\\n', '$[Subheading]', '$GUIButtonDirUrlFmt/h3.gif"$[Subheading]"');

Pour indenter le texte

$GUIButtons['indent'] = array(500, '\\n->', '\\n', '$[Indented text]', '$GUIButtonDirUrlFmt/indent.gif"$[Indented text]"');

Pour indenter négativement le texte (l'indentation débute à la deuxième ligne)

$GUIButtons['outdent'] = array(510, '\\n-<', '\\n', '$[Hanging indent]', '$GUIButtonDirUrlFmt/outdent.gif"$[Hanging indent]"');

Pour une liste ordonnée

$GUIButtons['ol'] = array(520, '\\n# ', '\\n', '$[Ordered list]', '$GUIButtonDirUrlFmt/ol.gif"$[Ordered (numbered) list]"');

Pour une liste à puces

$GUIButtons['ul'] = array(530, '\\n* ', '\\n', '$[Unordered list]', '$GUIButtonDirUrlFmt/ul.gif"$[Unordered (bullet) list]"');

Pour une ligne de séparation horizontale

$GUIButtons['hr'] = array(540, '\\n----\\n', '', '', '$GUIButtonDirUrlFmt/hr.gif"$[Horizontal rule]"');

Un modèle de tableau simple

$GUIButtons['table'] = array(600, '||border=1 width=80%\\n||$[!Hdr] ||$[!Hdr] ||$[!Hdr] ||\\n'. '|| || || ||\\n|| || || ||\\n', '', '', '$GUIButtonDirUrlFmt/table.gif"$[Table]"');

Boutons divers

Un modèle de tableau élaboré

$GUIButtons ['advtable'] = array(610, '(:table border=1 width=80%:)\\n(:cellnr:)\'\'\'$[Header]\'\'\'\\n'. '(:cell:)\'\'\'$[Header]\'\'\'\\n(:cell:)\'\'\'$[Header]\'\'\'\\n'. '(:cellnr:)\\n(:cell:)\\n(:cell:)\\n(:tableend:)\\n', '', '', '$GUIButtonDirUrlFmt/table2.gif"$[Advanced table]"');

Boutons pour les addons du Cookbook :

Table de matières - voir Table des matières - bouton au début - (actuellement, image uniquement dans le jeu 34x32)

$GUIButtons ['pagetoc'] = array(90, '\\n(:toc:)\\n', '', '', '$GUIButtonDirUrlFmt/toc.gif"$[Table of content]"');

Minimage - voir création automatique de vignettes - bouton à la fin.

$GUIButtons ['image'] = array(620, 'Img:', '', '$[MyImage.jpg]', '$GUIButtonDirUrlFmt/image.gif"$[Insert image]"');

Discussion

Une amélioration au script peut être d'autoriser l'annulation. Sur certains navigateurs/systèmes 'Ctrl-Z' fonctionne, mais pas sur tous.

Changer l'image des boutons par défaut?

Comment changer l'image par défaut? J'ai modifié $GUIButtonDirUrlFmt pour pointer vers mon skin perso, avec un répertoire de boutons. Le problème est que j'ai des boutons .png et non pas .gif donc il me faudrait changer l'image qui s'affiche par défaut. Comment faire sans modifier le core? Caroline Guénette ?

Vous pouvez définir la variable $GUIButtons dans config.php. --Petko ? 14 novembre 2011 à 09h46

$GUIButtons = array(
  'em'       => array(100, "''", "''", '$[Emphasized]',
                  '$GUIButtonDirUrlFmt/em.png"$[Emphasized (italic)]"', 
                  '$[ak_em]'),
  'strong'   => array(110, "'''", "'''", '$[Strong]',
                  '$GUIButtonDirUrlFmt/strong.png"$[Strong (bold)]"',
                  '$[ak_strong]'),
  'pagelink' => array(200, '[[', ']]', '$[Page link]', 
                  '$GUIButtonDirUrlFmt/pagelink.png"$[Link to internal page]"'),
  'extlink'  => array(210, '[[', ']]', 'http:// | $[link text]',
                  '$GUIButtonDirUrlFmt/extlink.png"$[Link to external page]"'),
  'big'      => array(300, "'+", "+'", '$[Big text]',
                  '$GUIButtonDirUrlFmt/big.png"$[Big text]"'),
  'small'    => array(310, "'-", "-'", '$[Small text]',
                  '$GUIButtonDirUrlFmt/small.png"$[Small text]"'),
  'sup'      => array(320, "'^", "^'", '$[Superscript]',
                  '$GUIButtonDirUrlFmt/sup.png"$[Superscript]"'),
  'sub'      => array(330, "'_", "_'", '$[Subscript]',
                  '$GUIButtonDirUrlFmt/sub.png"$[Subscript]"'),
  'h2'       => array(400, '\\n!! ', '\\n', '$[Heading]',
                  '$GUIButtonDirUrlFmt/h.png"$[Heading]"'),
  'center'   => array(410, '%center%', '', '',
                  '$GUIButtonDirUrlFmt/center.png"$[Center]"'));

Problèmes

Dans Opera et Khtml le texte est "inlined" à la fin du document, pas à la postion du curseur. - Schlaefer ?
C'est une limitation d'Opera -- Opera ne permet pas de trouver la position du curseur ou d'insérer du texte au milieu d'un élément <textarea>. Je ne sais pas pour Khtml, mais je suppose qu'il s'agit du même problème. --Pm ?

Je ne le savais pas. Je choisis de ne pas afficher la barre de boutons en mettant ce qui suit à la fin de insButton()
var clientPC = navigator.userAgent.toLowerCase(); var BrowserIsSafari = ((clientPC.indexOf('applewebkit')!=-1) && (clientPC.indexOf('spoofer')==-1)); var BrowserIsOpera = clientPC.indexOf('opera')!=-1; if (BrowserIsSafari || BrowserIsOpera) return;

Schlaefer ?

Voir aussi

Un exemple de barre de gros boutons avec les boutons décrits ci-dessus :

http://cncloisirs.com/Fonctionnement.BacASable?action=edit

Note : vous pouvez aussi trouver sur cette fenêtre d'édition, la suppression du menu, de l'en-tête et du pied de page décrits ici : layout edit modified ?

Traduction

Le texte associé aux boutons peut être traduit dans un langage donné dans les XLPage(s). Voir le paragraphe approprié dans Localization.XLPageTemplate.

Contributeurs

PRZ ?

<< Editer par double click | Index compléments | Formatage des tableaux simples >>

Traduction de Cookbook.GuiEdit - Page originale sur PmWiki:PmWikiFr.BarreDédition

Page originale sur PmWikiFr.BarreDEdition - Backlinks

Dernières modifications:
PmWikiFr.BarreDEdition: November 14, 2011, at 09:46 AM

skip to main content Big View ToME PmWikiFr \| BarreDEdition History Random
Page de garde Fr Bac à sable En Français Fonctionnalités Téléchargement Installation Bases de l'édition Documentation FAQ PmWikiFr Philosophie de PmWiki Notes de versions Feuille de route Doc administration Doc compléments Administration site Traduction Etat de la Traduction Pmwiki.org Liste de discussion Utilisateurs Réussites Financer Pm Autres langues En Anglais Change log Livre de recettes ? Catégories ? Thèmes ? Rapports d'erreurs ? Administration du site Menu de la version anglaise Sections Categories Background Characters Reality Stories Most Notable Jaina Jade Pasht Moonburnt Ree Random page Character Artemisia ("Missy") `(Cc>` TriadSkin (style options) powered by PmWiki	Barre d'édition Question Comment puis-je ajouter une barre de boutons dans la fenêtre d'édition comme sur le site pmwiki.org ? Réponse Dans le fichier local/config.php ajouter : `$EnableGUIButtons` = 1; C'est tout ! Si vous avez concocté vous-même votre thème PmWiki, assurez-vous d'y avoir la balise `<!--HTMLHeader-->` à l'intérieur de la section <head>, sinon vous ne verrez jamais la barre de boutons (en plus de vous retrouver avec une erreur Javascript...) Benoît Pruneau ? 10 juin 2009 à 23h17 Options Boutons plus grands Vous trouvez peut-être les boutons originaux un peu petits (22x22), utilisez alors un nouveau jeu de boutons plus grands (34x32) : GUIButtons32.zip Ces boutons seront installés dans un nouveau sous-répertoire de /pub, par exemple pub/guiedit32. Ajoutez la ligne suivante au fichier local/config.php : $GUIButtonDirUrlFmt = "`$FarmPubDirUrl`/guiedit32"; Nouveaux boutons Vous pouvez ajouter de nouveaux boutons en mettant leur description dans le fichier local/config.php. Ce script ajoute une barre de boutons au formulaire d'édition. Les boutons sont placés dans le tableau `$GUIButtons`, chaque bouton est décrit par un tableau de cinq valeurs : la position du bouton relativement aux autres (un nombre) la séquence de balise d'ouverture la séquence de balise de fermeture le texte par défaut si rien n'est sélectionné le texte du bouton, soit (a) une balise HTML ou (b) l'URL d'une image gif/jpg/png à utiliser pour le bouton (avec le "title" optionnel entre guillemets). La position est juste un numéro d'ordre, vous pouvez avoir des écarts supérieurs à 1 entre les nombres, ce qui permet de réserver de la place pour insérer des boutons plus tard. Les positions actuelles sont : 'em' : 100 'strong' : 110 'pagelink' : 200 'extlink' : 210 'attach' : 220 'big' : 300 'small' : 310 'sup' : 320 'sub' : 330 'h2' : 400 'center' : 410 Autres boutons du fichier sample-config Pour les en-têtes - la différence avec l'existant est l'image $GUIButtons['h2'] = array(400, '\\n!! ', '\\n', '$[Heading]', '$GUIButtonDirUrlFmt/h2.gif"$[Heading]"'); Pour les sous en-têtes $GUIButtons['h3'] = array(402, '\\n!!! ', '\\n', '$[Subheading]', '$GUIButtonDirUrlFmt/h3.gif"$[Subheading]"'); Pour indenter le texte $GUIButtons['indent'] = array(500, '\\n->', '\\n', '$[Indented text]', '$GUIButtonDirUrlFmt/indent.gif"$[Indented text]"'); Pour indenter négativement le texte (l'indentation débute à la deuxième ligne) $GUIButtons['outdent'] = array(510, '\\n-<', '\\n', '$[Hanging indent]', '$GUIButtonDirUrlFmt/outdent.gif"$[Hanging indent]"'); Pour une liste ordonnée $GUIButtons['ol'] = array(520, '\\n# ', '\\n', '$[Ordered list]', '$GUIButtonDirUrlFmt/ol.gif"$[Ordered (numbered) list]"'); Pour une liste à puces $GUIButtons['ul'] = array(530, '\\n* ', '\\n', '$[Unordered list]', '$GUIButtonDirUrlFmt/ul.gif"$[Unordered (bullet) list]"'); Pour une ligne de séparation horizontale $GUIButtons['hr'] = array(540, '\\n----\\n', '', '', '$GUIButtonDirUrlFmt/hr.gif"$[Horizontal rule]"'); Un modèle de tableau simple $GUIButtons['table'] = array(600, '\|\|border=1 width=80%\\n\|\|$[!Hdr] \|\|$[!Hdr] \|\|$[!Hdr] \|\|\\n'. '\|\| \|\| \|\| \|\|\\n\|\| \|\| \|\| \|\|\\n', '', '', '$GUIButtonDirUrlFmt/table.gif"$[Table]"'); Boutons divers Un modèle de tableau élaboré $GUIButtons ['advtable'] = array(610, '(:table border=1 width=80%:)\\n(:cellnr:)\'\'\'$[Header]\'\'\'\\n'. '(:cell:)\'\'\'$[Header]\'\'\'\\n(:cell:)\'\'\'$[Header]\'\'\'\\n'. '(:cellnr:)\\n(:cell:)\\n(:cell:)\\n(:tableend:)\\n', '', '', '$GUIButtonDirUrlFmt/table2.gif"$[Advanced table]"'); Boutons pour les addons du Cookbook : Table de matières - voir Table des matières - bouton au début - (actuellement, image uniquement dans le jeu 34x32) $GUIButtons ['pagetoc'] = array(90, '\\n(:toc:)\\n', '', '', '$GUIButtonDirUrlFmt/toc.gif"$[Table of content]"'); Minimage - voir création automatique de vignettes - bouton à la fin. $GUIButtons ['image'] = array(620, 'Img:', '', '$[MyImage.jpg]', '$GUIButtonDirUrlFmt/image.gif"$[Insert image]"'); Discussion Une amélioration au script peut être d'autoriser l'annulation. Sur certains navigateurs/systèmes 'Ctrl-Z' fonctionne, mais pas sur tous. Changer l'image des boutons par défaut? Comment changer l'image par défaut? J'ai modifié $GUIButtonDirUrlFmt pour pointer vers mon skin perso, avec un répertoire de boutons. Le problème est que j'ai des boutons .png et non pas .gif donc il me faudrait changer l'image qui s'affiche par défaut. Comment faire sans modifier le core? Caroline Guénette ? Vous pouvez définir la variable `$GUIButtons` dans config.php. --Petko ? 14 novembre 2011 à 09h46 $GUIButtons = array( 'em' => array(100, "''", "''", '$[Emphasized]', '$GUIButtonDirUrlFmt/em.png"$[Emphasized (italic)]"', '$[ak_em]'), 'strong' => array(110, "'''", "'''", '$[Strong]', '$GUIButtonDirUrlFmt/strong.png"$[Strong (bold)]"', '$[ak_strong]'), 'pagelink' => array(200, '[[', ']]', '$[Page link]', '$GUIButtonDirUrlFmt/pagelink.png"$[Link to internal page]"'), 'extlink' => array(210, '[[', ']]', 'http:// \| $[link text]', '$GUIButtonDirUrlFmt/extlink.png"$[Link to external page]"'), 'big' => array(300, "'+", "+'", '$[Big text]', '$GUIButtonDirUrlFmt/big.png"$[Big text]"'), 'small' => array(310, "'-", "-'", '$[Small text]', '$GUIButtonDirUrlFmt/small.png"$[Small text]"'), 'sup' => array(320, "'^", "^'", '$[Superscript]', '$GUIButtonDirUrlFmt/sup.png"$[Superscript]"'), 'sub' => array(330, "'_", "_'", '$[Subscript]', '$GUIButtonDirUrlFmt/sub.png"$[Subscript]"'), 'h2' => array(400, '\\n!! ', '\\n', '$[Heading]', '$GUIButtonDirUrlFmt/h.png"$[Heading]"'), 'center' => array(410, '%center%', '', '', '$GUIButtonDirUrlFmt/center.png"$[Center]"')); Problèmes Dans Opera et Khtml le texte est "inlined" à la fin du document, pas à la postion du curseur. - Schlaefer ? C'est une limitation d'Opera -- Opera ne permet pas de trouver la position du curseur ou d'insérer du texte au milieu d'un élément <textarea>. Je ne sais pas pour Khtml, mais je suppose qu'il s'agit du même problème. --Pm ? Je ne le savais pas. Je choisis de ne pas afficher la barre de boutons en mettant ce qui suit à la fin de insButton() var clientPC = navigator.userAgent.toLowerCase(); var BrowserIsSafari = ((clientPC.indexOf('applewebkit')!=-1) && (clientPC.indexOf('spoofer')==-1)); var BrowserIsOpera = clientPC.indexOf('opera')!=-1; if (BrowserIsSafari \|\| BrowserIsOpera) return; Schlaefer ? Voir aussi Un exemple de barre de gros boutons avec les boutons décrits ci-dessus : http://cncloisirs.com/Fonctionnement.BacASable?action=edit Note : vous pouvez aussi trouver sur cette fenêtre d'édition, la suppression du menu, de l'en-tête et du pied de page décrits ici : layout edit modified ? Traduction Le texte associé aux boutons peut être traduit dans un langage donné dans les XLPage(s). Voir le paragraphe approprié dans Localization.XLPageTemplate. Contributeurs PRZ ? << Editer par double click \| Index compléments \| Formatage des tableaux simples >> Traduction de Cookbook.GuiEdit - Page originale sur PmWiki:PmWikiFr.BarreDédition Page originale sur PmWikiFr.BarreDEdition - Backlinks Dernières modifications: PmWikiFr.BarreDEdition: November 14, 2011, at 09:46 AM Page History Source Backlinks List Group Print-Friendly Version Page last modified on November 14, 2011, at 09:46 AM	Other general PmWikiFr pages All Categories Artemisia Bardic Web Dreamwidth Jaina Jade Magic NPC Pasht Profusion Retired Tabletop TSFV Twine
skin config pmwiki-2.3.38

Barre d'édition