Adding Media | CMS Knowledge Base

Images help support page content and provide visual context for users. They are commonly used to highlight key information or accompany text.

Images should always be added within a Content Box to maintain proper spacing, contrast, and accessibility.

Step by Step Instructions: Adding Photos

1. Before you begin, add a Content Box as your base background.
2. Insert an Image
   • In the WYSIWYG editor, click the Image icon.
3. Select the Image Source
   • Click the Source icon (arrow pointing up) in the top-right corner of the image window.
4. Upload or locate the image
   • Locate the image in the images folder, or click Upload to add a new image.
5. Name the uploaded image correctly
   • File names must be:
     • All lowercase
     • No spaces
     • No special characters
     • Use hyphens if needed
   • Keep the file extension (.jpg, .png, etc.).
6. Resize the image
   • If needed, click Edit Image and resize the image to match the layout where it will appear.
   • Image may need to be published separately if changes do not apply. 
7. Insert the image
   • Click Save, then click Insert to place the image on the page.
8. Add accessibility information
   • Enter alternative text (alt text) describing the image.
   • Add a descriptive image title (remove auto-generated camera file names).
9. Preview the page
   • Review the image placement and size in the Preview tab.
10. Publish the page
    • When you are finished editing, click Publish to push your changes live
      (or submit for approval, if required).

Note: 

• Images should always be placed inside a Content Box.
• Resize images to less than 850 px wide before uploading when possible.
• Preview the page to confirm the image fits cleanly without stretching.

Documents allow users to download or view additional information, such as forms, guides, or PDFs. They are commonly used to share detailed or printable content.

Documents should be added within a Content Box and linked using clear, descriptive text to support accessibility.

Step by Step Instructions: Linking Documents

1. Find and highlight the text you want to link
   • Select the word or phrase that will link to the document.
2. In the WYSIWYG editor, click the link icon. 
3. Upload a document
   • Click the white Upload button in the top-right corner.
   • Select Upload Files as the upload type.
   • Click the blue Add button and select your file.
4. Publish the document
   • Publish the document (three clicks).
5. Use the document on a page
   • Once published, the document is available to be linked on pages.

Videos provide an interactive way to share information and enhance page content. They are commonly used to explain topics, highlight events, or present instructional material.

Videos should be added within a Content Box and follow accessibility guidelines, including captions or transcripts when required.

Step by Step Instructions: Adding Videos

1. Copy the embed code
   • From YouTube, copy the Embed code for the video.
   • All videos will need to be posted to YouTube before being put on the web. Videos cannot be uploaded to the CMS. 
2. Navigate to the content area
   • Go to the Edit tab and place your cursor in the desired content region.
3. Insert media
   • Click the Insert/edit media icon in the WYSIWYG toolbar.
4. Paste the embed code
   • Select Embed and paste the YouTube embed code.
5. Add a title attribute (required for accessibility)
   
   • Inside the embed code, add a title attribute that describes the video. If you skip this step, an accessibility error will pop up when publishing. 
   • Example: <iframe title="title describing video" src="www.example.com" width="100" height="100" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
6. Save the media
   • Click Save to insert the video.
7. Preview the page
   • Review the video placement in the Preview tab.
8. Publish the page
   • Click Publish to push your changes live.