Title: Block Data Attribute Author: Mahdi Yazdani Published: februari 10, 2020 Last modified: november 7, 2022 --- Search plugins ![](https://ps.w.org/block-data-attribute/assets/banner-772x250.jpg?rev=2243297) This plugin **hasn’t been tested with the latest 3 major releases of WordPress**. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress. ![](https://ps.w.org/block-data-attribute/assets/icon-256x256.jpg?rev=2242125) # Block Data Attribute By [Mahdi Yazdani](https://profiles.wordpress.org/mahdiyazdani/) [Download](https://downloads.wordpress.org/plugin/block-data-attribute.zip) * [Details](https://pap-aw.wordpress.org/plugins/block-data-attribute/#description) * [Reviews](https://pap-aw.wordpress.org/plugins/block-data-attribute/#reviews) * [Installation](https://pap-aw.wordpress.org/plugins/block-data-attribute/#installation) * [Development](https://pap-aw.wordpress.org/plugins/block-data-attribute/#developers) [Support](https://wordpress.org/support/plugin/block-data-attribute/) ## Description This plugin designed with extensibility in mind for data that should be associated with a particular block type but need not have any defined meaning. `data-*` attributes will allow you to store extra information on different Gutenberg blocks, without other hacks such as non-standard attributes, appending properties on DOM, or modifying a block as HTML which will throw a block validation error when opening the post edit page once again. ## Screenshots * [[ * Plugin Settings ## Installation #### Minimum Requirements * PHP version 7.4 or greater. * MySQL version 5.6 or greater or MariaDB version 10.0 or greater. * WordPress version 5.5 or greater. #### Automatic installation Automatic installation is the easiest option — WordPress will handle the file transfer, and you won’t need to leave your web browser. To do an automatic install of the plugin, log in to your WordPress dashboard, navigate to the Plugins menu, and click“ Add New.” In the search field type “Block Data Attribute”, then click “Search Plugins.” Once you’ve found the plugin, you can view details about it such as the point release, rating, and description. Click “Install Now,” and WordPress will take it from there. #### Manual installation The manual installation method requires downloading the plugin and uploading it to your webserver via your favorite FTP application. The WordPress codex contains [instructions on how to do this here](https://wordpress.org/support/article/managing-plugins/#manual-plugin-installation). #### Updating Automatic updates should work smoothly, but we still recommend you back up your site. ## FAQ ### How do I create a custom data attribute? 1. Log into your WordPress website and navigate to Dashboard. 2. Create a new page, by visiting “Pages” » “Add New”. 3. Click on the “Add Block” button and select the “Button” block. Alternatively, you can start typing `/button` in a new paragraph block, then press enter. 4. Once you’ve inserted the block, you can use the block settings sidebar to add your custom data attribute. 5. Clicking on the `⚙` cog icon next to the publish button will toggle the visibility of this sidebar. 6. In the block sidebar, you can expand the `Block Data Attribute` section to add custom attributes as needed. 7. Publish the page. ### Which blocks are allowed to accept custom data attributes? Currently, custom data attributes can be saved within the following blocks: * `core/button` * `core/column` * `core/columns` * `core/heading` * `core/group` * `core/paragraph` Generally, this would be possible due to a JavaScript hooks system with WordPress that includes block filters and several other types of filters available via JavaScript. You can extend the predefined list of block names by hooking into the `mypreview. blockDataAttributeAllowedBlocks` filter provided by the plugin. ### How do I get help with the plugin? The easiest way to receive support is to “Create a new topic” by visiting Community Forums page [here](https://wordpress.org/support/plugin/block-data-attribute). Make sure to check the “Notify me of follow-up replies via email” checkbox to receive notifications, as soon as a reply posted to your question or inquiry. _Please note that this is an opensource 100% volunteer project, and it’s not unusual to get reply days or even weeks later._ ### Can I help in translating this plugin into a new language? The plugin is fully translation-ready and localized using the GNU framework, and translators are welcome to contribute to the plugin. Here’s the the [WordPress translation website →](https://translate.wordpress.org/projects/wp-plugins/block-data-attribute) ### How do I contribute to this plugin? We welcome contributions in any form, and you can help reporting, testing, and detailing bugs. Here’s the [GitHub development repository →](https://github.com/mypreview/block-data-attribute) ### Did you like the idea behind this plugin? If you or your company use any of my projects or like what I’m doing, please consider [making a donation](https://www.buymeacoffee.com/mahdiyazdani) so I can continue maintaining and evolving all my projects and new ones. I’m in this for the long run. –AND/OR– Please share your experience by leaving this plugin [5 shining stars](https://wordpress.org/support/plugin/block-data-attribute/reviews/) if you like it, thanks! ## Reviews ![](https://secure.gravatar.com/avatar/396905029dadc9b0fcf5bc9f2f6daec67a440fb67a1f11fba089ee00a83b8a39? s=60&d=retro&r=g) ### 󠀁[Would love this to cover images](https://wordpress.org/support/topic/would-love-this-to-cover-images/)󠁿 [johnlewisdesign](https://profiles.wordpress.org/johnlewisdesign/) mei 6, 2021 Great plugin, would be even greater if it did images too for animation on scroll( AOS) reasons. ![](https://secure.gravatar.com/avatar/85dfc3c1cc6cc86271cdd685842bf699528239bac18994b1fbc75ff76a024bf5? s=60&d=retro&r=g) ### 󠀁[Time saver](https://wordpress.org/support/topic/time-saver-272/)󠁿 [tv360](https://profiles.wordpress.org/tv360/) october 8, 2020 Saved me from having to build it myself. Surprised this still isn’t built into native block functionality. Thank you! ![](https://secure.gravatar.com/avatar/189988bb7d8de836a88a79b0d7d19a05550e597c6b688c03655f66e1e1158934? s=60&d=retro&r=g) ### 󠀁[Good but I just need one more thing](https://wordpress.org/support/topic/good-but-i-just-need-one-more-thing/)󠁿 [Amanda](https://profiles.wordpress.org/rocketkiddo/) augustus 15, 2020 I have to add a data attribute to one my of blocks and I’ve found this plugin developed by you. Unfortunately, the plugin doesn’t allow me to type slash (/) or backslash(\) in the Value field. I know this is blocked with Javascript but I wasn’t able to figure out which line of the code is causing this. Thank you! ![](https://secure.gravatar.com/avatar/3f031c46db80da474af6cf945a77597709d0d70bd19fc382aa2bd94debe12836? s=60&d=retro&r=g) ### 󠀁[Does what I needed it to do](https://wordpress.org/support/topic/does-what-i-needed-it-to-do-3/)󠁿 [kevingarubba](https://profiles.wordpress.org/kevingarubba/) juni 23, 2020 Saved me from a lot of setup and code involved in block registration by just adding the simple field I needed. [ Read all 4 reviews ](https://wordpress.org/support/plugin/block-data-attribute/reviews/) ## Contributors & Developers “Block Data Attribute” is open source software. The following people have contributed to this plugin. Contributors * [ Mahdi Yazdani ](https://profiles.wordpress.org/mahdiyazdani/) * [ MyPreview ](https://profiles.wordpress.org/mypreview/) * [ Saji ](https://profiles.wordpress.org/gookaani/) [Translate “Block Data Attribute” into your language.](https://translate.wordpress.org/projects/wp-plugins/block-data-attribute) ### Interested in development? [Browse the code](https://plugins.trac.wordpress.org/browser/block-data-attribute/), check out the [SVN repository](https://plugins.svn.wordpress.org/block-data-attribute/), or subscribe to the [development log](https://plugins.trac.wordpress.org/log/block-data-attribute/) by [RSS](https://plugins.trac.wordpress.org/log/block-data-attribute/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 2.0.2 * Compatibility with WordPress 6.1 #### 2.0.1 * Added missing `data` keyword from the attribute name. #### 2.0.0 * Define unlimited number of attributes. * Compatibility with WordPress 6.0 * Updated node modules. #### 1.0.5 * Fixed incorrect escaping in data `value` attribute pair. #### 1.0.4 * Updated node modules. * Compatibility with WordPress 5.5 #### 1.0.3 * Multiple code standards improvements. * Compatibility with WordPress 5.4.1 #### 1.0.2 * Multiple code standards improvements. * Compatibility with WordPress 5.4.0 #### 1.0.1 * Fixed Github repo web-address. * Updated plugin banner image. #### 1.0.0 * Initial release. ## Meta * Version **2.0.2** * Last updated **3 years ago** * Active installations **300+** * WordPress version ** 5.5 or higher ** * Tested up to **6.1.10** * PHP version ** 7.4 or higher ** * Language * [English (US)](https://wordpress.org/plugins/block-data-attribute/) * Tags * [attribute](https://pap-aw.wordpress.org/plugins/tags/attribute/)[block-editor](https://pap-aw.wordpress.org/plugins/tags/block-editor/) [blocks](https://pap-aw.wordpress.org/plugins/tags/blocks/)[gutenberg](https://pap-aw.wordpress.org/plugins/tags/gutenberg/) [gutenberg blocks](https://pap-aw.wordpress.org/plugins/tags/gutenberg-blocks/) * [Advanced View](https://pap-aw.wordpress.org/plugins/block-data-attribute/advanced/) ## Ratings 5 out of 5 stars. * [ 4 5-star reviews ](https://wordpress.org/support/plugin/block-data-attribute/reviews/?filter=5) * [ 0 4-star reviews ](https://wordpress.org/support/plugin/block-data-attribute/reviews/?filter=4) * [ 0 3-star reviews ](https://wordpress.org/support/plugin/block-data-attribute/reviews/?filter=3) * [ 0 2-star reviews ](https://wordpress.org/support/plugin/block-data-attribute/reviews/?filter=2) * [ 0 1-star reviews ](https://wordpress.org/support/plugin/block-data-attribute/reviews/?filter=1) [Your review](https://wordpress.org/support/plugin/block-data-attribute/reviews/#new-post) [See all reviews](https://wordpress.org/support/plugin/block-data-attribute/reviews/) ## Contributors * [ Mahdi Yazdani ](https://profiles.wordpress.org/mahdiyazdani/) * [ MyPreview ](https://profiles.wordpress.org/mypreview/) * [ Saji ](https://profiles.wordpress.org/gookaani/) ## Support Got something to say? Need help? [View support forum](https://wordpress.org/support/plugin/block-data-attribute/) ## Donate Would you like to support the advancement of this plugin? [ Donate to this plugin ](https://www.buymeacoffee.com/mahdiyazdani)