Using The Html Content Module

Most content in a site is edited using a HTML WYSIWYG (What You See is What You Get) Editor. mojoPortal content management system comes with TinyMCE, CKeditor and FCKeditor. Using the editor is pretty much like using a Word Processor and should be fairly easy for most users. You can try it yourself using the online demos, or watch these videos 

Feature Settings

The HTML Content Module has several settings which allow you to efficiently manage your content. The settings are organized in groups to make finding individual options easier.

Miscellaneous

  • Custom CSS Class is an advanced setting which allows one to specify a CSS class to the module instance. The rules for the CSS Class must be applied in the Site Skin.
  • Editor Height controls the height of the HTML WYSIWYG editor.
  • Include swfobject script for flash enables the inclusion of swfobject, which is a script that assists the loading of Flash movies.

Content Versioning

  • Keep Version History, keeps a history of every change to the content and allows previous versions to be restored. If version tracking is enabled by the administrator at the site level then unchecking this will not turn off version history.
  • Version History Page Size controls the number of versions to include in a single "page" of the version history.

Slide Show Settings

  • Enable Slideshow of Elements, creates a slideshow from the first level elements in the content. The type of element doesn't matter, it could be a p, a div, an img or anything else as long as it is an immediate child of the content.
  • Slide Container Height, by default with the container height set to 0, the slideshow will try to automatically size the container beased on the height of the content elements. You can optionally specify a setting for the container height and it will use that.
  • Slide Transition Effects, sets the effects used to transition the slides. A single effect or a comma separated list can be specified. Possible values include: fade, curtainX, curtainY, scrollUp, scrollDown, scrollRight, scrollLeft, slideX, slideY, turnUp, turnDown, turnRight, turnLeft, zoom, pinch, shuffle.
  • CSS Class for Slide Container div, allows some content to be in a slideshow and other content to not. By default, when this setting is blank, all HTML elements in the content are treated as slides in the slideshow. To use this setting, the content which should be converted to a slideshow must be wrapped in a DIV with a special class. For example:
       <div class="myslides">This will be in a slideshow</div>
    The class "myslides" (without quotes) will be used as the value for this setting. One could even have multiple slideshows with static content between them by creating multiple divs with the same class.
  • Randomize slide sequence, shows the slides in random order.
  • Use extra clear type correction in slides, Generally should be enabled so all clear type corrections can be used to smooth the contents of the slides. However depending on skin design, sometimes the page background color will be shown as the slide background color in Internet Explorer when this is enabled. In this case setting this to false will disable the extra corrections and eliminate the background color. However, clear type corrections may be slightly noticeable as the text may look a little grainy for a second before it is corrected by the main clear type corrections.
  • Pause Slideshow on Hover, causes the slideshow to pause when the mouse is placed over the content area.
  • Slide Duration In Milliseconds, amount of time between slide transitions (0 disables auto advance).
  • Slide Transition Speed, amount of time the transitions take to complete.
  • Enable Slideshow Pager, renders a pager element for the slides in the slideshow.
  • Place Pager above Slideshow, renders the pager element above the slideshow.

Note: Links you place within the elements of a slide show will not be clickable. You can work around this by adding some JavaScript code to your links as follows:

onclick="window.open(this.href,'_self');return false; "

Social Settings

  • Enable Content Rating, when enabled the content rating stars will be visible with the content.
  • Enable Rating Comments, when enabled the rating comments box will be visible with the content.
  • Show Facebook Like button, when enabled will show a Facebook Like button on the page. The "Like" button uses the current page url so if more than 1 HTML content feature is on a page, the user just "liking" the page, not an individual content item.
  • Facebook Like Button Theme, choice of light or dark theme for the Facebook Like button.
  • Facebook Like Button Show Faces, when enabled the "avatar" of the people who clicked the "like" button will be shown. The height of the Facebook like button may need to be adjusted to make room for the faces to show.
  • Facebook Like Button Width controls the width of the button.
  • Facebook Like Button Height controls the height of the button.

Updated: 2009-11-21 -- Joe Davis of i7MEDIA, Your source for elegant mojoPortal solutions.
Updated: 2010-11-24 -- Joe Davis
Updated: 2010-12-06 -- Jamie Eubanks
Updated: 2011-04-29 -- Joe Davis