Using the Editor in EUM

|
Published

EUM uses Froala editor in EUM Admin, EUM Portal, and CMS to allow easy HTML Editor with the best features. The editor is present in multiple sections of EUM:

EUM Admin:

  1. Group Join Page - while creating or editing a Public or Private Group
    1. Join Page Rollup
    2. Join Page Content
  2. Group Member Page - while creating or editing any group with a Auto Generated Member Page
  3. Email Template - while while creating or editing an Email Template

EUM Portal - while writing contents for creating or editing a page.

EUM CMS - while writing contents for creating or editing a page.

This article will help understanding some important features of the Froala editor EUM uses.

Froala Editor 1.JPG

There are a few extra buttons in the EUM Portal Froala editor.

Froala Editor 4.JPG

Add Link

To add a link in a sentence, as shown in the screenshot

  1. Please point the cursor where link has to be added
  2. Click the Add Link button
  3. Fill in the form
  4. Click Insert

Froala Editor 2.JPG

Note: If the form does display in full, please close it, please enable the Maximize Editor

Add Image

To add an image, click the Image icon

Froala Editor 3a.JPG

An image can be added using the form in a few ways:

Froala Editor 3b.JPG

  1. Drag and drop the image
  2. Add the Image URL. The image should be available to access freely
  3. Browse to the folder in your SharePoint for images already present

Add Video

To add a video, click the Video icon. A video can be added in a few ways:

Froala Editor 3c.JPG

  1. Drag and drop an video
  2. Embed the video by putting in the embed code
  3. Insert the video URL. The video should be available tp access freely

Maximize Editor

Click the Maximize editor button to maximize the editor, so that the entire browser space is taken over by the editor. Click the Minimize button to minimize the editor to its original size in EUM.

Froala Editor 3d.JPG

Code View

Click the Code View button to be able to write HTML codes in the editor. Click the Code View button again to come back to the normal view.

Froala Editor 3e.JPG

Insert Code Snippet

Without needing to write a code, the following items can be added to a EUM Portal page by inserting a code snippet.

  1. Events Rollup:
    1. All Past Events
    2. Past Six Events
    3. Upcoming Events
  2. Articles Rollup
  3. News Rollup
  4. Publications Rollup
  5. Data Portal Reports Page
  6. Data Portal Reports Rollup
  7. Data Portal Reports Rollup filtered by Report Type
  8. Member Directory
  9. Join Group Button
  10. Primary Button
  11. Secondary Button
  12. Three Columns Grid for Layout

To add one of these snippets, please click the Insert Code Snippet button, and select the snippet you want to add from the list.

Froala Editor 4a.JPG

Insert Media from Media Library

Use this button to add Images or Documents used recently, or searching from the site library, or uploading a new one.

Recent Media

Upon clicking Insert Media button, a popup window will open.

  1. Select Recent Media from the left hand menu
  2. Select among Images or Documents to see the recent Images or Documents to choose from
  3. Select the image or document you want to insert
  4. The Media Metadata will populate with the details
  5. Select the size
  6. Click Insert Media

Froala Editor 5a.JPG

Site Search

Upon clicking Insert Media button, a popup window will open.

  1. Select Site Search from the left hand menu
  2. Type in the image or Document name and click enter
  3. Select the image or document you want to insert
  4. The Media Metadata will populate with the details
  5. Select the size
  6. Click Insert Media

Froala Editor 5b.JPG

Upload

Upon clicking Insert Media button, a popup window will open.

  1. Select Upload from the left hand menu
  2. Drag and Drop the image/document to be uploaded
  3. Fill in the image/document details in the Metadata
  4. Select the size
  5. Click Insert Media

Froala Editor 5c.JPG