AEMaaCS aria-label for links, Rich Text Editor cq/gui/components/authoring/dialog/richtext | Community
Skip to main content
S
SupportMember
Level 6
June 12, 2023
Solved

AEMaaCS aria-label for links, Rich Text Editor cq/gui/components/authoring/dialog/richtext

  • June 12, 2023
  • 2 replies
  • 1670 views

For some reason whenever I view my page in publish mode, the aria-label is gone... for example <a href="home.html" aria-label="home page">Home</a>

for: cq/gui/components/authoring/dialog/richtext

I literally updated the crx/de with aria-label, and done @ context = 'html'

turns into:
<a href="home.html">Home</a>

 

How can I retain the aria-label="home page"?

Please help, thanks!

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by BrianKasingli

Here's what you need to do, exactly:

  1. Login to AEM
  2. Visit http://localhost:4502/crx/de/index.jsp#/libs/cq/xssprotection/config.xml
  3. Overlay the XSS protection configuration by copying /libs/cq/xssprotection into /apps/cq/xssprotection (and all it’s children)
  4. Delete the /apps/cq/xssprotection/rep:policy
  5. From crx/DE you can edit the file /apps/cq/xssprotection/config.xml
  6. On your keyboard, hit “ctrl + f” to find <tag name=”a” action=”validate”>
  7. This is an XML file, so find the end of the closing tag </tag>
  8. Insert this line of code:
    <attribute name="aria-label"> <regexp-list> <regexp name="anything"/> </regexp-list> </attribute>​
  9. Done

I've actually written an article for this if you want to see some visual gestures -> https://sourcedcode.com/blog/aem/aem-rich-text-editor-rendering-aria-labels

2 replies

sravs
Community Advisor
sravsCommunity Advisor
Community Advisor
June 13, 2023

You'd need to overlay /libs/cq/xssprotection/config.xml  and add the required attributes you want to allow in RTE.

You can refer to how to overlay it here.
https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/how-to-overlay-libs-cq-xssprotection-config-xml-to-project/m-p/459732

    BrianKasingli
    Community Advisor and Adobe Champion
    BrianKasingliCommunity Advisor and Adobe ChampionAccepted solution
    Community Advisor and Adobe Champion
    June 14, 2023

    Here's what you need to do, exactly:

    1. Login to AEM
    2. Visit http://localhost:4502/crx/de/index.jsp#/libs/cq/xssprotection/config.xml
    3. Overlay the XSS protection configuration by copying /libs/cq/xssprotection into /apps/cq/xssprotection (and all it’s children)
    4. Delete the /apps/cq/xssprotection/rep:policy
    5. From crx/DE you can edit the file /apps/cq/xssprotection/config.xml
    6. On your keyboard, hit “ctrl + f” to find <tag name=”a” action=”validate”>
    7. This is an XML file, so find the end of the closing tag </tag>
    8. Insert this line of code:
      <attribute name="aria-label"> <regexp-list> <regexp name="anything"/> </regexp-list> </attribute>​
    9. Done

    I've actually written an article for this if you want to see some visual gestures -> https://sourcedcode.com/blog/aem/aem-rich-text-editor-rendering-aria-labels

      Terms & ConditionsAccessibility statement

      Loading footer...