Dymanic headings in for gutenberg blocks? possible

Pinegrow WP WordPress
1

Hi everyone

I have been tearing my hair our trying to get dynamic headings working as an option with Gutenberg blocks

I am using pinegrow 8.5 with tailwind 3. My aim is to create a custom gutenberg block with an image, a couple of buttons, a content area with rich text so peopel can add a few paragraphs of content.

So far so good!

But the icing on the cake would be to allow the user to choose a heading level, say H1, H2 or H3, then the correct heading with its tailwind classes is displayed to the user on the front end.

I have been asking chatgpt to help but its not been helpful

This is a screenshot of my aim

You can see I have three headings, and i want the user to choose via a select and then corresponding heading is shown, what is the simplest way to get this working?

This is something I really want to nail down as it would be good to do this across all my blocks for SEO

Thank you so much!

Hayden

2

You could use the Block Inner Content for this.

1 Like
3

Hey, this should be possible with block attributes: Adding Attributes and Controls | Pinegrow Web Editor

You could try to create a select control which either changes the Heading type (h1, h2, h3) or you could create the three heading types and control which of these will display.

2 Likes
4

Thank you so much, will give that a go now!

5

Hi Guys this is an update, with a video for more clarity as I couldn’t get it work. I managed to get something together than does what I want it to do, but the UX isnt amazing. Really I just want an input box to add the title with a dropdown selector to choose the heading level.

Check it out here