More Tips and Tricks using the Contentr Page Editor

Below is a screen shot of the button bar from the page editor in contentr setup.  This is a widely used, publicly available plugin called "TinyMCE".  You can find their website for more info. 


uploaded image

About the Menu bar:  Hovering over the icons in the editor will display their function.   The Image upload icon is next to last and looks like an image, and allows you to select and insert images to your Contentr page.  These are similar to the usual icons found in your word processor. 

There is a "Preview" link above the contentr editing area.  There is also an "Expand" icon next to the "X" (close) icon.  You can Preview your page, and also Expand the editing area.

The very last icon is Source Code view  This allows a more advanced user to review and edit the actual html being generated by the editor.  You can insert or add html.

Code View:

  • another way to modify width of image  (In general you should only modify Width, not Height.  Height will automatically adjust with browser window changes size.
  • add more styling to paragraphs or other elements with the style attribute - <p style="width: 100%;">
  • delete extra empty paragraph tags generated by the editor, or copy and paste more paragraphs. This is one way to modify spacing on your page. The extra paragraphs look like this -

Other menu buttons:

  • change font, font-size, color
  • create Headers ( h1, h2, etc)
  • format your page to Right justify, Left justify, or Center text. Change font size and color, insert Headers
  • create Ordered (with numbers) and Unordered list (like the list we are are in here)
  • insert Tables
  • select an inserted Image, then use menu icons to size and align the image.
  • use the Link icon to insert or edit links to web pages or websites.  Create friendly display text for the Link.