Feeds

Author

Upgrade Your Drupal Skills

We trained 1,000+ Drupal Developers over the last decade.

See Advanced Courses NAH, I know Enough
Sep 23 2018
Sep 23

This is the second post about the latest developments regarding the editorial experience in Drupal 8 based on a couple of presentations at Drupal Europe 2018.

Gutenberg editor

One project that could make a huge difference in the way the editors perceive Drupal could be Gutenberg.

Gutenberg was being presented at Drupal Europe by the Norwegian agency Frontkom. This contrib module integrates Gutenberg, the React javascript editor that originated from Wordpress, into Drupal.

Gutenberg can be enabled on a per content type level and replaces the node edit form with a blank canvas where the editor can create content using Gutenberg blocks as shown in the demo.

By default, various types of blocks are available to the editor, such as headings, text paragraphs, images and Drupal blocks (like the ones for example provided by the Views module). Other Gutenberg blocks can be custom made and the authors are about to launch the Gutenberg Cloud, a library from where blocks via a UI in Drupal can be installed on your website.

What remained unclear form the presentation was how Gutenberg blocks are being stored in the database and whether the individual blocks can be retrieved in a structured way for example to expose it as a REST resource.

The plan is to launch Gutenberg at the end of this year.

The full presentation is available on Youtube:

Improve Paragraphs with lesser known features

More and more site builders implement Paragraphs to let the users build structured content in a very flexible way. Therefore it was great to see Milos Bovan of MD Systems demonstrate at Drupal Europe-about a couple of lesser known features.

Using the following features you can make Paragraphs even better than it already is.

  • Use the style plugin to give each paragraph a specific style that can be used for CSS styling. The style can be chosen from the node edit form.
  • Add paragraphs to a library so you can reuse them elsewhere in the site. A listing is available to show all the paragraphs that are available in the library. You can promote a paragraph to the library and change it once to have it automatically updated everywhere in the site. If you dont want that then unlink it from the library so that the changes do not affect the paragraphs elsewhere.
  • Use the drag and drop mode to make it easier to order the paragraphs on de entity edit form. In combination with the collapse mode you can drastically improve the paragraphs UI which, often can be quite messy.
  • Organize a long messy list of paragraph types creating type groups. In the UI these groups will become available as separate tabs and by using icons for the types you can make the UI a bit more intuitive.
  • Convert paragraph types. This will allow you for example to convert an existing unstructured text field into a structured card paragraph type.

Multistep forms

Multi Step forms are an important feature of a website or application as it gives users a much better experience when submitting their data. It increases the users motivation to finish filling in the form leading in the end to a much higher conversion rate.

The contrib module form steps seems to to a good job in managing the complexity of the multistep form.

Several contributed modules among them Webform, allow building a multistep form but they are often limited in scope, hard to customize or are simply only available for Drupal 7. Alternatively a multistep form can be achieved by writing your own custom code which could at some point lead to an unmaintainable situation.

The form step module on the other allows creating multistep forms by leveraging the new Drupal 8 core feature of form modes. Much like view mode, form modes are different ways of presenting a drupal form (for example a user profile form or a node edit form).

The Form steps modules, as demonstrated at Drupal Europe by the Drupal agency Actency , lets you create workflows where that are collections of different form modes so that you can present the user with a multistep form. Each step in the workflow is linked to a particular form mode of a specific content type. As a result the user creates several nodes (possibly from different content types) when he follows the steps of the multiforms.

The workflow also manages the progress bar of the multistep form, giving the user the option to navigate through the different steps of the form.

The form step seems to provide a robust solution to a feature that many of us would like implement or should starting to implement in our Drupal websites.

Sep 21 2018
Sep 21

When I was at Drupal Europe 2018, I had the opportunity to see the new Drupal core profile Umami being demonstrated. Umami is available in Drupal core since version 8.6 and it aims at demonstrating Drupal’s features.

