The Marketing Technology Blog

I wrote a post a while ago about how to utilize nice images for your open and closing quotes utilizing style sheets. Wordpress comes with two editors, a basic one and TinyMCE. I don’t utilize TinyMCE but you might want to if you don’t know HTML. My reason is that I like to embed videos once in a while and TinyMCE does not play well.

How can I modify the Wordpress editor to automatically add the blockquote div tag combination?

Back to my point… my tip was to utilize a blockquote div combination. After I set this up in the stylesheet, I found it was a pain in the neck to keep typing in my div tags. So I did some digging and identified the javascript for the basic editor.

The javascript file that controls the basic editor is /wp-includes/js/quicktags.js. I searched and found the blockquote button at line 60:

Original:

edButtons[edButtons.length] =
new edButton(’ed_block’
,’b-quote’
,’\n\n<blockquote>’
,’</blockquote>\n\n’
,’q’
);

Updated (I also removed the extra return in each tag by removing one ‘\n’):

edButtons[edButtons.length] =
new edButton(’ed_block’
,’b-quote’
,’\n<blockquote><div>’
,’</div></blockquote>\n’
,’q’
);

Now, when I click the b-quote button, it automatically adds the necessary div tags so that I get the closing quote image per the CSS hack!