On certain sites, you may want to allow your users a little more freedom with their comments, or if you're using the community templates in MovableType, then you may want to improve the "Create Entry" screens to allow rich text.
I managed to squeeze the YUI RTE into a stock forum template set, then just haven't got round to writing it up yet. You can see it in action here, and below the jump is the write-up, it's surprisingly easy!
I've also put it on here, for registered commenters, something else that needs a write-up really!
Create Entry
<mt:SetVarBlock name="html_head">
And immediately after it, paste the following code:
<!-- Combo-handled YUI CSS files: -->
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/combo?2.7.0/build/assets/skins/sam/skin.css">
<!-- Combo-handled YUI JS files: -->
<script type="text/javascript" src="http://yui.yahooapis.com/combo?2.7.0/build/yahoo-dom-event/yahoo-dom-event.js&2.7.0/build/container/container_core-min.js&2.7.0/build/menu/menu-min.js&2.7.0/build/element/element-min.js&2.7.0/build/button/button-min.js&2.7.0/build/editor/editor-min.js"></script>
This loads the relevant YUI modules onto the page for later use. You will also need to add the "yui-skin-sam" class to your body tag. Luckily this template set allows you to easily edit the body class, look at the first line of this template and change it to the following:
<$mt:Var name="body_class" value="mt-profile-post yui-skin-sam"$>
The last stage in this template is to add the code that will actually generate the editor on the page. Paste the following after the "Entry Form" include and before the "Footer":
<script type="text/javascript">
var myEditor = new YAHOO.widget.SimpleEditor('entry-body', {
height: '300px',
width: '550px',
handleSubmit: true,
dompath: true, //Turns on the bar at the bottom
animate: true //Animates the opening, closing and moving of Editor windows
});
myEditor.render();
</script>
You're done with the Create Entry template for now, but don't bother publishing, just save, as we need to change the JS files before it will post properly.
Now, the next stage requires editing the "GlobalJavaScript" template, which will affect all your blogs/sites that use it on this MT installation, so if you only want to apply this change to one
blog/site/forum then you will need to copy the template into the site's templates and edit there.
In "GlobalJavaScript" look for the "mtCommentOnSubmit" function and add the line:
myEditor.saveHTML();
On line 3 of that function (after the first "mtRequestSubmitted = true;").
Re-publish and you're done.
Coming up soon, adding YUI RTE to replies and to a normal blog install.
Leave a comment