Firm Up That Backend: Easy Exercises for a Usable Admin Interface

The first time that I ever worked with Drupal was actually as a content editor. I have never seen, heard of, or interacted with this CMS. And to be honest, I hated it. I dreaded having to work in it at all. Everything in the administrative user interface that I, as a content editor, was working with was left to the Drupal defaults. Even when developers take time to modify the administrative interface, often they have difficulties empathizing with first time users, to create something better for users of all skill levels.

As a Drupal developer, I encourage clients to spend a little time and attention on the administrative workflow and customizing it to meet their needs. Even the smallest tweaks can make a big difference in giving content administrators, who have never worked with Drupal before, confidences to do their job without assistance. This also means that current content administrators need to spend less time training and hand-holding other content creators as they start working within the Drupal system. Here are some recommendations on how you can tighten-up the administrative experience, particularly on Drupal 7 websites.

Warm Ups

These warm ups are really basic, but really effective things that you can do that can make a big difference to content creators.

1. Use the administration menu
2. Dropdowns allow users to easily and quickly get through the system.
   
   
3. Add help text on fields, and descriptions on content types, taxonomies, and contexts. Most importantly be consistent.
4. Check that structure and naming make sense to people who don’t know Drupal

Exercise 1: Customizing the Workflow

It is important to do an intake with the client about their internal business workflow, and once that is done draft a workflow within Drupal that has custom permissions and access based off of that. This would include determining the roles required for their business, and any custom permissions those roles need.

By setting specific roles and permissions, content administrators can focus on only the tasks that they need to complete. In addition, removing functionality that we do not want specific roles to have allows us to prevent unintentional “breaking” of the site, or access to privileged content/functionality.

• Taxonomy Permissions: Vocabulary Permissions per Role
• Field Permissions: Field Permissions
• Content Types: Content Access

After customizing the permissions for each roles, and therefor eliminating unnecessary functionality for each role, content administrators can focus on their specific tasks.

You can easily test out all your new permissions is by using Masquerade, which allows you to quickly switch between users.

Exercise 2: Admin Views with Views Bulk Operations

Administration Views overrides the default content, users and taxonomy system pages using Views Bulk Operations (VBO). In D7, the default content page includes the option to filter by content type and status. When VBO is added to the mix, content administrators can search for the title, filter by type, author, status and vocabulary. This not only gives a more robust search and filter functionality on these pages, but also adds functionality to bulk update content values.

For Drupal 8, the content admin page is build with Views and a junior VBO that made it into core. It can, and should, be customized for the particular needs of the site. However, it no longer requires additional modules.

Exercise 3: Custom Entity Ordering

There are many use cases where entities need to be able to be ordered arbitrarily. My preference for these instances is to use Nodequeue because it has an easy drag and drop interface, it supports translation and it allows for separate permission between editing and ordering the content.

 

There are some occasions where you not only need custom ordering of entities, but also to create hierarchy between them. In this case, I recommend DraggableViews this will give you the drag and drop interface that I find convenient from Nodequeue, but will also allow the creation of parent-child relationship between nodes.

Exercise 4: Grouping similar fields

I recommend using Field Group to clean up the edit page. Here you can group common fields together to make large content types into manageable chunks of fields. For example: having all file and image fields in a table labelled “Media” or all taxonomy reference fields in a tab labeled “Related Content.”

Exercise 5: Managing Field Dependencies

Conditional Fields allows you to show and hide fields based on the values of other fields. This ability to hide and display fields, allows you to keep the edit page from becoming unnecessarily cumbersome. It is ideal for situations in which you only need certain parts of the content sometimes. In these situations, it also helps to keep the website unbreakable.

For example, if you have a piece of content that allows for an image to appear when the content is Featured, then you can optionally show an image field only when the content is already marked as Featured.

Exercise 6: Cropping Images

To give content creators full control over how image styles and the Drupal system manipulate photos I like to add in Manual Crop. This allows content creators to crop images in the Drupal system after uploading them to a file field. It will maintain the aspect ratio set by the image styles, which helps to keep the design bulletproof. However, it means that there are not arbitrary decisions being made about the composition and cropping of the final imagery.

Exercise 7: Trim Down the Options

Override Node Options allows permissions to be set to each field within the Authoring information and Publishing options field sets on the node form. This means that if users don’t have permissions they will not see some of the default Drupal options like “Promoted to front page.” Most Drupal website do not use these pieces of default functionality and they can be distracting to content creators.

Exercise 8: User Friendly Select Lists

Chosen is a jQuery plugin that allows select lists to be more user friendly. Instead of just a listing of clickable items, you can search through the list and easily add and remove multiple items from lists that allow for multiple values. This is particularly useful on select lists where you have a lot of options.

Exercise 9: Character Counts

Word counts on text fields are really effective ways to keep content from breaking the design. To help with character counts (specifically, with relaying them to content creators)Maxlength is a very valuable option. It shows a helpful countdown of how many characters are left within the text field, and it even color codes it.

Exercise 10: Updating and Reverting Content

Diff along with Workbench Moderation allow users to easily change between different revisions of their content. Workbench Moderation allows editors to save draft revisions of content without publishing them provides for basic content review workflows before content goes live. When reviewing the differences between revisions Diff illustrates what changes were made to the content.

Exercise 11: Configuring the WYSIWYG

The majority of these options aren’t even included in the allowed HTML tags for Filtered Text. This means that developers were not expecting them to be used, and should a content creator attempt to use them the content would not appear formatted correctly on the front-end of the website. Instead of expecting content editor to ignore the cornucopia of options before them, the unnecessary WYSIWYG options should be eliminated.

This is mostly unnecessary in D8, since the defaults there are far more logical and minimalist.

Exercise 12: Linkit

Linkit creates a significantly richer linking interface and functionality for content creators than is traditionally provided. Traditionally, if a content creator wants to reference another piece of content and link to it, they would have to go find the URL for that piece of content and create the link manually. On top of being overly cumbersome, this process is also brittle long term. Should the title of the content change or the URL change, the link could be broken and lead end users to a 404. WIth Linkit you can easily create links in the WYSIWYG and fields by searching the Drupal site for the title of the content. Not only is this easier on content creators, it also means that if content is updated and title or URL change the link will automatically update and still link to the correct content.

Exercise 13: Custom Dashboard

Using Workbench in concert with Login Destination allows you to redirect users (by role) on login to a dashboard that gives them an at-a-glance look at their websites content. Workbench is modular and fully customizable, meaning that you can add specific functionality to the dashboard that best fits your company's workflow and content creator needs.

Cool Down

Adding an administrative theme add a final polish to the interface. Adminimal is one of the administrative themes for D7 and D8 that I find is a nice clean, modern alternative to Seven. One of the things that I really prefer about Adminimal in particular is that the buttons are color coded green for submit and red for delete. These small tweaks can really help content generators move through the process easily. It is however, recommended that you use the Adminimal Admin Menu with it, instead of the Admin Menu that we mentioned before.