All Collections
The Design Editor
Custom attributes (Beta)
Custom attributes (Beta)
Add extra information to your content to boost accessibility
Diego Muralles avatar
Written by Diego Muralles
Updated over a week ago

Custom attributes are currently in Beta and can be accessed by following these steps:

  1. From the Dashboard, click on your user name at the bottom of the left panel, or click this link to get there

  2. Navigate to the bottom-right of your profile page and find "Experimental features"

  3. Toggle on Custom attributes to turn the feature on for your user

Note: Features in beta are still being actively worked on, so you might experience unexpected behaviors or errors when using them. If you ever come across this, please send our friendly Support team a message so we can improve the feature. Just click the chat bubble in the bottom-right corner of your screen to send feedback.

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?