Presence Help Cards
Add a Subpage
Navigate to the page where you wish to add a new subpage.
Hover over the + Page drop down, in the top toolbar.
Click on Content Space Page. The Content Space Page is the most commonly used page type, when added a content portlet is already on the page. You can always add any other type of portlet to this page.
Enter the page Title. (Try to limit the page title to three words.)
In most cases, do not change the other options in this area.
Click Create Page.
Add a Portlet
Navigate to the page you want to edit.
In the top toolbar, click the toggle dot to turn Design Mode On.
Click on the portlet category. (Basic, Collaboration, Content Management, and so on)
Click and hold the left mouse button on the portlet you want to select.
Drag the selected portlet to the region (dotted outlines) you want to place the portlet.
Release the left mouse button to place the portlet in the Drop Here area. (Note: Drop here appears under the cursor.)
Edit the portlet settings if applicable. To edit a portlet, see “Edit a Portlet” help card.
In the top toolbar, click the toggle button to turn Design Mode Off.
Edit a Portlet
Navigate to the page you want to edit.
In the top toolbar, click the toggle dot to turn Design Mode On. Most portlets are edited by clicking the Edit/ Pencil button in the upper right corner of the portlet header.
Content portlets have two editors to choose from. Access the popular Inline editor by clicking on the blue pencil icon that appears when you hover over the white area where text is located. The second options is the CMS editor, access this by clicking on the pencil (sometimes displayed as the word “Edit”) located on the right side of the portlet header.
Some portlets, like the Document Container, Photo Gallery, and Calendars, do not have edit mode. These can be updated by any user with Author permissions or above.
Edit the portlet settings as necessary.
Click on the action button normally found at the top or bottom of the page. Depending on the portlet, it may say, Update Settings, Update Image Order, Save, or Publish.
In the top toolbar, click the green button to turn Design Mode Off.
Copy and Paste Text
Navigate to the page you want to edit.
In the top toolbar, click the toggle dot to turn Design Mode On.
Find the Content portlet on the page you want to edit, then click on the blue pencil Edit icon for Inline editing.
Select the text from Word, Google Doc, another webpage, or elsewhere.
Copy the desired text.
Navigate back to the website tab in your browser. Make sure the cursor is located in the content area where you want to add the text, then click on the Paste Plain Text icon in the editing toolbar.
Once you complete your editing be sure to Save or Publish. If you do not choose one of these options, your changes will not be added to the webpage.
In the top toolbar, click the green button click to turn Design Mode Off.
Note: Paste Plain Text icon is used to help ensure the text is readable by a screen reader and conforms to the overall website design and style.
Add an Image
Navigate to the page you want to edit.
In the top toolbar, click the toggle dot to turn Design Mode On. Find the Content portlet on the page you want to edit, then click on the blue pencil Edit icon for Inline editing.
Place cursor where you want to insert the image.
Click the Image Manager icon.
Locate image or add image to the correct file folder, then click on the image file name.
Click Properties.
Width: Do not use whole numbers instead use a percentage between 40-100%. By including the percent symbol you are making your image mobile responsive, and your image thereby always take up X% of your content column.
Height: The field automatically fills in.
Alt Text: Add contextual description of the image which explains to an individual without site, why the image is on the page. Try to keep it less than 125 characters. (What words would you use if you couldn’t use the image?)
Long Description: Leave the field blank as it is not supported by HTML 5. Note: information is required for complex images such as graphs, charts, and infographics. Place the long description on the same page as the graphic, or hyperlink the image to a page with the long description and use the alt text to state long description location.
Click the Image Alignment icon and use the drop down to control the image placement; to the left, right, top, center, or bottom of the page.
Margin: Enter a pixel number in each box to place space around your image. (Margins between 5 - 8 pixels usually work well.)
CSS Class: Do not change the dropdown.
Click Insert.
Once you complete your editing be sure to Save or Publish. If you do not choose one of these steps, your changes will not be added to the webpage.
In the top toolbar, click the green button to turn Design Mode Off.
Add a Document Link
Navigate to the page you want to edit.
In the top toolbar, click the toggle dot to turn Design Mode On.
Find the Content portlet on the page you want to edit, then click on the blue pencil Edit icon for Inline editing.
Place cursor where you want a document link or use your mouse to highlight existing text that you want to transform into a document link.
Click the Document Manager icon.
Locate file or add file to the correct file folder, then click on the file name.
Link Text is the information the viewer clicks on to access the document.
The document file name is defaulted as the link text, but this field can be edited.
Text that was highlighted prior to clicking Document Manager (if any was highlighted) will become the link text.
Link text should avoid words like “Click here,” “here,” or “read more.”
Document hyperlinks should indicate that it is a document by either leaving the file extension in the name or inserting the word “document” or the type of document in the link text.
Set Target to New Window for document links.
Enter a ToolTip. Tooltip can be additional but nonessential information about the link. (like., PDF opens in new window)
Do not change the CSS Class dropdown.
Click Ok to insert the hyperlink.
Once you complete your editing be sure to Save or Publish. If you do not choose one of these steps, your changes will not be added to the webpage.
In the top toolbar, click the green button to turn Design Mode Off.
Add a Hyperlink
Navigate to the page you want to edit.
In the top toolbar, click the toggle dot to turn Design Mode On.
Find the Content portlet on the page you want to edit, then click on the blue pencil Edit icon for Inline editing.
Place cursor where you want a hyperlink or use your mouse to highlight existing text that you want to transform into a hyperlink.
Click the Hyperlink Manager icon.
A new window will open. In the first field enter the URL.
Link Text is the information the viewer clicks on to access the link. Enter concise information regarding the destination of the link.
Text that was highlighted prior to clicking Hyperlink Manager (if any was highlighted) will become the link text.
Avoid using “click here,” “here,”or “read more” as link text needs to make sense out of context of the surrounding text.
Set Target to New Window for linksto other websites.
Enter a ToolTip. Tooltip can be additional but non-essential information about the link.
Do not change the CSS Class dropdown.
Click Ok to insert the hyperlink.
Once you complete your editing be sure to Save or Publish. If you do not choose one of these steps, your changes will not be added to the webpage.
In the top toolbar, click the green button click to turn Design Mode Off.
Add a Pagelink
Navigate to the page you want to edit.
In the top toolbar, click the toggle dot to turn Design Mode On.
Find the Content portlet on the page you want to edit, then click on the blue pencil Edit icon for Inline editing.
Place cursor where you want to place a page link.
Click the Pagelink icon.
A new window will open, search for the desired page you wish to link.
Choose the page by clicking Insert.
Once you complete your editing be sure to Save or Publish. If you do not choose one of these steps, your changes will not be added to the webpage.
In the top toolbar, click the green button click to turn Design Mode Off.
Note: you can preview the page you are linking by clicking on Preview link.
Banner Images
Images added to the Banner portlet should be edited to the Banner dimensional settings before upload
In the top toolbar, click the toggle dot to turn Design Mode On.
Click the Pencil/Edit icon in the upper right of the Banner portlet.
To manage images, you have a few options:
Click Add Image.
Click an image name, to edit the image properties.
Click on the “x” on the right side of the screen, to delete an image from the Banner portlet.
Location: Click the Browse link to select the image. If necessary, add your image to the folder structure. You should pre-edit the image to the banner size prior to upload.
Double click onthe image name.
Name: (required) Enter a Name forthe image.
Summary: (optional) A caption appearson the image.
URL: Enter a URL if you want users to click on the image and be directed to a webpage. (You may need to change the Banner settings to control this feature)
Alt Text: (required) Should be the message of the image if there is no URL in the URL field. When the URL field does have an address, the alt text should state the destination of the hyperlinked image.
Click Insert Image
Repeat steps 3-7 to add more images or click Update Image Order to save any changes.
In the top toolbar, click the green button to turn Design Mode Off.
Banner Portlet Settings
In the top toolbar, click the toggle dot to turn Design Mode On.
Click the Pencil/Edit icon in the upper right of the Banner portlet.
Edit the portlet settings as necessary:
Starting Image: First image or Randomly select an image
Slide Show Mode: On or Off
Show Controls: Yes or no (Best option for accessibility is yes)
Maximum Images: 8 (Note: Increasing this number will affect the page load speed)
Speed: 5 seconds per image is recommended.
Maximum height and width: Set the dimensions if adding the banner to a subpage, but do not change them on your homepage.
Animation: Defaults to random, however, you can select any from the list.
Action on image click: No action, Advance to next image, Open URL in current window, Open URL in new window
Click UpdateSettings.
In the top toolbar, click the green button to turn Design Mode Off.
Add an Event to a Calendar
Navigate to the page where you wish to add a new subpage.
Hover over the plus symbol near the top right of the calendar.
Click NewEvent.
Subject: (required).
Location: (optional).
Select Start and End Date, or All day check box: (required) Use the same start and end date for best result. Events that happen on more than one day should be set up as a recurrence.
Category: (optional) Administrators may set up Categories to assist visitors in filtering and search.
Contact: The contact will be the person who created the event, but contact can be changed using the user selector.
Enable Recurrence: (optional)
Set the repeat pattern: weekly, monthly, or yearly.
Set the end of the event: date, # of occurrences, or no end.
Event Registration: Use only for internal calendars with Registered Users.
Color: (optional) If changing the color, always choose a dark color.
Icon: (optional) Used to better identify recurring events
Region: Do not use.
Participants: Sends emails notifying listed participants of an event. Note: all names in this field are public facing and will appear in the event details.
Description: Provide details about the event.
Attachments: (optional) Attach files and documents to communicate additional event information. Visitors may download all attachments.
Published Calendars: (optional) Allows you to publish this event to other non-hidden calendars within your system.
Click CreateEvent.
Inserting an iCal Feed
Follow the steps listed here to find the iCal link in a Google Calendar. iCal links are also available in other Calendar systems.
Open the Google Calendar you want to sync with the Presence Calendar.
Look on the left side and find the calendar name that you want to sync.
Click on the three dots.
Click on Settings and sharing.
On the left side, click Access permissions and make sure the Google Calendar “Make available to public” check box is selected.
On the left side, click Integrate calendar. Scroll down and copy the link labeled “Public Address in iCal format”.
Navigate to the Presence calendar.
Click on the tab above the calendar labeled “External Calendars”.
Click on Add iCal Feed.
Paste the link that was copied from the Google Calendar.
Click Add Calendar.
Name the calendar with an accurate description because you can sync more than one iCal feed.
Click Add Calendar. The initial sync occurs within the first few hours. Future updates occur within one hour of changes to the Google Calendar.