# Possible to have custom class name for gutenberg blocks?

**URL:** https://forum.pinegrow.com/t/possible-to-have-custom-class-name-for-gutenberg-blocks/6857
**Category:** Feature Request
**Created:** [August 26, 2022, 9:40am UTC](https://forum.pinegrow.com/t/possible-to-have-custom-class-name-for-gutenberg-blocks/6857 "2022-08-26T09:40:52Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![Pinegrow\_Learner](https://avatars.discourse-cdn.com/v4/letter/p/df705f/32.png) [@Pinegrow\_Learner](https://forum.pinegrow.com/u/Pinegrow_Learner)
#### Post date: [August 26, 2022, 9:40am UTC](https://forum.pinegrow.com/t/possible-to-have-custom-class-name-for-gutenberg-blocks/6857/1 "2022-08-26T09:40:53Z")

</div>

Hi,

Current class name for a custom block:  
 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/4/450185e7995dd2c4333421fcccd13fee5529be1e.png)

What I wish for:  
 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/c/cb547e750ac2785217f6041640adaf1d91939378.png)

I don’t use default gutenberg styling. I remove all the preloaded gutenberg css from a fresh wp installation. Any way to be able to use block just with a class name instead of wp-block+theme name+block name+custom class?

---

<div class="post-metadata">

### Author: ![Pinegrow\_Learner](https://avatars.discourse-cdn.com/v4/letter/p/df705f/32.png) [@Pinegrow\_Learner](https://forum.pinegrow.com/u/Pinegrow_Learner)
#### Post date: [August 26, 2022, 10:00am UTC](https://forum.pinegrow.com/t/possible-to-have-custom-class-name-for-gutenberg-blocks/6857/2 "2022-08-26T10:00:19Z")

</div>

There is an \_\_experimentalSelector in gutenberg which might be related to this. [Introduction to WordPress’s Global Styles and Global Settings – Riad Benguella](https://riad.blog/2021/05/05/introduction-to-wordpresss-global-styles-and-global-settings/)

---

<div class="post-metadata">

### Author: ![Pinegrow\_Learner](https://avatars.discourse-cdn.com/v4/letter/p/df705f/32.png) [@Pinegrow\_Learner](https://forum.pinegrow.com/u/Pinegrow_Learner)
#### Post date: [August 26, 2022, 10:34am UTC](https://forum.pinegrow.com/t/possible-to-have-custom-class-name-for-gutenberg-blocks/6857/3 "2022-08-26T10:34:05Z")

</div>

Solved. I was able to achieve it via a filter. This post guided me to the filter. [Rename class names in Gutenberg blocks - poolghost.com](https://poolghost.com/rename-class-names-in-gutenberg-blocks/)

Filter name is blocks.getBlockDefaultClassName

```auto
const setClassToBlockWithDefaultClassName = (className, blockName) => {
    if (blockName === 'theme-name/myblock') {
        return 'myblock';
    }
    
    return className;
};

wp.hooks.addFilter(
    'blocks.getBlockDefaultClassName',
    'your-namespace/block-filters',
    setClassToBlockWithDefaultClassName
);

```

@matjaz Can Pinegrow add support for this filter in the editor? So we tick an option and enter our custom class name.

---

<div class="post-metadata">

### Author: ![matjaz](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/matjaz/32/5_2.png) [@matjaz](https://forum.pinegrow.com/u/matjaz)
#### Post date: [August 26, 2022, 1:33pm UTC](https://forum.pinegrow.com/t/possible-to-have-custom-class-name-for-gutenberg-blocks/6857/4 "2022-08-26T13:33:13Z")

</div>

@Pinegrow_Learner why not just add the class “myblock” to the HTML element where the block is defined? The exported block top element will then have both the default WP class and “myblock”.

---

<div class="post-metadata">

### Author: ![Pinegrow\_Learner](https://avatars.discourse-cdn.com/v4/letter/p/df705f/32.png) [@Pinegrow\_Learner](https://forum.pinegrow.com/u/Pinegrow_Learner)
#### Post date: [August 26, 2022, 1:36pm UTC](https://forum.pinegrow.com/t/possible-to-have-custom-class-name-for-gutenberg-blocks/6857/5 "2022-08-26T13:36:29Z")

</div>

@matjaz Yes. I know that. I don’t want the default WP class as I don’t use any default gutenberg styling. I also prefer clean source for better readability. Above filter works well and only show my custom class. It will be nice if you can integrate the same in the block options.
