Codex

User:Westi/Custom Quicktags

This article is a ROUGH DRAFT. The author is still working on this document, so please do not edit this without the author's permission. The content within this article may not yet be verified or valid. This information is subject to change.

Plan:

  • What are quicktags
  • How can I add new ones
  • Examples
    • Podz's stuff
    • Owen's stuff - need to check if we can pull this in here - otherwise just reference it.
    • The plugin


References:

Altering quicktag.js

A simple way of adding extra quicktags is to edit quicktags.js this file is pulled in by the admin userinterface and contains all the code for the existing quicktags.

At the top of quicktags.js a function called edButton is defined like this: 

function edButton(id, display, tagStart, tagEnd, access, open) {
  this.id = id;     // used to name the toolbar button
  this.display = display;    // label on button
  this.tagStart = tagStart;    // open tag
  this.tagEnd = tagEnd;    // close tag or empty if no close tag
  this.access = access;    // access key
  this.open = open;    // set to -1 if tag does not need to be closed
}

Later on in the code the function is called in order to add new quicktags to the array of edButton objects like this: 

edButtons[edButtons.length] = new edButton('ed_strong'
,'strong'
,'<strong>'
,'</strong>'
,'b'
);

On order to add you own quicktags you need to extend the list of quicktags definitions with the new ones that you want to add. If you open up the file in your favourite editor and search down until you find the last quicktag definition which should be the definition for <!--nextpage--> you can then copy the definition of this quicktag and paste is straight afterwards editing the content to provide a different quicktag in you admin ui, for example: 

edButtons[edButtons.length] = new edButton('ed_h1'
,'h1'
,'<h1>'
,'</h1>'
,'1'
);
Retrieved from "http://codex.wordpress.org/User:Westi/Custom_Quicktags"

Codex Resources