Pages


CivicEngage
®

Editor Widget

Overview

CivicPlus now has two editors available to use: Legacy Editor and Editor. The Editor is our new editor that has been released and the Legacy Editor is our older version available for existing content.

Best Practice

It is recommended to use the Editor widget instead of the Legacy Editor. This is because the Editor widget has more ADA tools, is responsive (including tables), and includes additional tools and features that were not available in the Legacy Editor, such as font options and full screen mode.

Font Options

The Editor has the option to expand the font options that are available to you. This includes more font types, sizes, and colors to be available in the dropdown. To turn this feature on, please view our Enable Font Options article.

Editor Features

  • Fullscreen: Expand your editing window to be your whole screen. This feature is not available in Legacy Editor.
  • Bold: This option allows you to bold text.
  • Italics: This option allows you to italicize your text.
  • Underline: This option allows you to underline your text.
  • Strikethrough: This option allows you to show your text as stricken through.
  • Subscript: This option allows you to have text smaller than your normal text and aligned to the bottom, similar to a sub-text.
  • Superscript: This option allows you to have text smaller than your normal text and aligned to the top, similar to saying "x squared".
  • Block Quote: This option allows to you to align a block of your text differently than other text while calling it out.
  • Quote: This option is like block quote but wraps the text in a q tag, which inserts quotation marks and informs screen readers and other devices that the content is a quote.
  • Abbreviation: This is an ADA option that informs the screen reader that there is an abbreviation. This enhances comprehension of the text for the end-user. This feature is not available in Legacy Editor.
  • Language: This is an ADA option that can be used to tell screen readers if specific text is a different language - this enhances comprehension and translation for the end-user. This feature is not available in Legacy Editor.
  • Align: This option allows you to center, left, right, or justify your text alignment.
  • Increase Indent: This option allows you to increase the indentation of text.
  • Decrease Indent: This option allows you to decrease the indentation of text.
  • Bullet List: This option allows you to add bulleted lists to your content area. You can either select existing text to make a bulleted list or you can start a new line and begin a new bulleted list.
  • Numbered List: This option allows you to add numbered lists to your content area. You can either select existing text to make a numbered list or you can start a new line and begin a new numbered list.
  • Image: This option allows you to insert images into your content. This will also provide you the opportunity to wrap text around images.
  • Slideshow Manager: This option allows you to insert slideshows into your content area. This will also provide you the opportunity to wrap text around images.
  • Insert Document Link: This option opens up the Document Center for you so that you can select a document to link to.
  • Table: This option allows you to insert a table into your content area. This option is also available in the Legacy Editor but it is not responsive, in the Editor it is responsive.
  • Insert Link: This option allows you to add any link to the page.
  • CSS Class: This option allows you to select a style that is made for your site, such as Headline, Subhead1, Subhead2, etc.
  • Undo: This option allows you to undo recent changes. The undo option will only go back to the most recently saved.
  • Redo: This option allows you to redo recent changes. The redo option will only recognize your active edits, as soon as the page is saved it will not be available.
  • Clear Formatting: This option provides you a quick way to remove any extra formatting on your page. This is helpful if you paste content onto the site and it does not appear correctly.
  • Special Characters: This option allows you to insert special characters onto your page.
  • Select All: This option allows you to quickly and easily select all content that is in the editor.
  • Code View: This option gives you the opportunity to work in the HTML side of the editor. With this, you can add custom styles, colors, or other coding.
    • Note: The code is color coded to best assist in keeping track of action items.

Note: The Editor automatically removes inappropriate code from the system so that it does not contradict. If you would like custom coding that the Editor does not allow, please consider using the Custom HTML widget.

Short Cuts

  • Ctrl + Shift + Enter: Doing this will allow you to type directly below a paragraph of text with no space between.
  • Ctrl + K: Shortcut to insert a link
  • Ctrl + V: Paste
  • Ctrl + C: Copy
  • Ctrl + X: Cut
  • Ctrl + Z: Undo
  • Ctrl + Shift + V: Plain Paste
    • Note: Not all browsers will allow this
  • Ctrl + B: Bold
  • Ctrl + I: Italics
  • Ctrl + U: Underline
  • Ctrl + S: Strikethrough
  • Ctrl + ]: Increase Indent
  • Ctrl + [: Decrease Indent
  • The Editor is designed to recognize rich formatting being pasted and will alert the user with a pop up message asking if they would like to clear formatting before pasting
    • Note: If pop-ups are disabled, the message will not be seen

Tags

  • The Legacy Editor did not use P tags, however, P tags are the inherent functionality that comes with most editors so the Editor does utilize P tags.
  • P and Header tags are the proper semantic tags to use in the cases of the Editor and provide some value for SEO and Accessibility
?



I'd Like to Request an Enhancement

1 out of 2 found this helpful

Updated:
Follow