Dec 212010

I ran into a small issue yesterday which after upgrading to 3.0.3 that the colorcoder plugin removed the ‘code’ button from the HTML editor. In researching how to remedy this, I came across instruction to modify the quicktags.js file which controls the functionality of the buttons on the HTML editor. In order to add, remove or modify these buttons;

Browse to the default WP folder install location and then into the folder /wp-includes/js/

move the compressed default quicktags.js to quicktags.js.bak

mv quicktags.js quicktags.js.bak

then copy the file to quicktags.js (it’s the same file, only compressed)

cp quicktags.js

edit the quicktags.js file

vim quicktags.js

add buttons using the following format;

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

div tag

<br />
edButtons[edButtons.length] =<br />
new edButton('ed_div'<br />
,'div'<br />
<div>'<br />
<p>'<br />
,'d'<br />
);<br />

link2 button (original link button has specific code related to it later in the file which defaults to the standard link action)

<br />
edButtons[edButtons.length] =<br />
new edButton('ed_link2'<br />
,'link2'<br />
,'From <a href=”url” target="_blank">link title'<br />
,'</a>'<br />
,'c'<br />
);<br />

email link button

<br />
edButtons[edButtons.length] =<br />
new edButton('ed_email'<br />
,'email'<br />
,'<a href=”mailto:EMAIL”>'<br />
,'</a>'<br />
,'c'<br />
);<br />

You can modify this file to add or remove buttons which are more or less useful depending on your needs.

Share This!
 Posted by at 10:43 am

Sorry, the comment form is closed at this time.