Preparing Toolset plugins for Gutenberg. New documentation is online.

March 8, 2018

Gutenberg is a new WordPress editor that will ship with WordPress 5.0. When this happens, we want to ensure that Toolset plugins are fully compatible with Gutenberg. Our new documentation gives you a preview of what to expect, how to test the new features, and what will be available in the near feature.

Watch the video

Documentation on using Toolset and Gutenberg

We are still preparing for our integration with Gutenberg.

Although considerable development remains, you can run the Toolset beta version to use Toolset Types and Views plugins with the Gutenberg Editor.

We have added a section to the Toolset documentation that will help you begin using Toolset with Gutenberg.

How to test Toolset with Gutenberg

  • Install and activate the Gutenberg plugin on your test site.
  • Download Toolset Types version 2.3-b3+ (beta) and install it on your site.
  • Download Toolset Views version 2.6-b3+ (beta) and install it on your site.

Comments or Questions

The last section of the new documentation addresses some known issues and provides frequently asked questions. If you have any other questions on how to use Toolset with Gutenberg, please post them in comments.

What are your thoughts about the new features and the Gutenberg project itself? We are eager to hear your feedback.

 

Comments 36 Responses

  1. Brilliant stuff, just started using Gutenberg, can see it being an amazing interface for the functionality we build with Toolset. We will be the masters of the custom block!

    • Yep, it opens new doors and opportunities. Thanks for your comment David. Good to hear you started using Gutenberg. The Gutenberg core team adds new and new features with each iteration. There is still a lot to do and discover.

  2. Exciting stuff. Thank you for the video.

    Once Gutenberg gets rows and columns then I could see this becoming the preferred way to create a content template or view.

  3. Oh, Agnes, you are again my hero! Thank you for this very useful overview of what you are doing about Gutenberg. I know you guys will take care of us during this almost overwhelming change in WP, but it is a huge, huge relief to me to finally see WHAT exactly is in the works. Really appreciate the news on this and it looks even more exciting than I could have hoped!

    • Thanks Kristin, I’m glad you find this short preview helpful. Personally, I believe that when a big change is coming what scares people the most is the lack of information.

    • Currently there are only issues with inline shortcodes that have attributes. Think about an inline shortcode as a shortcode used in a sentence, for example: “You are currently logged in as [and-here-comes-a-shortcode]”. Our developers are in touch with Gutenberg developers to figure out a way how to sort it out.

      From what we have observed the Gutenberg team is very responsive. They listen to you carefully and won’t dismiss any of your concerns. We hope that by the time Gutenberg gets integrated into WP core these issues will be resolved. Thanks for your question Jacob.

  4. This is the first integration with Gutenberg where the change is actually better than the original. I’m excited about using the new version of Views

    • Nice to hear that Hashim. I’ll pass your feedback on to our developers. Integration with Gutenberg has never been a piece of cake. Gutenberg and the block oriented approach gives everyone lots of new opportunities but there is a long way to go before WordPress existing plugins will fully adopt to that new way of thinking. What needs to be done in the first place is to ensure compatibility. What does it mean? Basically two things:

      1. A WordPress user can perform the same functional task with Gutenberg active. For instance, if the plugin includes an “Add form” button, it’s considered Gutenberg-compatible when it has a block registered for the Gutenberg inserter.
      2. There are no (obvious) errors when the WordPress plugin is active alongside Gutenberg.

      source: Gutenberg Plugin Compatibility

  5. This is excellent.

    I have always hated the HTML editor for content templates and views.

    Not that I can’t write html but honestly we have better tools today. Sticking with html is like never accepting that IDE exists and continue to develop your C++ code in the VI editor….

    When you guys released the Beaver Builder integration, I did not even knew that Beaver Builder existed, and I immediately, got a BB license but it just never really became a good solution after BB focused on their themer plugin.

    But now this is exciting news. Gutenberg has come a long way. It still lacks styling options, but that can be handled in css.

    And Elementor has recently announced that they are releasing their integration for toolset, and makes it possible to rework your gutenberg blocks in elementor.

    So finally it looks like we can get rid of the html editor and move into the future.

    I really look forward to get these tools into my workflow. Gutenberg, Toolset and Elementor.

    • Hello Henrik,
      thank you very much for your feedback. I agree that there’s been a shift to visual design and less and less web developers use pure HTML and CSS. It still makes sense to provide some options for whose who want to fully control the output by using a combination of HTML, shortcodes and CSS.

      What you say about BB, it’s true.

      Referring to Gutenberg lacking styling options. There are pros and cons. Actually G. user can already change colors, font size etc for some blocks. Many web developers are concerned that giving the end user the ability to control styling on a block level will eventually lead to turning WordPress sites into little monsters without any consistent and effective visual identity. I’ve already seen a lot of interest in Gutenberg option on how one can provide a fixed set of color schemes etc. I mean something like this: https://i0.wp.com/matiasventura.com/wp-content/uploads/2017/10/gutenberg-color-palette-hi.png?resize=1200%2C645&ssl=1

      About Elementor. You know that we’ve always been open for a tight integration, don’t you?

      Personally, I like the idea behind Gutenberg. Let’s wait and see what the future holds for us. Thanks again for sharing your thoughts Henrik.

      • Hi Agnes

        Yes I know that You have talked to the elementor team about a integration. And I love that it is finally coming true.

        I also like the concepts about Gutenberg. I was skeptical at first, but that was like 6 montsh ago.

        When you announced, 3 weeks back, that I will be able to layout the content template in GutenBerg, I installed Gutenberg on a test site, and I immediately, saw the potential of what it has moved into.

        Gutenberg is not really a page builder, but a content builder. And I see plugins like Elementor to become a templates/pages builders in combination with Gutenberg and Toolset as the backbone of the website data model.

        So It is exciting times. Sad that Beaver Builder did not see this opportunity, but it is time to move on.

        • “Gutenberg is not really a page builder, but a content builder. ” Yes, that’s what I’ve heard as well. My understanding is that Gutenberg will help to standardize the process of building websites in WordPress, one of the goals it to unify the user interface and other page builders will develop their own features upon it.

          Speaking of Elementor integration. Henrik, do you refer to this announcement? https://elementor.com/upcoming-elementor-v2/

          • Yes I do, and I love the fact that it is the elementor team that is committed to the integration.

  6. Hi Agnes,

    How is this going to work with Divi. I installed the betas and Gutenberg on a test site and now if I edit a template previously set up to work with Divi, I don’t get the Divi builder but rather the Gutenberg interface and now a pile of shortcodes for both Divi and the toolset fields.

    I notice the same scenario if I look at a regular page. It’s fine on the front end of the Divi visual Builder but if I go to the back end I see the rather dumbed down Gutenberg interface and abstractly a pile of shorcodes.

    A lot of the standard backend dashboard panels providing functionality of WordPress are now absent from view, which in essence is a step backwards fro WordPress. The one criticism of the TinyMCE editor was that it lacked a proper IDE style text editor with colour coding for syntax and could handle and maintain tab indentation. The Gutenberg editor doesn’t even include an attempt at this.

    The mind boggles as to why WP 5 is going to introduce a retrograde step backwards with Gutenberg.

      • There is a plugin called Classic Editor that can be used as a workaround to banish Gutenberg if you want to use the old WP backend dashboard. Question is, will we have this option in WP 5?

    • Hi Stephen,
      we will continue our Toolset integration with Divi. We have more and more Divi users interested in using Toolset. Today we have posted a new Divi post. I don’t know what our the Divi team’s plans in terms of the Divi integration with Gutenberg. Thanks for letting us know that you found some issues – I haven’t tested that combination yet. I’ll ask the developer in charge for his option about how to use the two and what are the restrictions.

      The one criticism of the TinyMCE editor was that it lacked a proper IDE style text editor with colour coding for syntax and could handle and maintain tab indentation. The Gutenberg editor doesn’t even include an attempt at this.

      In Gutenberg 2.3 they added the CodeMirror (core library) to the HTML block for syntax highlighting.

  7. I am seeing a slight difference in how the custom HTML block is displayed than in the video. the HTML, Review and Fields and View tabs are up at the top of the page and clicking fields and Views does nothing.

    • Ok. I had the Fix Toolbar to top option checked and the buttons up there the Fields and Views button doesn’t work. Unchecked they do.

      I can see some nice aspects to Gutenberg for small layouts and trivial amounts of editing. I like how the Views block is integrated whereby some settings are available. For more involved work and large amounts of data entry, the older classic editor is more practical. The WordPress are really going to think through carefully what role the Gutenberg editor will play. Its clean cut aspect would make it a good candidate for end user clients to use for data entry in inventories using CPTs. It could be useful as a front end visual editor (like Cred), but would need to be pixel perfect and faithful to the site design so as not to be disconcerting.

      Bottom line. Gutenberg is not up to the heavy lifting afforded in the current classic editor, so incorporating both would be the way to go, with an update to the TinyMCE editor (or replacement at best) to bring it up to a modern IDE standard.

      By the way Agnes. What is the status of integration with Divi? Will this continue?

  8. Some further observations. The show_in_rest option only works on new post types. It kept reverting to the classic editor for a type I already have on my test site.

    I made a new Mag(azine) type, added some fields and applied the show_in_rest option. I must say the layout for the custom post type looks good in Gutenberg in terms of fields. There is a small bug. So I have the following fields:

    Description
    ISBN
    Pages

    These are the fields are what I want but above these is the title field and also the “Write your story” field equating to the content loop. So I uncheck editor in the settings for this post type. But, now the editor reverts to the classic editor, no more Gutenberg?
    When making CPTs, I often turn off the editor/content loop as I want to be specific about labelled fields.

    • OK, I see what is happening. Gutenberg has what they are calling fallbacks if something is not in a specific configuration. Turning off the editor is probably one of those non-conformist moves.

    • Thanks for reporting all these issues Stephen. Much appreciated, especially this one: “The show_in_rest option only works on new post types. It kept reverting to the classic editor for a type I already have on my test site.” I we do need to check that out and address it.

      Thank you very much also for the other issue you have described. Again, the information that you often turn off the editor helps. We will add this test case to our testing matrix as well. Thanks again!

    • Hi Agnes,

      I checked again and it may not be connected to previously created post types but connected to how Gutenberg is set up to “fallback”. I am presuming what this refers to is falling back to what they are now calling the Classic Editor. In my case those old post types had the Editor turned off in settings which must be considered one of those fallback situations. I tested with the Editor of again and Hey Presto Gutenberg popped up when I loaded the back end of my custom posts.

        • Very Good. As you know I am not a fan of Gutenberg. This is another example that illustrates why.

          Other small niggles with Gutenberg (not Toolset). You can see the permalink (only after hovering around mind) but you can’t edit it. Why not? Once you make a title “Nice Page” and save, if you back and change to “Nicer Page” the permalink is stuck at …/nice-page for ever more. I real show stopper would be the following scenario.

          I worked on a large site that lists all the Irish speaking schools in Ireland. Being the case that it would need multi language support we were using WPML. On a number of occasions we might have a School with the the same name, Scoil Padraingh, with one located in Co. Mayo and the other in Co. Galway. We use the school name in the title and want to keep everything terse and to the point and don’t want to be titling the schools Scoil Padraigh (Mayo), Scoil Padraigh (Galway).

          But, titling two pages the same is a source of confusion for WPML when adding an Irish and English translation. Jumping from the English version of Scoil Padraig in Mayo to the irish would sometimes land you up in the Galway version. Hence the requirment to be able to edit of our permalinks. Making the permalinks scoil-padraig-mayo and scoil-padraig-galway was the solution to keep WPML happy and not confused on querying mySQL for translations.

          This and all the other combinations of edge cases is the reason why the way Gutenberg is being introduced is so unpopular.

            • Exactly that. I have been really testing Gutenberg for the last week to understand how it is meant to work.

              On face value it looks a clean and uncluttered, but unfortunately to the detriment of good UX.

              One interesting feature is if you paste from a Word document into the initial first block it automatically converts all headings and paragraphs into paragraph blocks. This is good as it automatically cleans out the extraneous HTML tag garbage we get and and have to fix with the format button when pasting into TinyMCE. It ls also sets up the content for layout and the addition of images and graphics. You do have to go back and redo your headings as every piece of text is converted to a paragraph block.

              It seems that they are using comment tags to delineate blocks:


              Sub Heading

              A little bit of clutter but not as bad os the clutter from a Word/Pages paste.

              I also searched for plugins that offered extra functionality and custom blocks. Any combination of theses seems to cause buggy issues with Gutenberg mainly the disappearance of controls in the hidden UI.

              I kind of feel that they are trying to make a generic page builder to go up against Divi, Elementor et al. and are failing miserably. There isn’t even a proper attempt of visual rendition of the front end, which is where most of those developers have been putting the emphasis.

              This reminds me of my studies on databases where views were created for different users of various abilities. The WordPress core team seem to be missing this simple concept with Gutenberg, that different users have different needs.

  9. Where does Layouts fit in with this? I know that layouts is needed to control the whole page. But it seems that Gutenberg in many ways is a better Layouts. Will Gutenberg enhance Layouts in some way?

    • Hello Steve,
      our main focus now is to make current Toolset shortcodes available as blocks. It means that eventually custom fields, post meta data, Views, CRED forms etc. will turn into Gutenberg blocks. In Gutenberg you can use nested blocks and create multi-column layouts. Once all these Toolset elements are available as blocks you might not Toolset Layouts any more. Think about Toolset Layouts cells as blocks and try to map that approach to Gutenberg blocks.

      • How long do you think that will take before all of those shortcodes are available as blocks? How do you suggest we begin to migrate from Layouts to using Gutenberg?

  10. Hi Agnes,
    Will we still be able to disable the editor in a custom post type? My set-up is a multi-site with each user having a sub-site. They don’t need the editor nor do I want them to have it, it’s useless for their purposes. They only need to fill out custom fields.

    Thanks.