Skip to main content

Search

We are excited to announce the launch of updated product names, logos, and headers within our user interfaces as part of the CivicPlus® Solution Rebranding initiative. These changes mark the first step toward creating a cohesive and seamless user experience across all solutions in our portfolio. As part of this transition, users may notice minor design updates. While the functionality you rely on remains unchanged, we are in the process of updating screenshots and other resources on our Help Centers to reflect the new branding. We appreciate your patience and understanding as we work to complete these updates.

Label Non-English Text in the Editor Widget

  • Updated:

To meet the Web Content Accessibility Guidelines (WCAG) 3.1.1 Language of Page requirement to make page content more accessible to people with disabilities, label any text other than English in the Editor Widget using the HTML attribute <span lang="_"> (example: label Spanish as <span lang="es">).

 

Who can use this feature?

System Administrator | Owner | Publisher | Author

 

Important Note

CivicPlus works toward WCAG 2.0 AA accessibility standards and our websites are highly compliant when they go live. However, ongoing ADA compliance and maintenance is the customer's responsibility.

 

Instructions

 

  1. Sign in to your website solution.
  2. Navigate to your desired page.
  3. Click the Live Edit is OFF button to enable Live Edit:
    Web Central Live Edit is Off button.
    Note: If Live Edit is currently enabled, the button will read Live Edit is ON:
    When Live Edit is ON, Web Central pages are able to updated.
  4. Click inside the Editor widget:
    Clicking inside a page's Editor widget allows to user to update or change any content currently added to that widget.
  5. Identify the text that is in a non-English language and highlight it on the non-code side:
    Highlighting the non-English text on the non-code view side makes it easier to use the Editor widget's Language tool to apply the HTML code accurately.
  6. Select the Language tool (Globe icon) to open the language drop-down menu:
    The Language tool allows the user to apply the HTML language element for the chosen language.
  7. Select the appropriate language from the list:
    The Language tool's list of languages to choose from.
  8. Click on the Code View tool:
    The Code View tool allows the user to see the content's HTML source code.
  9. Ensure that the code reads <span "lang="lang abbreviation">Text</span>:
    The language HTML tags are added to both sides of the non-English text.
    Note: The <span> tag does not stand for Spanish, it is an HTML text marker. The HTML language abbreviation for Spanish is "es". For example, <span lang="es">Por favor</span>
  10. Click the Done Editing button to exit the editor:
    The Done Editing button closes the Editor Widget once any changes are made.
  11. Click the Save button:
    When clicked, the Save button will save all changes made and will reflect those changes on the live page.

 

In-Article Glossary

Review the Help Center Glossary, a comprehensive explanation of the acronyms, abbreviations, and company-specific terminology. The terms located in this section are listed alphabetically:

  • ADA: Americans with Disabilities Act
  • HTML: Hypertext markup language
  • Lang: Language
  • WCAG: Web Content Accessibility Guidelines
Was this article helpful?
0 out of 0 found this helpful
Return to top

Feedback About the Article

Let us know what was helpful or not helpful about the article below.

0 comments

Please sign in to leave a comment.