mojoCMS Premium Add-Ons & Services

mojoRadGlue Editor Provider

mojoPortal ships with the 3 most popular open source Editors, TinyMCE, CKeditor, and FCKeditor, but each of these has its quirks, and some people would like to use a commercial editor such as the RAD Editor sold by Telerik. Since many .NET shops already use Telerik RAD Controls and many developers already have licenses, it seemed like a good idea to make it easy to use RAD Editor in mojoPortal. 

We have a provider model in place for the editors used in mojoPortal, so a developer could implement their own provider to plugin RAD Editor. Actually it isn't very difficult for an experienced developer, you could study the source code for the editor providers that we include in mojoPortal and figure out how to write your own, but maybe there are more important things you could work on and you would rather not have to worry about how to integrate RAD Editor. We implemented our mojoRadGlue Editor Provider just for you, and source code is included in case you need further customizations. Priced at only $9 it is a good value and a good way to support ongoing development of mojoPortal. Of course, it does not include RAD Editor, you have to purchase that from Telerik as part of their RAD Controls bundle which is fairly expensive but includes a lot of very good controls you can use in custom development.

Disclaimer: I am not affiliated in any way with Telerik and have no business relationship with them.

Features of the mojoRadGlue Editor Provider

  • Easy to plug in and configure
  • Supports uploading and browsing of images and media using the nice user interface and upload functionality provided by RAD Editor. Folders used are the same as for the other editors used in mojoPortal. We have a decent file browse and upload feature in our other editors but RAD Editor provides it's own dialog page and upload capabilities and it seems very nice to me.
  • mojoPortal defines a fixed set of toolbars Full, Full With Templates, Forum, Forum With Images, Anonymous, and Newsletter. You can configure which RAD Editor toolbar items are available in each of these defined toolbars using xml configuration files included in the mojoRadGlue package.
  • This version of mojoRadGlue Editor Provider does not directly integrate with the mojoPortal Content Template System, however, the RAD Editor has it's own template system that stores templates on disk as .html files, and the mojoRadGlue packages includes templates that match theones included with mojoPortal for using jQuery Tabs, Accordion, etc and you can make and upload your own templates using the RAD Editor template system. Possibly in the future we will make a tighter integration if there is demand for it.
  • Similarly, this version of mojoRadGlue Editor Provider does not directly integrate with the mojoPortal Content Style system. However, the RAD Editor has it's own slick integration that makes basically all the css classes in your CSS available in a dropdown list for use in the Editor. Actually it is a little much, in a future release of mojoRadGlue we will look into limiting it so it isn't so daunting.
  • Includes source code in case you need additional customization

License Agreement

Purchase of mojoRadGlue Editor Provider allows you to use it on a production web site where you have a licensed copy Telerik RAD Controls installed, and you can use it on unlimited developer or testing machines. If you need to use it with more than one license of Telerik RAD Controls then you should purchase one copy of mojoRadGlue for each Telerik license in order to be in compliance with this license agreement. There are no locks of any kind on mojoRadGlue Editor provider software nor is any activation required. By purchasing mojoRadGlue Editor Provider you agree to these terms.

You may customize the source code to meet your needs. You may not redistribute the software in either compiled or source code form to other parties without purchasing a license on their behalf.

You understand that we do not warrant this software for any purpose and you agree to indemnify, hold harmless and defend Source Tree Solutions, LLC from and against any claims or lawsuits, including attorney's fees, that arise as a result from the use of the Software.

You acknowledge that all copies of the Software in any form are the sole property of Source Tree Solutions, LLC. You have no right, title or interest to any such Software or copies thereof except as provided in this Agreement.

Release History

  • Version 0.5 2010-08-16, initial release
  • Version 0.5.1 2011-09-30 compaqtibility update for mojoPortal 2.3.7.0

To use the mojoRadGlue Editor Provider, you first need to purchase a copy of RAD Controls for ASP.NET AJAX from Telerik. It can work on your local machine using a free trial version of RAD Controls, but it won't work on a production site without a valid license from Telerik. The mojoRadGlue Editor provider is just an integration library that makes it easy for you to plug in the RAD Editor. It serves as the glue between mojoPortal and the RAD Editor and allows RAD Editor to plugin to mojoPortal in a similar way as the included editors (TinyMCE ,CKeditor, etc).

