Title: HTML Attributes Customizer for Blocks
Author: NEERAJ K
Published: <strong>22. мај 2026.</strong>
Last modified: 25. мај 2026.

---

Претражи додатке

![](https://s.w.org/plugins/geopattern-icon/block-attr-customizer.svg)

# HTML Attributes Customizer for Blocks

 [NEERAJ K](https://profiles.wordpress.org/neerajk1409/)

[Преузимање](https://downloads.wordpress.org/plugin/block-attr-customizer.1.0.1.zip)

 * [Детаљи](https://sr.wordpress.org/plugins/block-attr-customizer/#description)
 * [Прегледи](https://sr.wordpress.org/plugins/block-attr-customizer/#reviews)
 *  [Постављање](https://sr.wordpress.org/plugins/block-attr-customizer/#installation)
 * [Изградња](https://sr.wordpress.org/plugins/block-attr-customizer/#developers)

 [Подршка](https://wordpress.org/support/plugin/block-attr-customizer/)

## Опис

HTML Attributes Customizer for Blocks adds an **HTML attributes** panel in the block
sidebar. Enter one attribute per line as `name="value"` (double quotes), or a boolean
attribute as a single name (for example `inert`).

Attributes are stored on the block as JSON objects: `htmlbacAttributes` and `htmlbacInnerAttributes`(
for example `{"fetchpriority":"high","data-nolazy":"0"}`). Boolean flags use `true`.

**Merging:** Duplicate names on multiple lines are combined. Values merge with spaces(
semicolons for `style`). `class` merges with the block’s existing classes instead
of replacing them.

**Variables:** Use tokens such as `{{post.title}}` or `{{user.auth_status}}` inside
quoted values. They are replaced when the block renders on the front end.

## Снимци екрана

 * [[
 * **Attributes tab** — HTML attribute lines on a block (one per line: `name="value"`
   or boolean names).
 * [[
 * **Variables tab** — Reference list of variables use inside quoted values.
 * [[
 * **Block editor** — Image block selected with the HTML attributes panel open in
   the sidebar (Attributes and Variables tabs).

## Постављање

 1. Upload the plugin folder to `/wp-content/plugins/block-attr-customizer/`.
 2. Activate through **Plugins** in WordPress.
 3. Edit a block, open the sidebar, and expand **HTML attributes**.

## ЧПП

### Will variables work in the editor preview?

No. The editor shows raw `{{…}}` tokens; replacement runs on the published front
end.

### Can I add my own variables?

Yes. Register a token in the editor reference, resolve it on the front end, then
use it in attribute values as `{{my.plugin.token}}`.

**1. Register the token (shows in the Variables tab):**

    ```
    add_filter( 'htmlbac_variable_definitions', function ( $definitions ) {
        $definitions[] = array(
            'key'         => 'my.plugin.token',
            'group'       => 'other',
            'description' => __( 'Example custom token for HTML attributes.', 'my-plugin' ),
        );
        return $definitions;
    } );
    ```

**2. Resolve the token when the block renders:**

    ```
    add_filter( 'htmlbac_resolve_variable', function ( $value, $key ) {
        if ( 'my.plugin.token' === $key ) {
            return esc_attr( 'hello-from-my-plugin' );
        }
        return $value;
    }, 10, 2 );
    ```

**3. Optional — override the full replacement map in one place:**

    ```
    add_filter( 'htmlbac_variable_replacements', function ( $replacements ) {
        $replacements['my.plugin.token'] = esc_attr( 'hello-from-my-plugin' );
        return $replacements;
    } );
    ```

In the block sidebar, add a line such as `data-example="{{my.plugin.token}}"`.

### Some blocks have an “Inner element” field. Why?

Blocks such as Group, Image, and Video output an inner `div`, `img`, or `video` 
that the outer wrapper cannot target. Use **Inner element** for those.

**Enable inner attributes for more blocks (built-in strategies):**

Built-in strategy keys include `group_inner`, `first_img`, `first_video`, `first_a`,`
first_figure`, and others. Map a block name to one of those keys:

    ```
    add_filter( 'htmlbac_inner_target_blocks', function ( $strategies ) {
        $strategies['core/cover']  = 'first_img';
        $strategies['core/button'] = 'first_a';
        return $strategies;
    } );
    ```

**Custom strategy (when no built-in key fits):**

    ```
    add_filter( 'htmlbac_inner_target_blocks', function ( $strategies ) {
        $strategies['my-plugin/my-block'] = 'my_first_button';
        return $strategies;
    } );

    add_filter( 'htmlbac_apply_inner_strategy', function ( $block_content, $entries, $strategy, $block_name ) {
        if ( 'my_first_button' !== $strategy || 'my-plugin/my-block' !== $block_name ) {
            return $block_content;
        }
        if ( ! class_exists( 'WP_HTML_Tag_Processor' ) ) {
            return $block_content;
        }

        $processor = new WP_HTML_Tag_Processor( $block_content );
        if ( ! $processor->next_tag( 'button' ) ) {
            return $block_content;
        }

        foreach ( $entries as $entry ) {
            $name = isset( $entry['name'] ) ? (string) $entry['name'] : '';
            if ( '' === $name ) {
                continue;
            }
            if ( null === $entry['value'] ) {
                $processor->set_attribute( $name, true );
                continue;
            }
            $processor->set_attribute( $name, (string) $entry['value'] );
        }

        return $processor->get_updated_html();
    }, 10, 4 );
    ```

## Прегледи

Нема рецензија за овај додатак.

## Сарадници и градитељи

„HTML Attributes Customizer for Blocks“ је софтвер отвореног кода. Следећи људи 
су допринели овом додатку.

Сарадници

 *   [ NEERAJ K ](https://profiles.wordpress.org/neerajk1409/)
 *   [ Midnay ](https://profiles.wordpress.org/midnayws/)

[Преведите „HTML Attributes Customizer for Blocks“ на свој језик.](https://translate.wordpress.org/projects/wp-plugins/block-attr-customizer)

### Заинтересовани сте за градњу?

[Прегледајте код](https://plugins.trac.wordpress.org/browser/block-attr-customizer/),
проверите [SVN складиште](https://plugins.svn.wordpress.org/block-attr-customizer/)
или се пријавите на [белешку градње](https://plugins.trac.wordpress.org/log/block-attr-customizer/)
преко [RSS-а](https://plugins.trac.wordpress.org/log/block-attr-customizer/?limit=100&mode=stop_on_copy&format=rss).

## Белешка о изменама

#### 1.0.1

 * Fix Group block inner attributes applying after `wp_restore_group_inner_container`
   and other `render_block_core/group` filters (priority 999).
 * Hide Group “Inner element” UI when the inner wrapper is not used (block themes
   with theme.json, flex layout).
 * Run general block rendering at `render_block` priority 999 so other filters run
   first.

#### 1.0.0

 * Initial release.
 * HTML attributes panel in the block sidebar with `htmlbacAttributes` and `htmlbacInnerAttributes`(
   JSON objects).
 * Merge duplicate attribute names; boolean attributes without `=`.
 * Dynamic variable tokens on the front end.
 * Inner element support for blocks such as Group, Image, and Video.

## Мета

 *  Version **1.0.1**
 *  Last updated **2 дана раније**
 *  Active installations **Мање од 10**
 *  WordPress version ** 6.0 или новије **
 *  Tested up to **6.9.4**
 *  PHP version ** 7.4 или новије **
 *  Language
 * [English (US)](https://wordpress.org/plugins/block-attr-customizer/)
 * Tags
 * [block-editor](https://sr.wordpress.org/plugins/tags/block-editor/)[blocks](https://sr.wordpress.org/plugins/tags/blocks/)
   [custom attributes](https://sr.wordpress.org/plugins/tags/custom-attributes/)
   [gutenberg](https://sr.wordpress.org/plugins/tags/gutenberg/)
 *  [Напредни преглед](https://sr.wordpress.org/plugins/block-attr-customizer/advanced/)

## Оцене

No reviews have been submitted yet.

[Your review](https://wordpress.org/support/plugin/block-attr-customizer/reviews/#new-post)

[See all reviews](https://wordpress.org/support/plugin/block-attr-customizer/reviews/)

## Сарадници

 *   [ NEERAJ K ](https://profiles.wordpress.org/neerajk1409/)
 *   [ Midnay ](https://profiles.wordpress.org/midnayws/)

## Подршка

Имате нешто да кажете? Потребна вам је помоћ?

 [Види форум подршке](https://wordpress.org/support/plugin/block-attr-customizer/)