WordPress Gutenberg and Chamber Dashboard

WordPress Gutenberg and Chamber Dashboard

Getting ready to make the switch to Gutenberg?  Want to be ahead of the game? The good news is that you can download the Gutenberg plugin for free and try it out.  Then, if you decide that you are not quite ready to make the switch full time, you can simply deactivate the plugin to switch back to the WordPress classic editor. Not ready for GB? Switch back to classic editor, here’s how.

Using Gutenberg with Chamber Dashboard plugins

Chamber Dashboard Business Directory Dashboard Classic Layout

As you know, when you open an individual Business Listing with the WordPress classic editor, you can see all of the fields you need to manage each Listing. Scrolling down the page, you can see additional Business Directory fields including:
  • Business Referral
  • Location
  • Social Media Links
  • Billing Information
  • Connected People
  • Logo Upload
  • Excerpt
  • Custom Fields
Plus meta-fields like Featured Image, Membership Renewal Date and Categories on the right.

HINT: If all of these fields are not visible, click on ‘Screen Options’ upper right to display.

Business-Directory-Classic-Editor

Activating Gutenberg Plugin

Once you activate the Gutenberg plugin, the WordPress editor screen will look a bit different.
Business-Directory-Gutenberg-activated
But don’t worry, you can still scroll to see all of the fields you need to manage your Business Directory listings. And all of the meta-data fields are still located on the right.  You’ll just need to click on them to see their details.

HINT: Even with the Gutenberg plugin activated, you can choose to use the classic editor instead.

choose WordPress classic editor for individual post editing
As you can see above, the Gutenberg view of individual Business Listings has changed slightly. But once you click around a bit, you will find that you still can scroll down the page to see Directory fields. And all of your metadata including categories, featured image and Membership Renewal date still appear on the right.

Use Gutenberg to layout your Main Business Directory Page

More good news… Gutenberg includes a ton of really cool features!  We used it to create columns and display category images for our Business Directory…here’s how:
Chamber-Dashboard-Business-Directory-category-pages
Step One With the Gutenberg plugin activated, create a new page. Add a new Gutenberg Block by clicking on ‘Add Block. Select columns. This will give you a new block with 2 columns.
Gutenberg-new-page-add-block-add-columns

HINT: You can change the number of columns by clicking on ‘block’ on the right-hand side!

Step Two Add an image to each column to represent your categories.
Gutenberg-add-image
Step 3 Below the image, add a link to the Custom Business Directory category page that you have setup for this category.
To setup up Custom Business Directory category pages, you will first need to create a category page using the [business_directory] shortcode for each. You can then create some main categories to make it easier for your members to navigate.