Questions tagged [gutenberg-blocks]

515 questions
4
votes
1 answer

How to get the image links from Gutenberg block gallery and add them as html data attributes to a button in wordpress

I'm using gutenberg gallery block inside a post and I'm trying to create a button which contains all of the image ids in the gallery block as html data attributes such that later when I output the content to the page I can have access to those ids…
4
votes
0 answers

How to disable the toolbar of a declared Gutenberg InnerBlock element in a template?

I am trying to design a custom Gutenberg block using InnerBlocks with a template. I want to disable each control in the toolbar of a 'paragraph' innerblock in that template. I have searching but I didn't find a solution. Maybe it's more…
Luis Correa
  • 174
  • 1
  • 6
4
votes
1 answer

How to use a Wordpress Gutenberg block programmatically into the theme?

I'm developing a wordpress theme 100% based on Gutenberg blocks. Some pages are built directly on the editor (eg. home page), but other pages (eg. search results) need to be coded. I want to show my search results using a post grid block, for…
Alan Tygel
  • 307
  • 2
  • 14
4
votes
2 answers

WooCommerce Blocks - Add short product description to product grid

So I'm using the new WooCommerce Blocks for the first time. On the homepage of my website I've included the "ProductBestSellers" block and the "ProductOnSale" block. Both of these blocks show a grid styled layout for either best selling products or…
Kevin D.
  • 315
  • 2
  • 19
4
votes
1 answer

How do I import/use wp.blockEditor correctly?

I'm trying to write a Gutenberg-Block using create-guten-block. When I run it, I get a number of warnings in the console that a few elements I'm using are deprecated: deprecated.min.js?ver=2.6.1:1 wp.editor.RichText.Content is deprecated. Please use…
4
votes
2 answers

Gutenberg repeater blocks using ESNEXT

I've been working on creating my own custom Gutenberg repeater block with a text & link input field. I've only seen ES5 samples like this and this. I've been working on creating my own version of those samples for close to 8 hours now and I'm…
4
votes
2 answers

How to get the site root URL when using Wordpress gutenberg wp object

I just created my first gutenberg block plugin using the npm package create-guten-block. The edit function looks like the code you see below. But it gives a 404 not found on the apiFetch() call because the website lives in a folder, not in the root…
4
votes
1 answer

Prevent wp.hooks.addFilter() from Running on Certain Custom Post Types in Gutenberg

I have been tasked with preventing addFilter() from running on certain custom post types using the new Gutenberg API and not any WP PHP. It's currently fed into the editor.PostFeaturedImage hook, meaning it fires every time the Gutenberg editor…
4
votes
1 answer

How to create multiple meta fields in gutenberg block

I need to create a wordpress Gutenberg block that will allow me to insert some data as name and surname, company name, the best sentence from the references. So far I managed to create a Gutenberg block that is saving one text field.…
Dariusz
  • 193
  • 1
  • 12
4
votes
1 answer

Registering multiple custom gutenberg blocks in a plugin with webpack build

I am working on a plugin that bundles multiple custom gutenberg blocks and I am using the @wordpress/scripts npm module to build with webpack. Works great so far, but checking the console when working in the editor gives me errors about blocks being…
Vortac
  • 508
  • 3
  • 10
4
votes
1 answer

How to access advanced custom field values within a gutenberg block?

I have a custom post type with a few advanced custom fields. I'm trying to access these custom field values from within a Gutenberg block. I've added the following to my register_post_type function 'show_in_rest' => true, 'supports' =>…
4
votes
4 answers

How to receive className with ServerSideRender of Gutenberg?

I'm trying to render a block from PHP with ServerSideRender as follows: js file: /** * WordPress dependencies */ const { __ } = wp.i18n; const { registerBlockType } = wp.blocks; const { ServerSideRender } = wp.components; /** * Internal…
4
votes
2 answers

WordPress Gutenberg, update post content programmatically

I have been starting to testing out Gutenberg editor with both ACF and custom blocks. And I have been looking around to solve my problem but I couldn't find anything about this topic (Maybe my google skills is not good enought) But my case is…
zarex360
  • 312
  • 4
  • 16
4
votes
1 answer

How to provide class with multiline element gutenberg RichText block?

I'm using following code for gutenberg RichText block el( RichText, { key: 'editable', tagName: 'ul', multiline: 'li', className: 'list-group', onChange: onChangeContent, value: content, …
Rameez Iqbal
  • 507
  • 1
  • 5
  • 24
4
votes
1 answer

Gutenberg custom block with responsive images

I followed this tutorial on how to build a custom WordPress Gutenberg Block: https://neliosoftware.com/blog/how-to-create-your-first-block-for-gutenberg/ This first block is nice, but I would like to use a custom images size in this block. This…
Luke
  • 127
  • 2
  • 11
1 2
3
34 35