Selma Widget
Accessibility widget for Umbraco
Selma Widget gives visitors to your Umbraco site a menu where they can adjust text, contrast and motion to their needs. You add one line of code to your master template, and your templates stay as they are.
Why it suits Umbraco
Built for sites with many editors
All new content is covered
On an Umbraco site, many editors often publish. The widget rescans the site every 24 hours, so new pages also get the automatic adjustments, and images without alt text get a description.
Reports for your developers
The monthly reports show what the widget has adjusted and how the menu is used, so your developers or agency know what to fix in the templates.
Keep your templates
The widget goes into your master template once and sits on top of the site. You do not need to rebuild templates or document types to give visitors more ways to read.
What is included
What your visitors get
Profiles for different needs
Ready-made profiles for low vision, cognitive needs and ADHD, among others, and a mode that stops flashing and moving content.
Own adjustments
The visitor can change text size, contrast, line spacing and the cursor, use a reading mask and stop animations.
Keyboard and screen readers
The widget improves focus and keyboard navigation and adds information that screen readers need, for menus, pop-ups and forms, for example.
Alternative text
Images without alternative text get a description written by AI.
The menu in 33 languages
The menu is available in 33 languages. The site's own content is not translated.
Loads after the page
The widget loads once the page is already showing, so it does not hold back the content.
Get started
How to add the widget
The widget is one line of code that you add once and that then loads on every page. It picks up its settings from your domain, so there is nothing else to change in Umbraco.
- 1
Open the master template
Log in to the backoffice, go to Settings and Templates, and open the template the whole site is based on, often called Master or Layout.
- 2
Paste the code
Paste Selma's code just above the closing body tag and save. The accessibility icon then appears on your site.
Good to know
What the widget does not do
The widget makes the page easier to use for many visitors, but it does not replace fixing the issues in the code.
Outside what the widget does
- Your source code does not change. The adjustments exist in the visitor's browser, and if the widget is removed, they are gone.
- PDFs and other documents, captions for video and content from other domains in iframes
- Subdomains and services on other domains, such as booking or payment
- Mobile apps
Selma Bevakning helps your developers fix the issues in the code, and Selma Services carries out manual reviews and user tests.
Questions about Selma Widget and Umbraco
- How do I add the widget to Umbraco?
- Open Settings and Templates in the backoffice, choose the master template and paste Selma's code just above the closing body tag. Save, and the widget loads on every page that uses the template.
- Do we need a developer?
- Not always. Anyone allowed to edit templates in the backoffice can add the code. If you do not have that permission, or your templates live in your codebase, your developer or agency adds the line instead.
- We have several templates. Where does the code go?
- In the template the others are based on. If some pages use a template that is not based on it, add the line there too.
- Does the widget slow down my Umbraco site?
- No. The widget loads once the page is already showing, so it does not hold back your content.
See the widget on your Umbraco site
Book a demo and we will show you how the widget works on your website, and what it does not do.