(redirected from Programming.PmToggleEdit)



Summary: easier addition of toggle-markup.
Version: 0.1.20090914
Prerequisites: PmWiki 2.2.0, Cookbook:Toggle
Status: beta
Maintainer: MichaelPaulukonis
Categories: Editing Markup

Questions answered by this recipe

How can I easily add toggle markup when editing pages?
How can I add a toggle-button to the edit-gui-buttons?


pmToggleEdit adds a button to the edit-bar for easier addition of toggle-markup.


Requires the PmWiki Cookbook recipe Toggle to be enabled.



Basic usage


  1. edit page
  2. highlight region
  3. click the button that looks like a window-shade:




Output will look something like:


(:toggle id="tog1252880238887" show="Show message" init=hide button=1:)
(:div1252880238887 id="tog1252880238887" style="border:1px solid #999;
toggle this text

toggle this text



By default, the text is hidden, and the show message is simply “Show message”. A simple border-style has also been included. To ensure that divs can be safely toggled, the (:divn:)...(:divnend:) markup has been used. A unique id and div-number is assigned using on the Java Script Date.getTime() function.





Download Programming/pm-toggle-edit.zip (3kb)

  1. Install Toggle
  2. copy toggle.gif to pub\guiedit\
  3. copy pm-toggle-edit.js to pub\
  4. add the following to your local\config.php:
$GUIButtons['toggle'] = array(90, '', '', '',
   '<a href=\"#\" onclick=\"pmAddToggle();\"><img src=\'$GUIButtonDirUrlFmt/toggle.gif\' title=\'$[toggle]\' /></a>');


$HTMLFooterFmt['toggle'] = '<script type="text/javascript"



  • Don’t forget to enable javascript in your browser!  



TODO - further development

The use of css for styling would be preferable to the hard-coded style currently included.


At least putting the default style into a more-readily-edited config variable, instead of the less-accessible javascript-file.



Unobtrusive JavaScript toggle

NOTE: as toggle.php is currently implemented, it does not degrade gracefully when JS is disabled (eg, hidden text remains hidden with no easy way to view, outside of page-source). See notes and proposed patch @ Cookbook:Toggle-Talk


see also: Cookbook:UnToggle which deals with this issue (but is a less robust toggle implementation?)



Button template

I’ve found it useful to keep a blank 22x22 button template lying around for adding new entries.
It’s included in pm-toggle-edit.zip Δ, but looks like


Hrm. Pretty boring, yeah? Use your imagination, and start filling it up.


See more buttons and ideas at Cookbook:GuiEdit



See Also




Category tags

Programming javascript php pmwiki cookbook editing