Welcome, Guest Login
Higher Logic User Group Site Higher Logic User Group Site Higher Logic Support Center

Support and Documentation

HTML Editor (WYSIWYG) Tool

Last Updated: Jan 17, 2017 10:25AM EST

HTML editors, commonly known as WYSIWYGs (what you see is what you get) are a primary tool for adding and editing HTML content. There are a number of versions of HTML Editor with differing tool bar options.

Editor Update

Higher Logic is undergoing an update of the HTML editors.  This update will be completed in 2016.  Older Telerik Rad editors are being phased out and replaced with TinyMCE editors.  Further, some simple text input fields will be augmented with a small but powerful version of the TinyMCE editor. 

Elements of Telerik HTML Editors

See the image below the list to match the area to the letter indicated

A) Compliant Editor Link

A separate toolbar designed to provide a better experience to those with visual impairments is accessed through this link. It intends to support screen-readers and other assistive browser programs.

B) Tool Bar

The tools and selectors on the tool bars present options to the users.  The name of tool and operation supported appear on mouse-over.

C Editing Window

The editing window displays the HTML content being edited/created.  It supports two views of the HTML content depending on whether "Design" or "HTML" tab is selected.  The Design Tab displays a version of the content as it will be seen by users.  The HTML tab displays the raw HTML code. The default selection is the Design tab.

D) Design Tab

The Design Tab offers a "close but not exact" version of the HTML content being edited. Such aspects as CSS style and width may not be accurately portrayed here. Use of the buttons and typing in the window allows for the visual creation of HTML content.

E) HTML Tab

The HTML Tab allows for direct coding and exposes the HTML code created when editing through the Design Tab. The inclusion of external embed codes is performed through copy/paste with this tab. The HTML tab does not appear on all HTML Editors.  It can be disabled for the HTML Editor versions associated with Blogs, Events and Community HTML by addition of the DisableHTMLTab="True" Parameter as described below.

F) Preview Tab

The Preview Tab offers a full-page preview of the content being created. It is rarely valuable.

 

TinyMCE Editors - Key Differences

The design and functionality of the Telerik editors is very similar to the updated TinyMCE editors. Reasons for the change include enhanced usability and accessibility and more robust file uploading through FileStack.  Key differences between the editors include the following:

  • No HTML tab - when offered, the access point for direct HTML coding is an HTML button in the toolbar.    
  • No "reader compliant" version - the native accessibility of the TinyMCE editor is robust.  
  • Spell check removed - spelling help native to the browser is largely redundant to spell checking functionality within the editor. Browser spell check
  • Paste - multiple paste buttons are gone.  The primary paste button has been tested for similarity when pasting from Microsoft documents - the experience is largely identical.  Paste as plain text is offered under the "Edit" menu. 
  • More robust formatting - blocks can be added and managed.  Images are automatically placed in a responsive CSS class for better mobile experiences. 
  • Better file uploading and management - drag and drop file upload is supported through FileStack.

Pages Using HTML Editors

The following pages and User Controls allow users to access an HTML Editor. A number of them are generally limited to Admins:

 

Webpage Updated to TinyMCE Control Tool Bar
Configurable?

Enter/Edit Content Page

(editing HTML Content Items)

no n/a no

Create/Edit Events Page

no cm:EventAddEdit; AddEventButton.ascx yes
Event Option/Session Edit yes UI\Community\RegistrationOptionSessionAddEdit.ascx no

Create New Blog

(Blog Editor)

no ds:EditBlog yes
Community HTML yes ds:CommunityHtml yes

Post a Message

(new Discussion posts)

yes eg:PostMessage no
Glossary Edit yes wg:ViewGlossarySetup no
Email Templates
(system generated discussion messages - CCAdmin)
no n/a no
Add/Edit Template
(system generated non-Discussion messages - CCAdmin)
yes UI\Campaign\MessageTemplateEdit.ascx no
Library Entry Descriptions
(HTML editing supported with UseHtmlEditor="True" parameter)
yes rl:AddEntryDescription no
Library Entry Comments
 
yes rl:EntryComments no
Blog/Glossary Comments yes hlcommon:ItemCommentList no
Volunteer Opportunity Create/Edit yes Directory:VolunteerAdmin:VolunteerOpportunityCreate no
Moderation - Reject yes UI\eGroups\ModerationQueue.ascx  no
Announcement yes ws:Announcements no

 

Configuring HTML Editors

Super Admins may wish to limit the functionality available to their users when creating Blogs, Event Descriptions, or Community HTML.  For this reason the HTML Editors associated with Blogs, Events, and Community Landing Pages can be configured to limit the tools in the toolbar and not allow HTML code to be directly modified. See the

 

The following Parameters apply to cm:EventAddEdit, ds:EditBlog, and ds:CommunityHtml

EditorMode="Slim"

Restricts some text formatting and does not allow tables. Except for images it does not allow external content to be added.

EditorMode="Full"

Allows freedom over text editing and tables but does not allow multimedia to be added.

EditorMode="Standard"

Allows all editing tools as seen when editing HTML Content Items.

DisableHTMLTab="True"

Disables the HTML Tab and thereby prevents code from being modified directly.

 

Image Manager

The Image Manager in the HTML Editor accepts the following file extensions:
avi
bmp
doc

docx
gif
gz
htm

html
ico
jpe
jpeg
jpg
js
m3u
mid
midi
mkv
mp3
mp4
mpeg
mpg
ogg
pdf
pjpeg

png
ppt
pptx
rtf
snd
txt
wav
webm
wma
wmv
wpd
wri
xls
xlsx
zip
 

support@higherlogic.com
http://assets3.desk.com/
false
higherlogic
Loading
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
about
false
Invalid characters found
/customer/en/portal/articles/autocomplete