This article gives instructions on how to configure and maintain the PageAssist™ module.
Article Navigation
Introduction
The PageAssist™ module of the Monsido web governance platform is a personalization toolbar that makes a website more user-friendly and visually accessible.
PageAssist alerts website owners about potential accessibility issues and provides a quick way to fix issues to ensure an equal experience for all website visitors.
Personalize the user experience
PageAssist allows website owners to make custom visual adjustments to suit their own unique requirements. Website users can:
Adjust font, text spacing, and font size.
Adjust cursor size.
Control the default and support languages.
Adjust the color scheme and contrast.
Adjust page focus.
Highlight page elements for easier identification and navigation.
Adjust media settings to pause or turn off or on animations and audio.
Adjust media settings to hide all images.
Change navigation to keyboard.
Prerequisites
This section gives instructions on how to meet the prerequisites for the Monsido PageAssist module setup. It is assumed that the account is active, see Monsido Introduction and Monsido Prerequisites if needed. For new customers, refer to the email instructions for new account owners to find the password and username to access the account with.
Open and log in to the Monsido application. Refresh to ensure that the latest version of the Monsido application is installed.
Set up a PageAssist tutorial session between the stakeholders who are responsible for updating the website and Monsido customer support. To set this up, send an email request to: support@monsido.com or use the chat system in the Monsido interface.
The Monsido Help Center offers several valuable methods to help you get started, including live support chat, a wealth of material to browse in the Knowledge Base, and personalized training sessions.
Setup
This section gives information on how to set up the PageAssist feature.
From the Monsido Domain Overview (globe icon), click Settings (gear icon) at the top of the page. The Admin Settings page opens.
Note: The Settings button is only available to site admins.
On the same row as the domain to scan, click Action.
In the drop-down list, select Script Setup Guide.
The Set up your domain page opens.
Click to toggle Add PageAssist script to ON.
Locate the PageAssist script settings section.
Configure the settings as per the instructions below and then copy the script and add it to the website HTML code. In the HTML editor, paste the script into the HEAD tag or place it before the </body> tag on every page.
For more information, see the User Guide chapter:
Widget Icon Setup
PageAssist position on page: Click on the mini window to specify the location for the PageAssist icon to appear on the page.
The options are:
Top left
Top center
Top right
Middle left
Middle right
Bottom left
Bottom center
Bottom right.
Margin from edge in pixels: Top, Right, Bottom, Left. These fields are populated automatically with the default margins as per the location selected in the previous step. Edit the fields as desired to customize the icon location even further.
Keep Page Assist on top: Tick to select this option. This ensures that the PageAssist icon is always visible and situated on top of other page elements.
Choose an Icon: Select an icon to represent the PageAssist feature on the website. The choices are:
Human figure with arms outstretched
Human figure in a wheelchair
Heart
Paintbrush
Icon shape: Click the drop-down list to select an icon shape. The choices are Circle and Rounded Box.
Widget Design and Text
This section gives information about how to set up the way your widget looks on your website. It is important to set up all of these items because if errors occur later on it might be difficult to determine which setting was missed.
Tip! The Monsido Color Contrast Checker is a quick way to test the color combinations on websites and pages. For instructions, see the Quick Guide: Check and Repair Color Contrast
Menu Theme: Click the drop-down arrow and select a menu theme. The choices are Light and Dark.
Main color: Click in the input field to select a color with the color picker, or enter the RGB code for the color (usually a color that fits with the website theme).
Text color: Click in the input field to select a color with the color picker, or enter the RGB code for the color (usually a color that fits with the website theme).
Link color: Click in the input field to select a color with the color picker, or enter the RGB code for the color (usually a color that fits with the website theme).
Button hover color: Click in the input field to select a color with the color picker, or enter the RGB code for the color (usually a color that fits with the website theme).
Color contrast ratio: This number indicates the contrast ratio for the selected colors, and lets the user know if the contrast between the buttons and text is Bad (0-3.99) or Good (4 and above).
Tip! The Monsido Color Contrast Checker is a quick way to test the color combinations on websites and pages. For instructions, see the Quick Guide: Check and Repair Color Contrast
Add icon border: Tick to select this option. An input field expands below the selection. Select a border color with the color picker, or enter the RGB code for the color (usually a color that fits with the website theme).
Upload logo: Paste a logo image link (URL) into the field and then click Upload Link, or click Browse and navigate to the logo and then save it.
Button hover message: Enter a free-text message for users to see when they hover the mouse pointer over the PageAssist button. Click in the field to see the location on the mini-view to the right of this section.
Note: Remember that this message will appear in the language as entered on all pages, it is not translated automatically by Monsido.
Enter a title for the PageAssist menu: Click in the field to see the location on the mini-view to the right of this section.
Note: Remember that this message will appear in the language as entered on all pages, it is not translated automatically by Monsido.
Title Text: Enter a free-text description of the PageAssist menu for users. Click in the field to see the location on the mini-view to the right of this section.
Note: Remember that this message will appear in the language as entered on all pages, it is not translated automatically by Monsido.
Reset Design: Click to discard changes and revert to the default settings.
Include Accessibility Statement: Click to toggle the switch ON. The section expands with an upload field. Browse to and add an Accessibility Statement.
Include custom info text: Click to toggle the switch ON. The section expands with a free-text field. Add a custom message to users.
Included languages: Click the drop-down arrow and select the languages that are used on the website. Select as many as needed.
Default language: Click the drop-down arrow and select the default language that is used on the website.
Add Skip to PageAssist: Click to toggle the switch ON. This option adds a button that allows users to skip directly to PageAssist.
Click OK to save the settings. The window closes and the Set up your domain page is visible, with the Script section updated.
Script
Scroll down to the script section at the bottom of the Set up your domain page.
In the script section, click Copy Script (icon of two papers) to copy the script.
Note: Configure all of the modules and copy/paste the entire script only one time. Repeat for each URL.
For more information, see the User Guide chapters:
Important! The script is unique for each domain. It will not work to copy/paste from one to another. Websites ending in .com and .eu, for example, are considered different domains and it does not work to copy/paste the Monsido script. The script needs to be configured separately for each domain.
In the HTML editor, paste the script into the BODY tag of the website. Place the Monsido script on the pages to track - normally every page of the website.
For more information, see the User Guide chapter:
In the CMS (or the website template files), add the copied code to the HEAD tag or place it before the </body> tag.
Tip: It is also possible to insert the code just before or after any Google Analytics™ script or other utility scripts. After installation, browse the sites to ensure that the script loads correctly.
Save and commit the changes as needed.
Return to Monsido and refresh the page.
Open the Domain Settings page (gear icon). The column Script shows the message Script Installed.
User Experience
This section gives instructions for the website user and how they can adjust the website view to meet their accessibility requirements.
The PageAssist icon appears on the website after the user accepts/rejects cookies:
Hover the mouse pointer over the PageAssist icon for an expanded view of the button:
Click the PageAssist button. The Personalization Options window opens.
Click the drop-down arrow in the Language field at the top of the window to expand the PageAssist language list. Select the desired language.
Note: This only changes the language in PageAssist, not in the website.
Personalization Options
Font: Click repeatedly to navigate through the fonts to: Sans Serif, Serif, or OpenDyslexic.
Font size: Click repeatedly to increase the text size up to 500%.
Text spacing: Click repeatedly to increase the text spacing to up to 5px.
Cursor size: Click to change the cursor size from Default to Big.
Contrast: Click repeatedly to change the contrast to Dark Mode, Invert Colors, or Grayscale.
Highlight Elements: Click repeatedly to change highlighted elements to Links, Headings, Buttons, or All.
CSS: Click to turn CSS OFF or ON.
For more information, see the User Guide chapter:
Focus: Click repeatedly to change focus to Emphasis or Reading Guide.
Media: Force pause all Multimedia with a pause/play button.
Animations: Turn the switch OFF or ON.
Audio: Turn the switch OFF or ON.
Hide Images: Click to enable Hide Images
Alternative Text: Click to enable alternative text when hovering with the mouse pointer.
Reset View: Click to revert to the default page view.
Information: Click for more information about PageAssist.
Site Menu: Click to view only site headers, landmarks, or links.
Accessibility Statement: Click to navigate to the company accessibility statement.
Keyboard Navigation: Click to select Keyboard navigation for the page. See a list of keyboard bindings as well as keyboard shortcuts for all PageAssist settings.
3. Click X to exit the Personalization Options window and return to the website.
Additional Resources
FAQ:
I have an issue with load time, can PageAssist be the problem?
Answer: No. When PageAssist is installed, the load script size is 33kb. The script adds the icon to the page. When a user clicks the icon, the 187kb script loads with the PageAssist functionality.
For more information, see the User Guide chapters:
For definitions and explanations of acronyms and abbreviations used in the Monsido User Guide, see:
For further assistance, contact the Monsido support team at support@monsido.com or use the Monsido chat and help features inside the application.