Skip to content

How to Add a New Page to the Tab Menus

  1. Log in to the Evolution manager

Screenshot of the CMS login

  1. Click the right arrow next to HR Resources to open its content and open the HR Resource section you want to add to.  

Screenshot of the home screen once logged in

 

The folders inside each HR Resource section represent the tab headings of the menu.

screenshot of the site tree with outlined pages

screenshot of corresponding tab menus on HROE site

  1. Duplicate a page in the desired section by right clicking on the name of an already existing page and selecting "Duplicate Resource." Click ok in the popup box that appears. A duplicate page is now created.

screenshot of menu options, Duplicate Resource is highlighted

Note: Do not duplicate a folder or it will also duplicate all the contents of the folder.

  1. Click the green "Edit" button on the top right, or right click the new page in the menu and select "Edit Resource." The following edit screen will appear.

screenshot of page in editing mode

  1. How to Edit Various Fields
  1. Updating the Title

Change the title of your page in the first Title field. Upon saving, a URL alias will be automatically created based on this title.

  1. Updating Text Content

Scroll down to the section labeled Template Variables. Open the last content block by clicking the blue plus icon on the left side.

screenshot of content on page of cms editor

Delete old content by clicking the minus symbol on each row. Once you have deleted all the old rows, you can now begin to add in your content.

screenshot of content section, highlighting an icon

Create more readable and accessible text content by styling your text. Highlight your text and select a style from the dropdown menu labeled "Paragraph." All Header styles also should be bolded.

About Header Styles

For accessibility purposes, header levels may not be skipped. This means you can not use a "Header 2" if you have not already used a "Header 1," and you can not use a "Header 3" if you have not already used a "Header 2." In addition, you can only use a "Header 1" style once on the page for the title.

screenshot of text being styled

  1. Adding Images

Click the Image icon in the toolbar.

screenshot highlighting the add image icon

The "Insert/Edit Image" box will appear. Click the button that looks like a folder with a magnifying glass to the right of the "Source" field.

screenshot highlighting the find image button

The KC Image Finder will appear.

screenshot of kc image finder

In this window, you can:

  • Add a picture onto your page by double clicking the picture's name (in list view) or clicking the plus icon beneath the thumbnail (in grid view)
  • Upload a new picture into your desired folder by navigating to the folder and clicking the green "Upload" button.
  • Create a new folder by right clicking on the name of an existing folder and selecting "Create new subfolder."

Once you have selected a picture, you can now add the alternative text in the "Image Description" field. When you are finished, click ok.

screenshot of alt text being added

About Alt Text

Alternative text is a short written description that describes the appearance and function of an image on a webpage. It is necessary for anyone who uses a screen reading device, and it is also used when images fail to load properly and for search engines to return better results.

When to Add Alt Text

Images that provide information and are relevant to the rest of the page content should always have alternative text. Decorative images are images that don't provide any meaningful information, and should not have alternative text. An example of a decorative image would be branding graphics used to divide a page.

Null Text

Decorative images should still contain an HTML alt tag, but it should be left empty. This is so screen readers can skip over them without error. To confirm your decorative image is correct, open the source code editor by clicking the two arrows icon in the toolbar.

screenshot of content toolbar, icon being highlighted

If you have an alt tag in your image with two quote marks, this is correct.

screenshot of source code

  1. Save and Publish

Once you have finished editing your content, click the green "Save" button in the top right hand corner. In the left side menu, right click your page and select "Publish Resource."

  1. If you want to make a new dropdown heading in the tab menu, create a new page in the same HR Resource section you want to add a new dropdown to as outlined through steps 1-6, then proceed with the following.

Right click on the HR Resource section you wish to add a new dropdown menu to, then select "Create Weblink Here."

screenshot of editor with right click options shown

Name the new weblink and click save. It will now show in the site tree.

screenshot of cms site tree with new weblink highlighted

Move the page you created into the new weblink by right clicking and selecting "Move Resource." Then click the new weblink in the site tree, and click save in the top right corner.

screenshot of the move screen

After moving the page into the weblink, the weblink will change to a folder icon. Edit the weblink again and change the ID to the ID of the resource that you just moved into it.

screenshot showing new id of weblink

After publishing both the new page and the weblink, you will now have a new dropdown section.

screenshot of website with new dropdown menu added