Divi Custom Attributes

What are HTML Attributes

You need HTML attributes to store various information associated with different pages elements, this information might not be essential for readers, but many JavaScript libraries and bots depends on it to run correctly. Many of them allow you to tweak their behavior by defining custom data attributes with given values.

You'll learn more on how to use these Attributes here: https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes

Now you can easily add Custom HTML Attributes in Divi with Divi Supreme's Custom Attributes Extension. With Custom Attributes extension, you can add attributes to the Wrapper of the Section/Row/Column/Module or Button.

Before Using

To use the Divi Supreme Custom Attributes Extension, you must first enable it from Divi Supreme Settings.

How to use Custom Attributes

You can find the Custom Attributes Settings by going in Settings Modal -> Advanced Tab -> Custom Attributes.

1. Go to any Section/Row/Column/Module settings -> Advanced tab -> Custom Attributes and enable "Use Custom Attributes".
2. Then you can choose whether you'd like to add the Attribute to the Wrapper or a Button in that Wrapper.
3. Then you can add a Title/Label to your Attribute and click the check-mark to enable the Attribute.
4. To add your attribute click the "Link" Icon.
5. Now, you'll see a Popup where you can add your Attribute Name and Value.

This is how the Attribute should look like on Frontend.

And that's it, if you want to add more Attributes, simply click the + Icon and you'll be able to add as many Attributes as you wish.

You'll learn more about Attributes References here: https://www.tutorialspoint.com/html5/html5_attributes.htm

Video Guide on How to add Attributes