Custom attributes

Add extra information to your content to boost accessibility

Diego Muralles avatar
Written by Diego Muralles
Updated over a week ago

The topic of accessibility is becoming more important and with that follows the need to create designs that are friendly to screen readers. Custom attributes let you add extra information to your content so screen readers and search engines can access this for additional context.

All Vev elements can have custom attributes added to them. This can for example be to:

  • Improve SEO: By adding metadata with custom attributes you can add keywords and descriptions to provide the context needed for search engines to appropriately evaluate the relevance and search ranking of your content.

  • Enhance accessibility: By adding ARIA attributes you can provide necessary information not communicated through the native HTML attributes. This way you can be more inclusive of your audience. Read more about enhancing accessibility here.

  • Set up tracking: Ensure Vev elements are tracked by adding custom attributes. However, it is important to use this appropriately and according to data privacy regulations so you are collecting in a responsible and ethical way.

Note: Custom attributes are not native HTML which also means that they could have implications, such as reduced performance or affecting the semantic HTML structure if used incorrectly.

How to add a custom attribute:

  1. Select the element you want to add a custom attribute to

  2. Open the Properties panel

  3. Click the β€œ+” button to add a new custom attribute

  4. Enter the name of your custom attribute followed by the attribute value

  5. Save the custom attribute

Here you can read more about what HTML attributes are. W3Schools also has an HTML attribute reference sheet that lists out what can be used in our Custom attributes editor.

Did this answer your question?