Make your forum accessible to people with disabilities |
OverviewDescriptionThe purpose of this tip is to introduce you to USER WAY, a service offering the installation of a widget on your Forumotion forum in order to improve the user experience of people with disabilities, in accordance with WCAG (Web Content Accessibility Guidelines) standards. defining web content accessibility guidelines. This widget offers many options like highlighting page elements, highlighting links, enlarging text, etc. USER WAY is the solution to make your forum more inclusive!DemonstrationIn the image above, Forumotion had installed the widget on the HTML page of the 2021 Christmas event. As you can see, a button (installed on the right) allows you to unfold a widget with the different accessibility options without having to modify a single line of code in order to make its forum more inclusive. Technical limitations› This tutorial is dedicated to the forums powered by Forumotion free forum service› It works with all Forumotion forums' versions › It requires an external service (userway.org) to work Get the UserWay widgetObtaining the widget is done directly on the USER WAY website:Get UserWay Now - https://userway.org/get/ First, you must register in order to register the forum(s) on which you are going to install the widget. Two possibilities of registration: either by a valid e-mail address, or through a service (Google, Facebook and LinkedIn). Secondly, you must add the forum(s) on which you will install the widget. Fill in an address then click on the "Add" button. Once this is complete, click on the link (at the bottom of the page) "Skip and Get the Free Accessibility Widget": Thirdly, you must retrieve the Javascript code for your widget! We are going to use the Basic Script. Click on the "Copy" button to copy the code. Install the widget on your Forumotion forumTwo installation methods are offered: a simple installation and an advanced one. Choose only one of the two modalities.Easy installationFor the next step you need to go towards Administration Control Panel (ACP) Modules HTML & Javascript Javascript codes management and create a new code - upon verifying that Javascript codes management is enabled.
Javascript CustomizationThis customization step is mandatory! This is to fill in the identifier (ID) of the USERWAY account that you have created. This identifier is given in the script during the third step presented in 1. of this tutorial:So, replace
Click on the Submit button to save the modifications. The Widget is now functional on your forum. However, depending on the customization of the latter, you will probably have to adapt its position with regard to the presence of the ToolBar, for example. For this purpose, you can simply configure the positioning of the button with CSS. CSSIn order to design the style of the resource, you need to go towards Administration Control Panel (ACP) Display CSS & Colors CSS Style Sheet and add append the following code:You need to reply to the topic in order to see the code resources Advanced SetupFor the next step you need to go towards Administration Control Panel (ACP) Modules HTML & Javascript Javascript codes management and create a new code - upon verifying that Javascript codes management is enabled.
Javascript Customization
CSSIn order to design the style of the resource, you need to go towards Administration Control Panel (ACP) Display CSS & Colors CSS Style Sheet and add append the following code.The Widget is now functional on your forum. However, depending on the customization of the latter, you will probably have to adapt its position with regard to the presence of the ToolBar, for example. For this purpose, you can simply configure the positioning of the button with CSS: You need to reply to the topic in order to see the code resources Notes
|
This tutorial was written by the Staff of the Forum des Forums, and in particular by @Bipo , with the participation of @chattigre . No reproduction possible without our agreement, in accordance with article L122-1 of the CPI. |