Installation Steps

  1. Extract the download for mojoRadGlue Editor Provider
  2. If using .NET 3.5, you need to use files under the net35 folder, if using .NET 4.0 you need the files under net40
  3. Download and extract the manual installation package of Telerik RadControls for ASP.NET AJAX
  4. If using .NET 4 copy the Telerik.Web.UI.dll from the Bin40 folder of the Telerik files into the net40/wwwroot/bin folder in the mojoRadGlue files, or
    if using .NET 3.5, copy the Telerik.Web.UI.dll from the Bin35 folder of the Telerik files into the net35/wwwroot/bin folder in the mojoRadGlue files
  5. Copy the App_Data/RadSpell folder from the Telerik files into the net35/wwwroot/App_Data folder or net40/wwwroot/App_Data folder of the mojoRadGlue files depending on which version of .NET you are using.
  6. Now the files under the mojoRadGlue wwwroot folder are ready to upload to your site. The wwwroot folder corresponds to the root of your web site so upload the contents of that folder (not the folder itself) to the root of your mojoPortal site.
  7. In Web.config you need to add some configuration for RAD Controls, in newer versions of mojoPortal these settings already exist but are commented out, so you just need to un-comment them.
     
     For IIS 6 or IIS 7 with a Classic Application pool, you need to add this to the system.web httpModules section:
     
     <add name="RadUploadModule" type="Telerik.Web.UI.RadUploadHttpModule, Telerik.Web.UI"/>
     
    and you need to add this t the httpHandlers section:
     
     <add verb="*" path="Telerik.RadUploadProgressHandler.ashx" type="Telerik.Web.UI.Upload.RadUploadProgressHandler, Telerik.Web.UI"/>
          <add verb="*" path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler, Telerik.Web.UI, Culture=neutral, PublicKeyToken=121fae78165ba3d4"></add>
          <add verb="*" path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler, Telerik.Web.UI, Culture=neutral, PublicKeyToken=121fae78165ba3d4"></add>

    For IIS 7 Integrated Pipeline Mode, yoy don't need the above but instead need to add this to the system.webServer modules section:
     
     <add name="RadUploadModule" type="Telerik.Web.UI.RadUploadHttpModule, Telerik.Web.UI" preCondition="managedHandler"/>
     
    and you need to add this to the system.WebServer handlers section:
     
     <add name="Telerik.Web.UI.SpellCheckHandler.axd_*" path="Telerik.Web.UI.SpellCheckHandler.axd" verb="*" type="Telerik.Web.UI.SpellCheckHandler, Telerik.Web.UI, Culture=neutral, PublicKeyToken=121fae78165ba3d4" preCondition="integratedMode"/>
    <add name="Telerik.Web.UI.DialogHandler.aspx_*" path="Telerik.Web.UI.DialogHandler.aspx" verb="*" type="Telerik.Web.UI.DialogHandler, Telerik.Web.UI, Culture=neutral, PublicKeyToken=121fae78165ba3d4" preCondition="integratedMode"/>
          <add name="Telerik.RadUploadProgressHandler.ashx_*" path="Telerik.RadUploadProgressHandler.ashx" verb="*" type="Telerik.Web.UI.Upload.RadUploadProgressHandler, Telerik.Web.UI" preCondition="integratedMode"/>
  8. Add this to your user.config file
    <add key="mojoEditorConfigFileName" value="mojoCustomEditor.config"/>
  9. Recycle the application pool by touching Web.config (ie type a space in it and save it) to make it reload settings.
  10. This version of mojoRadGlue was compiled against a specific version of Telerik.Web.UI. When new versions of Telerik are released you will have to configure for assembly binding redirects to the new version or else compile the code yourself against the new version. For instructions see this forum post.
That's it, you should now see TelerikEditor as an option in the list of Editors.

It Works but the Background Colors or Images are applied in the Editor making it ugly and Hard To Use

By default RadEditor applies the CSS from the page to the editor and this is generally a good thing but it can pose problems when the body is styled with background images or colors that should not be used in the editor. There is a way to solve this by making some changes in the theme.skin file of your skin(s).

First add this near the top of the theme.skin file to get a reference to RadEditor:

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

then further down add this:

<telerik:RadEditor runat="server"
ContentAreaMode="Div"
CssClass="wysiwygeditor"

/>

then in your CSS below any CSS that is applying the unwanted background or colors add this:

.wysiwygeditor,
body.wysiwygeditor
{
background-color: white;
background-image: none;
font-size: 12px;
min-width: 100px;
}

That should solve the problem.

Note also that it is possible to configure other properties of the editor from theme.skin. For example newer versions of the RadEditor support a RibbonBar toolbar. So for example you could enable that like this:

<telerik:RadEditor runat="server"
ContentAreaMode="Div"
CssClass="wysiwygeditor"
ToolbarMode="RibbonBar"

/>

but if you set a property that doesn't exist (older versions of RadEditor do not support RibbonBar) it will cause an error.

Note also that there are some xml files in the root of the web site that can be used to configure which items are in the toolbars.