Umami is an installation profile that shows anyone who is considering using Drupal (so called “evaluators”) what it can do out of the box.

It provides the content (recipes), configuration and the theme (including all resources like javascript, css, images and fonts) for a fictional Food magazine called “Umami”.

Umami Drupal profile screenshot

Umami has been developed by several members of the Drupal community over the last one and a half years and the result is quite impressive. It makes a huge difference from the out of the box experiences that we have become accustomed to in the past. We were used to be presented an empty screen in the layout of default themes Bartik, Garland or even Bluemarine.

It is important to note that Umami only uses Drupal core. So that means that no contributed modules (not even Paragraphs!!), no custom code and no experimental core modules (like the Layout builder) are included.

Besides that restriction, there were many other challenges such as the licensing of web fonts and whether to use British or American standards and wording in the recipes. This makes the end result even more impressive.

Umami is really meant as a demonstration and cannot be used as a starter kit for new sites. Future updates will not guarantee any backwards compatibility.

As soon as they are stable features of Drupal core will be expanded with, among others:

  • media library for easy organizing and adding images, videos and such;
  • layout builder for easy adding block content to a page;
  • content migration for importing the demo content. This feature depends on a CSV migration plugin to become available in core;

The developers did a great job in providing Drupal core for the first time in its history with tasty demo content out of the box!

Sep 18 2018
Sep 18

At Drupal Europe 2018 I had the chance to learn the latest developments regarding the editorial experience in Drupal 8.

Content planner

One improvement that can make a big impact on the daily work of the editors is the Content planner which was being demonstrated by Lukas Fischer of Netnode.

Currently Drupal’s out of the box content overview screen (admin/content) provides a somewhat Spartan experience. Thus the need arose of a more feature rich content dashboard. With that need in mind, the team of Netnode found inspiration in content planning tools like Buffer, Gathercontent, Trello and Scompler.

This resulted in the Content planner project. This contributed module will provide a content planning dashboard that allows editors to easily find the content they need to work on.

Content planner features

Some of the features of Content planner are:

  • a content status giving quick overview of the state the websites content is in
  • a calendar that allows scheduling the publication of the nodes
  • a recent content list giveing the editor quick access
  • a kanban board voor content with columns for the content statuses draft published archived and so forth

De module is quite young and still needs improvement, but it seems useful enough to start using in your projects. By adding Content planner to your website you will probably increase your popularity among your editorial colleagues tenfold!

Autosave form

Another development that could make many editors working with Drupal happy is autosaving forms and resolving conflicts.

The autosave form contrib module was being demonstrated at Drupal Europe by Hristo Chonov of Biologis.

It automatically saves the field values every minute when you are filling out a form (for example a node or a contact form). To be able to do this correctly it bypasses all form validation, disables any implemented forms hooks and keeps the form ID intact so that the normal Drupal form editing workflow is not being disturbed.

At the moment the module is not able to autosave when creating a new node because essential information like the node ID is not available at that moment.

Autosave states are saved per user and it’s disabled when two users are working on the same content.

Conflicts

If multiple users are working on the same content then conflicts may arise. The conflict module aims at resolving those conflicts by comparing the following versions of the content:

  • the initial content;
  • the content that’s being edited;
  • the content that’s stored (which could be the content that’s been edited in the meantime by another user);

Most fields will be merged automatically but fields that have conflicting values are presented to the user so he can choose how to resolve them. The UI for resolving conflicts is currently being re-evaluated and contributions in this area are more than welcome.

If you are looking for ways to improve the editor experience of your projects then put Autosave form and Conflict on your checklist.

About Drupal Sun

Drupal Sun is an Evolving Web project. It allows you to:

  • Do full-text search on all the articles in Drupal Planet (thanks to Apache Solr)
  • Facet based on tags, author, or feed
  • Flip through articles quickly (with j/k or arrow keys) to find what you're interested in
  • View the entire article text inline, or in the context of the site where it was created

See the blog post at Evolving Web

Evolving Web