Title: Atributos para bloques Author: ska-dev Published: 25 de agosto de 2021 Last modified: 1 de diciembre de 2025 --- Buscar plugins ![](https://ps.w.org/attributes-for-blocks/assets/icon-256x256.png?rev=2588242) # Atributos para bloques Por [ska-dev](https://profiles.wordpress.org/skadev/) [Descargar](https://downloads.wordpress.org/plugin/attributes-for-blocks.1.0.13.zip) [Vista previa](https://es.wordpress.org/plugins/attributes-for-blocks/?preview=1) * [Detalles](https://es.wordpress.org/plugins/attributes-for-blocks/#description) * [Valoraciones](https://es.wordpress.org/plugins/attributes-for-blocks/#reviews) * [Instalación](https://es.wordpress.org/plugins/attributes-for-blocks/#installation) * [Desarrollo](https://es.wordpress.org/plugins/attributes-for-blocks/#developers) [Soporte](https://wordpress.org/support/plugin/attributes-for-blocks/) ## Descripción This plugin adds additional advanced inspector controls to Gutenberg blocks that allow to add any custom HTML attributes to the block’s front-end output. This allows you to add inline styles to fine-tune the block’s appearance, set aria attributes to improve your site’s accessibility, add data attributes to integrate with any JavaScript modules or even JavaScript DOM event attributes such as `onclick`, `onchange` or `onload`. [Demo](https://playground.wordpress.net/?plugin=attributes-for-blocks&url=%2Fwp-admin%2Fpost.php%3Fpost%3D2%26action%3Dedit) ## Capturas * [[ * Agregando atributo de estilo al bloque de párrafo ## Instalación #### Instalar a través del panel de administración 1. Ve a tu **panel de administración de WordPress -> Plugins**. 2. Haz clic en «Añadir nuevo» 3. Haz clic en «Subir plugin». 4. Seleccione el archivo `attributes-for-blocks.zip`. 5. Haz clic en «Instalar ahora». 6. Active el plugin desde **panel de administración de -> Plugins de WordPress**. #### Instalación manual vía carga FTP 1. Sube la carpeta «attributes-for-blocks» desde el archivo `attributes-for-blocks. zip` a la carpeta `../wp-content/plugins` de tus instalaciones de WordPress. 2. Active el plugin desde **panel de administración de -> Plugins de WordPress**. ## FAQ ### ¿Cómo agrego un atributo? In your selected block’s inspector controls (Block settings) scroll all the way to the bottom and click on «Advanced». It should contain a section called «Additional attributes». Type an attribute name into the «Add attribute» field and press «Add» to add an attribute for the block. A new input with the attribute’s name should appear below, into which you can optionally insert the attribute value. Example attributes: `style`, `title`, `target`, `class`, `id`, `onclick`, `data-*`, `aria-*`. ### Why is the input disabled? When the current user doesn’t have `unfiltered_html` capabilities attributes cannot be added and all existing attributes are stripped when the post is updated. ### ¿Cómo funciona? Para los bloques regulares, los atributos se agregan al elemento raíz del contenido guardado del bloque, lo que significa que se representarán solo en la interfaz y no en el editor. Para los bloques dinámicos, los atributos se agregan a través de la función `render_callback` y también se pueden aplicar en el editor, dependiendo de si el bloque se renderiza del lado del servidor o del cliente. ### ¿Funciona para todos los bloques? Debería funcionar con bloques normales que renderizan un elemento WP válido que pueda utilizar el filtro `blocks.getSaveContent.extraProps`, así como bloques dinámicos que utilicen un `render_callback`. Es posible que los bloques de terceros que hacen algo poco ortodoxo no funcionen. [Bloques no admitidos conocidos](https://plugins.trac.wordpress.org/browser/attributes-for-blocks/trunk/includes/unsupported-blocks.php) ### Usage with Alpine.js @ prefix in an attribute name is used for «override» mode in this plugin, for Alpine. js attributes use `x-on:click` instead of `@click` or use the shorthand syntax with two `@` characters instead of one: `@@click`. ### Disable block support El filtro `afb_unsupported_blocks` se puede usar en el archivo `functions.php` de su tema hijo (Child theme) para deshabilitar el soporte de bloques para agregar atributos adicionales. ``` add_filter('afb_unsupported_blocks', function($blocks) { $blocks[] = 'core/button'; return $blocks; }); ``` ### ¿Qué pasa cuando desactivo el plugin? Blocks with custom attributes may become invalid, depending on which attributes you’ve added. From there you can recover the block without the custom attributes by clicking «Attempt Block Recovery» or keep the block with custom attributes as HTML by choosing «Convert to HTML». If you don’t want to risk blocks becoming invalid you need to remove all custom attributes before disabling the plugin. ### How do I add unfiltered_html capability to user roles? You can modify which roles have the `unfiltered_html` capability using custom code in your theme’s `functions.php` file or via a custom plugin. Only grant this capability if you trust the current and future users of that role to not do anything malicious. ``` add_action('init', function() { if($role = get_role('contributor')) { $role->add_cap('unfiltered_html'); } }); ``` ## Reseñas ![](https://secure.gravatar.com/avatar/df445ecea9cca33d322bc9011daf5cd75f38c65ca1e4ee4b80ee3a62994b82fb? s=60&d=retro&r=g) ### 󠀁[A must-have plugin that brings true flexibility to the block editor](https://wordpress.org/support/topic/a-must-have-plugin-that-brings-true-flexibility-to-the-block-editor/)󠁿 [Germán](https://profiles.wordpress.org/germanfrelo/) 17 de octubre de 2025 Thank you so much for creating this plugin! It adds a level of versatility to the block editor that WordPress really needed. Being able to easily add custom attributes— like data-*, aria-*, or other HTML attributes — makes it incredibly useful for developers and site builders alike. It works exactly as expected, saves tons of time, and feels lightweight and reliable. Perfect for anyone who wants finer control over blocks without having to write extra code or rely on complex workarounds. Huge thanks to the authors for keeping it simple, powerful, and developer-friendly — I truly hope this continues to be maintained for future WordPress versions. Highly recommended! ![](https://secure.gravatar.com/avatar/3a0d4408354ac7f1fddc273366daae9126187a427e91b7798e3502d2ba499b4d? s=60&d=retro&r=g) ### 󠀁[Thank you, this is gold for improving accessibility!](https://wordpress.org/support/topic/thank-you-this-is-gold-for-improving-accessibility/)󠁿 [Anne-Mieke Bovelett](https://profiles.wordpress.org/annebovelett/) 14 de diciembre de 2024 Thank you so much for creating this! ![](https://secure.gravatar.com/avatar/11e6b9c29a68f8735b51fbf2e58b90d6c26e96b1887199c5df40b65f68143d50? s=60&d=retro&r=g) ### 󠀁[Saved me tons of work](https://wordpress.org/support/topic/saved-me-tons-of-work-3/)󠁿 [Dunkan](https://profiles.wordpress.org/dunkanmccloud/) 6 de noviembre de 2024 This is perfect, it saved me tons of work. I am used it for adding the view-transition- classes to query block elements.websevendev & jimedwards million thanks to you! ![](https://secure.gravatar.com/avatar/de46ac8aba3c1e3cf6e476d77765d6cdba0803016583b8575033d3297b66a9cf? s=60&d=retro&r=g) ### 󠀁[Worked great!](https://wordpress.org/support/topic/worked-great-279/)󠁿 [dallinchase](https://profiles.wordpress.org/dallinchase/) 18 de julio de 2024 Worked exacltly as needed, I recomend it! ![](https://secure.gravatar.com/avatar/cc6790afcae10f85481e673c9127c4b502d5af9b056d9b0b4f2a2e488c799c1b? s=60&d=retro&r=g) ### 󠀁[Very nice and useful](https://wordpress.org/support/topic/very-nice-and-useful-21/)󠁿 [mauri01](https://profiles.wordpress.org/mauri01/) 14 de febrero de 2024 Thank you very much for providing this plugin, I have been able to use SAL scroll animation library with it works perfectly! Hope you keep going with this Plugin for future Wordpress versions. Thank YOU! ![](https://secure.gravatar.com/avatar/45e3dfb5e418c9d670a2c0b158440b929e2d64bf3a0f63c002d7ef1141e8e83a? s=60&d=retro&r=g) ### 󠀁[Awesome plugin!](https://wordpress.org/support/topic/awesome-plugin-7070/)󠁿 [Nazar Hotsa](https://profiles.wordpress.org/bugnumber9/) 4 de enero de 2024 I absolutely love this plugin! Does what it says easily and reliably, doesn’t add any bloat. Amazing. [ Leer todas las 21 reseñas ](https://wordpress.org/support/plugin/attributes-for-blocks/reviews/) ## Colaboradores y desarrolladores «Atributos para bloques» es un software de código abierto. Las siguientes personas han colaborado con este plugin. Colaboradores * [ ska-dev ](https://profiles.wordpress.org/skadev/) * [ jimedwards ](https://profiles.wordpress.org/jimedwards/) «Atributos para bloques» está traducido en 5 idiomas. Gracias a [los traductores](https://translate.wordpress.org/projects/wp-plugins/attributes-for-blocks/contributors) por sus contribuciones. [Traduce «Atributos para bloques» a tu idioma.](https://translate.wordpress.org/projects/wp-plugins/attributes-for-blocks) ### ¿Interesado en el desarrollo? [Revisa el código](https://plugins.trac.wordpress.org/browser/attributes-for-blocks/), echa un vistazo al [repositorio SVN](https://plugins.svn.wordpress.org/attributes-for-blocks/) o suscríbete al [registro de desarrollo](https://plugins.trac.wordpress.org/log/attributes-for-blocks/) por [RSS](https://plugins.trac.wordpress.org/log/attributes-for-blocks/?limit=100&mode=stop_on_copy&format=rss). ## Registro de cambios #### 1.0.13 * Tested with WordPress 6.9. #### 1.0.12 * Added a donate link on the plugin page – supporters get a 50% off coupon for my brand new WordPress theme. * Fix potential duplication when merging style attribute values. * Update `@wordpress/*` packages. * Tested with Gutenberg 21.7.0. #### 1.0.11 * WP 6.8. #### 1.0.10 * Added `afb_get_attributes` filter, allowing to dynamically modify attributes. #### 1.0.9 * Try fix issue with `current_user_can` check in `pre_kses` when `SECURE_AUTH_COOKIE` isn’t defined. #### 1.0.8 * Try fix issue with `current_user_can` check in `pre_kses` when WP pluggable functions aren’t loaded. #### 1.0.7 * Security update: users without `unfiltered_html` capability can no longer add attributes. When a user without the capability updates a post all existing attributes are stripped. Issue discovered by Francesco Carlucci (CVE ID: CVE-2024-8318, CVSS Severity Score: 6.4 (Medium)). The vulnerability made it possible for authenticated attackers, with Contributor-level access and above, to inject arbitrary web scripts in pages that will execute whenever a user accessed an injected page. * Tested up to WordPress 6.6. * Update `@wordpress/*` packages. #### 1.0.6 * Tested up to WordPress 6.5. * Fix PHP notice when rendering a block that doesn’t have any attributes. * Update `@wordpress/*` packages. #### 1.0.5 * Use `WP_HTML_Tag_Processor` for adding HTML attributes. * Remove `afb_sanitize_attribute_key` and `afb_sanitize_attribute_value` filters( now handled by `WP_HTML_Tag_Processor`). * Use `render_block` filter to apply attributes instead of overriding block’s ` render_callback`. * Move all PHP code to main file for simplicity. * Add `$attribute` param to `afb_attribute_separator` filter. * Remove uppercase text transform from attribute input labels, use monospace font for value. * Add button to edit attributes in a modal for more space. * Update `@wordpress/*` packages. * Regression: for blocks that render multiple root elements attributes are only applied to the first one. #### 1.0.4 * Add `afb_sanitize_attribute_key` and `afb_sanitize_attribute_value` filters. * Catch errors when using invalid characters in attribute name/value. * Update `@wordpress/*` packages. #### 1.0.3 * Update `@wordpress/*` packages. * Test with WordPress 6.0. * Convert advanced style attribute editor to TypeScript and refactor. * Fix duplicate attribute values being output when the block has both JS and PHP render functions. * Add GitHub link. * Remove `src` folder from plugin. #### 1.0.2 * Agregue un editor avanzado para el atributo de estilo. * Eliminar jQuery #### 1.0.1 * Corrige la codificación de caracteres especiales para bloques dinámicos. ## Meta * Versión **1.0.13** * Última actualización **hace 4 meses** * Instalaciones activas **4.000+** * Versión de WordPress ** 6.2 o superior ** * Probado hasta **6.9.4** * Versión de PHP ** 7.4 o superior ** * Idiomas * [Chinese (Taiwan)](https://tw.wordpress.org/plugins/attributes-for-blocks/), [English (US)](https://wordpress.org/plugins/attributes-for-blocks/), [German](https://de.wordpress.org/plugins/attributes-for-blocks/), [Japanese](https://ja.wordpress.org/plugins/attributes-for-blocks/), [Spanish (Chile)](https://cl.wordpress.org/plugins/attributes-for-blocks/) y [Spanish (Spain)](https://es.wordpress.org/plugins/attributes-for-blocks/). * [Traducir a tu idioma](https://translate.wordpress.org/projects/wp-plugins/attributes-for-blocks) * Etiquetas: * [ARIA](https://es.wordpress.org/plugins/tags/aria/)[attributes](https://es.wordpress.org/plugins/tags/attributes/) [blocks](https://es.wordpress.org/plugins/tags/blocks/)[gutenberg](https://es.wordpress.org/plugins/tags/gutenberg/) [style](https://es.wordpress.org/plugins/tags/style/) * [Vista avanzada](https://es.wordpress.org/plugins/attributes-for-blocks/advanced/) ## Valoraciones 5 de 5 estrellas. * [ 21 valoraciones de 5 estrellas ](https://wordpress.org/support/plugin/attributes-for-blocks/reviews/?filter=5) * [ 0 valoraciones de 4 estrellas ](https://wordpress.org/support/plugin/attributes-for-blocks/reviews/?filter=4) * [ 0 valoraciones de 3 estrellas ](https://wordpress.org/support/plugin/attributes-for-blocks/reviews/?filter=3) * [ 0 valoraciones de 2 estrellas ](https://wordpress.org/support/plugin/attributes-for-blocks/reviews/?filter=2) * [ 0 valoraciones de 1 estrellas ](https://wordpress.org/support/plugin/attributes-for-blocks/reviews/?filter=1) [Your review](https://wordpress.org/support/plugin/attributes-for-blocks/reviews/#new-post) [Ver todas las valoraciones](https://wordpress.org/support/plugin/attributes-for-blocks/reviews/) ## Colaboradores * [ ska-dev ](https://profiles.wordpress.org/skadev/) * [ jimedwards ](https://profiles.wordpress.org/jimedwards/) ## Soporte ¿Tienes algo que decir? ¿Necesitas ayuda? [Ver el foro de soporte](https://wordpress.org/support/plugin/attributes-for-blocks/) ## Donar ¿Te gustaría apoyar el progreso de este plugin? [ Dona a este plugin ](https://buymeacoffee.com/skadev)