Only this pageAll pages
Powered by GitBook
1 of 14

GB Extras

Loading...

Getting Started

Loading...

Loading...

Features

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Loading...

Quick Links

GB Extras

Welcome to the GenerateBlocks Hacks Add-on

GB Hacks is a series of tweaks and enhancements to GenerateBlocks.

Wrap Multiple Blocks in a Container

Select a group of blocks and wrap a container around them.

With GB Hacks, you can select any group of blocks and conveniently wrap a container around those items.

You'll need to select two or more blocks in order for this option to appear. To wrap in a Container, click on the vertical ellipses symbol and find the option to "Wrap in Container."

Once done, the blocks you've selected should now be in a Container block.

GenerateBlocks can already convert a select group of blocks to a , but only if they are all core GenerateBlocks blocks.

Container block

Add Adobe Fonts to Typography Options

Add Adobe Fonts to GenerateBlocks with the help of a plugin.

The plugin adds a new menu item under the Appearance settings in the admin.

You'd enter your Adobe Fonts project ID, and the GB Hacks plugin will show the available fonts in the Typography section in the GenerateBlocks block settings.

Just a note that GB Hacks is also compatible with the Adobe Fonts extension (paid) for the Blocksy theme.

With the help of the (free), you can easily add your Adobe Fonts to WordPress.

Custom Adobe Fonts plugin

Finding the Plugin's Settings

Finding the plugin's settings are easy and straightforward.

Finding the plugin on the Plugins screen

While on the Plugins screen, search for GB Hacks. Click on the Settings link to visit the admin settings.

Finding the plugin in the GenerateBlocks menu

Alternatively, you can find the Hacks menu under the GenerateBlocks top-level menu item.

Installing the Plugin

Install from the WordPress Admin

  1. Log into your WordPress admin (i.e., your dashboard)

  2. Go to Plugins->Add New

  3. Go to Upload

  4. Upload the gb-extras.zip file

  5. Install and Activate the plugin

After activation, you can find the plugin's settings in the Dashboard under GenerateBlocks->Hacks.

Install via FTP

  1. Download the plugin zip file of the sales email you received

  2. Unzip the plugin zip in a place you can remember for the next steps

  3. Log into your FTP program of choice for your website

  4. Upload the unzipped folder into wp-content/plugins

  5. Log into your admin dashboard

  6. Head to the plugins screen

  7. Search for GB Extras.

  8. Activate the plugin

After activation, you will be taken to the plugin's settings screen.

Pattern Importer

Paste in a pattern and download images in one go.

Pattern Importer

The Pattern Importer block allows you to paste and display any block pattern code in the block editor. It is specifically designed for GenerateBlocks, but it can also accommodate other patterns.

Any remote images found in the pattern will be downloaded locally, and the image source will be updated.

Why download remote images? Using remote images is not ideal because the images are not in the site owner's control and can't be compressed or cached. Remote images can also be deleted or modified by a third party. Hosting the images locally on your site prevents any of these conflicts.

In addition to gathering the remote images, the Pattern Importer also replaces the GenerateBlocks uniqueId attributes to prevent style conflicts. If you've ever duplicated a block and had style conflicts, this will alleviate any matching unique IDs.

Adding the Pattern Inserter Block

You can find the Pattern Inserter block where you can find the other GenerateBlock blocks, which is grouped in a GenerateBlocks category.

To copy a pattern, select the blocks that are part of the pattern, click on the vertical ellipses symbol, and click "Copy blocks." This will copy the block pattern code to your clipboard.

You can now paste the pattern code into the Pattern Inserter block. If there are a lot of images, this may take a few minutes to finish. Once imported, the Pattern Inserter block is removed and replaced with the converted pattern.

Wrap in Container Option in Block Settings
Blocks Wrapped in a Container
Adobe Fonts in the GenerateBlocks Typography Section

GB Hacks comes with a free 5-site license: Please .

visit the plugin page

Block Editor Commands

Block Commands in the Block Editor are super useful.

Block Commands are a new addition to WordPress, and are becoming more useful and powerful as the feature progresses.

Using CMD+K in the block editor will bring up a search modal very similar to Spotlight on a Mac.

From there, you can type in a few keywords and be presented with some shortcuts.

In this case, the shortcuts are links to the various GenearateBlocks setting panels, but more can be created via feature requests from customers.

For example, we're planning on introducing a way to save an SVG asset from a command in the block editor.

There are no settings for the Commands at this time.

Set the Headline Block as the Default Block

The Headline block is very versatile and makes a great default block.

Instead of an empty paragraph block, the default will be an empty Headline block. You can still use your favorite slash commands within the Headline block.

Transform Group Blocks to Containers

Converting one or more blocks into a Group is a great way to combine blocks into one logical group. However, the Group block doesn't have the extensive sizing and dimension support that the Container block does. Therefore, it's sometimes necessary to want to convert a Group block to a Container block.

This feature works upon plugin activation, and there are no options for this feature at the moment.

At this time, the Container block will not inherit any styles from the Group block.

Add Styles to Post Types

GenerateBlocks does its best to load styles for post types, but non-public ones are problematic.

With non-public post types, like layout builders that come with certain themes, GenerateBlocks has a tough time generating the styles needed as it is technically never rendered on the frontend.

While visiting the admin options for GB Hacks, you can enable certain post types, so that GenerateBlocks can generate the appropriate styles for the custom type.

Generate New Unique IDs for a Block

Generate new unique IDs for a copied block.

For a single block, if you need to reset the unique IDs, you can do so in the block's context menu.

Why generate new Unique IDs? GenerateBlocks uses the unique ID attribute of its blocks to do style targeting. If you copy/duplicate a block, sometimes the old unique ID carries over, and modifying one block changes the other. With an updated unique ID, the block can be style-independent of other block styles.

When generating new Unique IDs, the conversion works recursively, so any child blocks will also have their unique IDs reset also.

If you need to change the Unique IDs for a group of blocks, wrapping those in a Container block and generating the new Unique IDs for the Container block is recommended.

Within the GB Hacks admin options, you'll find that you can make the default block.

If you have a block that's in a , you can now convert that to a .

the Headline block
Group block
GenerateBlocks Container block
GB Extras Admin Screen
GB Hacks Settings Screen on the Plugin's Page
Hacks Menu under GenerateBlocks
Pattern Importer Block
Pattern Inserter Icon and Block
Copy Blocks Option
Shortcut Commands in the Block Editor
Set the Default Block to Headline
Headline Block as Default
Transform From a Group to a Container
Add Post Type Support to Hidden Post Types
Generate New Unique IDs option
LogoCustom Adobe Fonts (Typekit)WordPress.org
Custom Adobe Fonts Plugin
LogoAdobe Fonts - BlocksyBlocksy
Adobe Fonts Extension by Blocksy
GB Extras Admin Panel