WordPress: QuickTags Hacks

Filed in: Site News, WordPress — April 8th, 2004

After using WordPress for some times, I have decided to modify the Quicktags( /wp-admin/quicktags.js ) in editor to suit my needs. No big hacks here, just add/modify few characters. The hacks are based on WordPress version 1.0.2.

Here are what I have done on QuickTags( /wp-admin/quicktags.js ):

add shortcut tooltip to Quicktag buttons.
add <code> Quicktag button.
correct the wrong shortcut key for <ins>(same as underline,<u>).
make link to open in new window.

Add Shortcut Tooltip to Quicktag Buttons
By default, the Quicktags buttons does not show up shortcut tooltip on mouse over. It is hard for me to remember the various shortcut key. Therefore, I added title argument into the button code.

Find: function edShowButton(button, i) { (line: 142)
For all document.write in the function(there are three), add: title=”‘ + button.access + ‘” after <input.

Add <code> Quicktag Button
I often use <code> tag in my blog, therefore I added a “code” button(with shortcut ‘c’) into Quicktags. You can use the similar code to add your own tags, too!

Find: edButtons[edButtons.length] = new edButton(’ed_strong’ (line: 28)
Immediate above the line, add the following line of code:
edButtons[edButtons.length] = new edButton(’ed_code’, ‘code’, ‘<code>’, ‘</code>’, ‘c’);
(this will add the new “code” button infront of “str” button)

Correct the Wrong Shortcut Key for <ins>
If you ever tried, you will found that you cannot insert &ltins> tag by pressing a shortcut key(Alt + x, where x is assigned shortcut key character). This is an error in quicktags.js since version 1.0.1, as far as I know. Here is the fix.

Find: edButtons[edButtons.length] = new edButton(’ed_ins’ (line: 49)
Have you found that “ed_del”(above “ed_ins”) is also using “d”? That’s the problem.
Replace:
,’d’
with:
,’n’
(this will make “n” as shortcut key character).

Make Link to Open in New Window
By default, the link created by quicktag will replace your current page with the link target page. I wish to keep my blog reader in my weblog, therefore, I added target=_blank(link will open in new window) to the quicktag link.

Find: function edInsertLink(myField, i, defaultValue) { (line: 345)
Under the line, find:
edButtons[i].tagStart = ‘<a href=”‘ + URL + ‘”>’;
replace with:
edButtons[i].tagStart = ‘<a href=”‘ + URL + ‘” target=”_blank”>’;

Note: target=”_blank” is not Strict XHTML compliant.

Reminder:
After you have made the modifications, remember to save, upload and replace quicktags.js.

Easy Way…
In order save your trouble to edit the quicktags file, you can download hacked copy of quicktags.js and replace yours. (Recommended for WordPress 1.0.2 user only.)

Thought:
*phew* Hope these so-called hacks help some of the WordPress bloggers. Cheers!