Editing Content

Introduction

Modern Campus CMS has an embedded WYSIWYG (What You See Is What You Get) Editor, which is exactly what it sounds like.  Much like Microsoft Word, this editor uses familiar icons to make immediate edits.  It even allows you to use your usual keyboard shortcuts.

Image of WYSIWYG editor options

WYSIWYG = Edit Mode

  • Go to your webpage and log in using the copyright link at the bottom.
  • Click the green Edit button within the page. This will put you into Edit Mode.
  • Use the WYSIWYG Editor to make your edits.
  • Click SAVE when you are finished making edits.

Use Headers for Accessibility

When creating the content for your website, be sure to use headers to sequentially organize the content on the page.  Headers play an important role in web accessibility and are used by assistive technology to assist with navigating the page.  Do NOT use headings to change the font size or for styling purposes. 

Note:  Headers are ranked <h1> through <h6>.  Because each page has an <h1> for the title, you should start page headings with <h2>.  For a detailed explanation of the role headers play in accessibility and some examples see the w3 page. 

Sometimes you’ll need to add a (hyper)link redirecting users to a page on your site, an external web page or a an uploaded file.  This can be accomplished in the WYSIWYG Editor.

  • In Edit Mode, highlight the text you wish to make into a clickable link.
  • Click the Link icon.

Link to an External Web Page

  • Enter the URL (web address).
  • Click save

Note: Links from email contain additional code that can cause the link to break. Always be sure to use clean link by pasting, or opening, the link into your browser and copy the URL from the browser address bar.

Link to a Page in Your Site

  • Click the arrow next to the URL box.
  • Navigate to the page and click on it.
  • Click
  • Click save

 Linking a document

  • Clink on the link icon in the WYSIWYG editor
  • Click on the choose source button
  • Navigate to the folder in which you would like to upload to/insert from

Note: If the file has been used before then it can be selected at this point and inserted.

  • Click the UPLOAD
  • Click +ADD.
  • Navigate through your files and select the file to upload.
  • Click START UPLOAD.
  • Once the file is uploaded, click insert
  • Choose whether to open the link in the current window or a new window
  • Click save

Note: Documents will generally not load correctly from within the CMS view if added directly into a page without being separately published first, to check whether or not the document has loaded appropriately, publish the page and then use the Preview function to check the document link.

Adding an Image in the WYSIWYG Editor

Images are a great way to add interest to your webpage, clarify directions and break up the page, making it easier to absorb.

Note: for photographs, files the file type should generally be .jpg or .jpeg, for artwork it should be .png

  • In Edit Mode click in the box where you would like to place the image.
  • Click the Image icon in the toolbar.
  • Click the arrow next to Source.
  • Navigate to the folder in which you would like to upload to/insert from

Note: If the image has been uploaded and published before at this point it can be chosen and inserted.

  • Click the UPLOAD
  • Leave Access Group as (Inherit Existing).
  • Click +ADD.
  • Click START UPLOAD.
    • Click INSERT.
  • Add an Alternative description. This will become the alt text and aid visually impaired users using screen readers.   
    • If it is a decorative image, click in the decorative image box.
  • Click Save.

Note:If an image has been uploaded for the first time it will not display properly until the page is published

Adding a Video in the WYSIWYG Editor

Videos are a great tool to add interest, give instruction, offer a tour, provide a greeting and much more. 

  • Upload or find the video on youtube or vimeo
    • Ensure videos are captioned
  • Copy the embed code from the site where the video is located – (copy the URL)
  • In Edit Mode click in the box where you would like to place the video.
  • Click the Insert/Edit Media button on the toolbar
  • Select the embed option
  • Paste your copied embed code into the provided box and click save