|
PmWikiJa / GuiEdit
Question質問How can I add a graphical button bar in the edit window, as in the pmwiki.org site ? どうやって編集画面に、pmwiki.orgサイトのようなグラフィカルボタンバーを加えられますか? Answer回答Add the following in local/config.php file That's all ! 次のようにlocal/config.phpファイルに加えます それだけ! OptionsオプションLarger buttonsYou may find the original buttons a bit small (22x22) so you can find a new set of larger buttons (34x32) here : Attach:GUIButtons32.zip 大きなボタンオリジナルの小さなボタン(22x22)を見つければ、大きなボタン(34x32)を見つけることが出来ます: GUIButtons32.zip These buttons shall be installed in a new subdirectory of /pub directory, e.g. pub/guiedit32. これらのボタンは /pubディレクトリの新しいサブディレクトリにインストールされるでしょう、例えば pub/guiedit32に。 $GUIButtonDirUrlFmt = ' New buttonsYou can add new buttons by adding their description in local/config.php file. New buttonslocal/config.phpに定義を加えることで新しいボタンを加えられます。 This script adds a graphical button bar to the edit page form. このスクリプトは編集ページのフォームにグラフィカルなボタンを加えます。 The buttons are placed in the
ボタンは $GUIButtons配列に設定され、それぞれのボタン配列は5つの値で定義される。
The position is just an order number, you can have more than a difference of 1 between the numbers, which allow room to insert others buttons later. 位置番号は順番のみで(1以上異なる数値)、後で異なるボタンを挿入できる余地を許可します。 The present positions are : 表示されている位置は:
Others buttons, from sample-config file その他のボタン、sample-configファイルより
$GUIButtons['h2'] = array(400, '\\n!! ', '\\n', '$[Heading]', '$GUIButtonDirUrlFmt/h2.gif"$[Heading]"');
$GUIButtons['h3'] = array(402, '\\n!!! ', '\\n', '$[Subheading]', '$GUIButtonDirUrlFmt/h3.gif"$[Subheading]"');
$GUIButtons['indent'] = array(500, '\\n->', '\\n', '$[Indented text]', '$GUIButtonDirUrlFmt/indent.gif"$[Indented text]"');
$GUIButtons['outdent'] = array(510, '\\n-<', '\\n', '$[Hanging indent]', '$GUIButtonDirUrlFmt/outdent.gif"$[Hanging indent]"');
$GUIButtons['ol'] = array(520, '\\n# ', '\\n', '$[Ordered list]', '$GUIButtonDirUrlFmt/ol.gif"$[Ordered (numbered) list]"');
$GUIButtons['ul'] = array(530, '\\n* ', '\\n', '$[Unordered list]', '$GUIButtonDirUrlFmt/ul.gif"$[Unordered (bullet) list]"');
$GUIButtons['hr'] = array(540, '\\n----\\n', '', '', '$GUIButtonDirUrlFmt/hr.gif"$[Horizontal rule]"');
$GUIButtons['table'] = array(600, '||border=1 width=80%\\n||$[!Hdr] ||$[!Hdr] ||$[!Hdr] ||\\n'. '|| || || ||\\n|| || || ||\\n', '', '', '$GUIButtonDirUrlFmt/table.gif"$[Table]"'); Miscellaneous buttons
$GUIButtons ['underline'] = array(95, '{+', '+}', '$[text]', '$GUIButtonDirUrlFmt/underline.gif"$[Underline]"');
$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]"');
Images: Attach:gui-style-buttons.zip Attach:st1.gif Attach:st2.gif Attach:st3.gif Attach:st4.gif #Define custom styles s1 to s4: $WikiStyle['s1']['background-color']='#def'; $WikiStyle['s1']['padding']='3px'; $WikiStyle['s2']['background-color']='#efd'; $WikiStyle['s2']['padding']='3px'; $WikiStyle['s3']['background-color']='#ffb'; $WikiStyle['s3']['padding']='3px'; $WikiStyle['s4']['background-color']='#fed'; $WikiStyle['s4']['padding']='3px'; #Button definitions creating %block s1% etc markup: $GUIButtons ['style1'] = array(500, '%25block s1%25', '', '', '$GUIButtonDirUrlFmt/st1.gif"$[Style 1]"'); $GUIButtons ['style2'] = array(510, '%25block s2%25', '', '', '$GUIButtonDirUrlFmt/st2.gif"$[Style 2]"'); $GUIButtons ['style3'] = array(520, '%25block s3%25', '', '', '$GUIButtonDirUrlFmt/st3.gif"$[Style 3]"'); $GUIButtons ['style4'] = array(530, '%25block s4%25', '', '', '$GUIButtonDirUrlFmt/st4.gif"$[Style 4]"'); Buttons for Cookbook addons :
$GUIButtons ['pagetoc'] = array(90, '\\n(:toc:)\\n', '', '', '$GUIButtonDirUrlFmt/toc.gif"$[Table of content]"');
$GUIButtons ['image'] = array(620, 'Img:', '', '$[MyImage.jpg]', '$GUIButtonDirUrlFmt/image.gif"$[Insert image]"');
$GUIButtons ['snote'] = array(640, '{=', '=}', '$[text]', '$GUIButtonDirUrlFmt/snote.gif"$[Sticky note]"'); $GUIButtons['sig'] = array(460, '----\\n~~~:\\\\\\\\\n', '\\n ~~~~\\n\\n', '', '$GUIButtonDirUrlFmt/sig.gif"$[Stamp your name and current date]"');
$GUIButtons['hit'] = array(420, '%green%', '%%', '', '$GUIButtonDirUrlFmt/hightext.gif"$[Highlight the text color\\n(select text, then click here)]"'); $GUIButtons['hib'] = array(440, '%bgcolor=yellow%', '%%', '', '$GUIButtonDirUrlFmt/highbg.gif"$[Highlight the paper color]"'); DiscussionAn improvement to the script can be to allow an undo. On some browser/installation 'Ctrl-Z' works, but not on all. Q: Is it possible to add a 2nd row of buttons below the first one ? jmi? Also curious about this as well -cs Problems
I didn't know that. I choose not to output the buttonbar by putting the following at the beginning of 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;
Now fixed for beta45.
See alsoAn example of the big button bar, with the button as defined above : http://cncloisirs.com/Fonctionnement.BacASable?action=edit Note : you can also find on this edit window a removal of menu, header and footer described here : layout edit modified? TranslationThe text associated with the button can be translated in a given language via the XLPage. See the appropriated paragraph in the Localization.XLPageTemplate and for Cookbook buttons in Localization.XLPageCookbookTemplate ContributorsCategory: Layout |