Giving views-generated pages from Drupal unique titles to improve site SEO

There is a higher priority ‘Title found on more than one page’ SEO checkpoint in Monsido that highlights webpages with duplicate titles. Many times pages generated by Drupal Views will have duplicate titles and most of the pages in the Pharmacy site failing that checkpoint are caused by Views.
There is a Metatag: Views sub-module that ships with the main Metatags module that can fix the issues be giving Views pages unquie titles. A webpage title is the text entered in the <title> tag, can be different from the main page <h1>, and isn’t always seen easily in all browsers. Internet Explorer 11 still shows the page title in the top of a window. The Metatag: Views sub-module allows you to set the page title independenly of the main <h1> heading.

In Views UI the Metatag: Views sub-module adds a new Meta tags area in you view where you can override the page title.  Then in the Page Title field you can use tokens to give the views-generated page a unquie title. For example you could use:
[view:title] [page:title]
or
[view:title] [site:name]
Many times views generated pages will just use the View Title casing a lot of pages with duplicate tiles. Enabling the Metatag: Views sub-module and setting an override with tokens can fix the duplicate title SEO problem.
See this Advanced Page Titles Using Drupal Views article for more information.

Adding a node ID as class to the tag in Drupal 8

One thing I discovered recently in my college’s Drupal 8 site was that the node number CSS class that used to be applied to the <body> tag was missing. In Drupal 7 there was a unique node ID class and it looked sort of like this:

<body class=”html not-front not-logged-in no-sidebars page-node page-node- page-node-8471 node-type-article news-newsreleases context-news”>

Having this unique node number CSS class was useful for cases when specific pages needed custom styles applied.

By default, Drupal 8 seems to add no such class to pages. To get them back I added a snippet of code I found on a Drupal.org post. I found it was easiest to use:

 /**
* Implements hook_preprocess_html().
*/
function themename_preprocess_html(&$variables) {
if ($node = \Drupal::request()->attributes->get(‘node’)) {
$variables[‘attributes’][‘class’][] = ‘page-node-‘ . $node->id();
}
}

in my theme’s sitetheme.theme file.

There is also a Node Class module that might help accomplish the same objective, adding unique CSS classes to a page. It’s a simple module that allows users to add custom CSS classes to any node through the node/add interface.

After adding the snippet of code above to my sitetheme.theme file I was able to target a faculty profile page that needed custom styling. Previously, without a unique CSS class, there no way to target that specific page.

Ohio State Drupal Users Group Meeting – March 22, 2018

The Ohio State Drupal Users Group is having its March 2018 meeting in 141 Sullivant Hall (the Collaboratory) on Thursday, March 22, 2018, 3:00 pm to 5:00 pm. One of the topics of discussion with be Drupal site hosting, which will probably get into hosting on cloud platforms like Pantheon or Acquia. The university also runs a hosting service that’s available for Ohio State Colleges and Departments to use. The OCIO hosting service offers some Drupal-specific information about installing, backing up, and restoring Drupal 7 and Drupal 8 websites. In Drupal 8, drush commands can be used to create backups and migrate a site from a development account to a production account. Cloud hosting services, like Pantheon or Acquia, also offer DEv, Test, and Live (production) environments and methods to move (deploy) site data between them.

 

There is a Sullivant Hall Collaboratory and Rotunda Reservation Request form available that other groups from the university can use to reserve that space.

 

Creating a multi-column mega menu with the Drupal Superfish module 

The Superfish module for Drupal 8 includes a multi-column option to create mega-menu style drop-down menus. Before installing the module be sure to download ver. 2.x of the Superfish library. Initially I had ver 1.x of the JS library and it didn’t have the styles for mega-menus.

‘.sf-multicolumn-column’ is one of the main mega-menu styles in superfish.css from ver. 2.x.

After installing the Superfish module I created a Superfish block in D8’s Block Layout area for my example site’s top-nav main-menu. In the Superfish main-menu block that I created I set the Start from depth to 1 and the to Levels to 2. See image.Superfish block settings

Here are some other articles about using the Superfish module for mega-menus:

Creating a mega menu (multi column) as shown in the demo – From 2011.

Superfish Mega Mensu – From 2/18/13.

Caveat: It was noted that if a parent menu item does not contain any children it will break the Superfish columns layout.

How to create Drupal multi-column sub-menus (Megamenus) with Superfish – From 2013.

The ZT megamenu module is a another option for creating multi-column menus an has an alpha version for Drupal 8. I haven’t had the chance to evaluate this module yet. More site seem to be using Superfish so that method might be more standard.

Jon G.