HTML Editor Block

The HTML Block is the workhorse of the CMS, and it is probably the one you will use the most.  It is also the most flexible since it allows you to display and mix different content (e.g., text, tables, images, embedded videos).

The HTML Block uses the same HTML editor you find when creating or editing a CMS page.

Create or edit your HTML content

To create or edit an HTML Block got to the CMS utility bar and click on Blocks -> HTML Editor.  It will open a dialog like this:

 Define the parameters for your block

  1. Name your Search Results block.  We recommend being descriptive.
  2. Select the CMS region where you want your content to appear.
  3. Give your block a Title (optional)
  4. Enter your main content in the HTML editor and format using the different options, using the icon buttons on the top of the rich text area, such as:
    • Source: Provides source code editing in the source editing area that replaces the WYSIWYG view within the editor interface.  Please read our friendly warning below about using the Source.
    • Cut & Paste buttons: includes paste from Word, which we strongly recommend using if you are indeed pasting from Microsoft Word.
    • Undo or redo buttons
    • Find
    • Replace
    • Select All
    • Remove Format: clear all formatting.  Useful the formatting has gotten wonky, and you want to start again without deleting the text itself.
    • Hyperlinks: Can be used on text and images.
      • Link: create a text that links to another page.
      • Unlink: remove a link.
    • Anchor: links within the same HTML editor content.
    • Image: insert an image using the image gallery.
    • Table: add a table and set basic table properties, such as:
      • Number of rows and columns.
      • Table width and height.
      • Cell padding and spacing.
      • Table headers setting.
      • Table border size.
      • Table alignment on the page.
      • Table caption and summary.
    • Horizontal line
    • Smiley
    • Font styles...
      • Bold
      • Italics
      • Underline
      • Strikethrough
    • Lists...
      • Numbered list
      • Bulleted list
    • Increase Indent
    • Decrease Indent
    • Text alignment...
      • Left
      • Right
      • Center
      • Justified
    • Styles: drop-down of selected styles. Use sparingly.
    • Paragraph formats: drop-down of normal text and headers.  We strongly encourage that you use these instead of trying to custom format your content.  It will give your site consistency and make it more compatible across browsers, and perform better in search engine optimization.
    • Font: use sparingly.  We recommend using the Paragraph formats instead.
    • Font size: use sparingly.  We recommend using the Paragraph formats instead.
    • Font color: use sparingly.  We recommend using the Paragraph formats instead.
    • Background color: use sparingly.  We recommend using the Paragraph formats instead
  5.  Use the advanced settings to specify which page(s) you want the block to appear on, and in what order relative to other blocks or content on the page.

Our two cents...

You can see above that you have myriad of options to format your content.  Having said this, your website is designed with default styles that are meant to give it consistency and your users a better experience, as well as make the page more compatible with different browsers and devices.  We discourage from getting creative with all the options above and instead let the sitewide styles do their job.

The formatting options from the list above you use should be limited, to the extent possible, to:

  • Font Styles (not Styles)
  • Lists
  • Text Alignment
  • Paragraph Formats

The HTML Editor is not a Word Document

Remember that the HTML Editor is not a Microsoft Word document.  If anything, it is a very primitive, extremely limited, and somewhat clunky version of it.  If you have worked with any CMS (e.g., Wordpress, Drupal) you probably know this already.  

The magic you can do in Word is probably not possible with HTML Editor unless you have some mad web page development skills.

Please be careful with using the HTML Editor

The HTML Editor when used in Source mode it allows you add custom HTML, as well as CSS and even more advanced web page elements.   

Note that we only support the HTML Editor when used in non-Source mode.  Any changes you make or code you add via the Source feature is at your risk.  It is possible to break the CMS or your page/site if you add improper, malicious or poorly formatted code.   If our team needs to fix it, we may charge for the work.

When using the Source feature we expect you to have a solid understanding of HTML, CSS, Javascript and any other technology you are using.  

We explicitly prohibit inserting dangerous or malicious code. 

Remember that with great power comes great responsibility!  If your spidey senses are saying that you do not really understand that code you are adding or its impact, please do not add it.

0 Comments

Add your comment

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.