Jun 05 2019
Jun 05

According to Drupal’s community documentation, “The Benevolent Dictator for Life (BDFL),” Dries Buytaert, is the “chief decision-maker for the [Drupal] project.” In practice, as Dries has pointed out, he wears “a lot of different hats: manager of people and projects, evangelist, fundraiser, sponsor, public speaker, and BDFL.” And he is chairman and chief technology officer of a company that has received $173,500,000 in funding. Recently I was wondering, how often does Dries wear his Drupal core code committer hat?

In this article, I will use data from the Drupal Git commit history, as well as other sources, to demonstrate how dramatically the Drupal core “code committing” landscape has changed. I do not intend to tell the entire story about power structures in the Drupal community in a single article. I believe that issue credits, for instance, offer more clues about power structures. Rather, my analysis below argues that the process of committing code to Drupal core is a far more complex process than some might assume of a project with a BDFL.

Understanding Drupal Core Committers

Whereas Dries used to commit 100% of the core code, he now leads a team of core committers who “are the people in the project with commit access to Drupal core.” In other words, core committers are the people who can make changes to Drupal core. We can get an idea about the work of core committers from sites such as Open Hub or the GitLab contributor charts, but those charts omit key details about this team. In this analysis, I’d like to offer more context.

The Drupal core committer team has grown exponentially since the start of the Drupal codebase more than 19 years ago. At present, there are 11 core committers for Drupal 8, and from what I can tell, these are the dates that each new core committer was announced:

Unsurprisingly, one task of a core committer is to commit code. For a Drupal core committer to consider a change to Drupal, the proposed change must advance through a series of “core gates,” including the accessibility gate and the performance gate. Code must pass Drupal’s automated tests and meet Drupal’s coding standards. But even after making it through all of the “gates,” only a core committer can add, delete, or update Drupal code. At any given time, there might be 100 or more Drupal core issues that have (presumably) gone through the process of being proposed, discussed, developed, tested, and eventually, “Reviewed & tested by the community,” or RTBC.

Core committers can provide feedback on these RTBC issues, review and commit code from them, or change their status back to “Needs work” or “Needs review.” Just because core committers have the power to commit code does not necessarily mean they view their role as deciding what code gets into core and what does not. For example, Alex Pott told me, “I feel that I exert much more influence on the direction of core in what I choose to contribute code to than in what I commit.” He said that he views the RTBC queue more as a “TODO list” than a menu from which he can select what he wants to commit.

Many people might not realize that core committers do a lot more than just committing code. On the one hand, as Dries shared with me, “The hard work is not the actual committing – that only takes a few seconds. The hard work is all the reviews, feedback, and consensus building that happens prior to the actual commit.” Indeed, core committers contribute to the Drupal project in many ways that are difficult to measure. For instance, when core committers offer feedback in the issue queue, organize initiative meetings, or encourage other contributors, they do not get any easily measured “credit.” It was Jess who suggested that I work on the Configuration Management Initiative (CMI) and I will be forever grateful because her encouragement likely changed the course of my career.

The core committers play significant roles in the Drupal project, and those roles are not arbitrary. Each core committer has distinct responsibilities. According to the community documentation (a “living document”), “the BDFL assigns [core committers] certain areas of focus.” For instance, within the team of core committers, a Product Manager, Framework Manager, and Release Manager, each has different responsibilities. The “core committers are a group of peers, and are expected to work closely together to achieve alignment, to consult each other freely when making difficult decisions, and to bring in the BDFL as needed.”

Part of my goal here is to show that the commit history can only tell part of the story about the team of core committers. I’d also like to point out that in this article I limit my focus to Drupal 8 core development, and not, for instance, the work of the Drupal 7 core committers, the maintainers of the 43,000+ contributed modules, the Drupal documentation initiative, conference selection committees, or any of the other groups of people who wield power in the Drupal community.

This work is one component of my larger project to evaluate publicly-available data sources to help determine if any of them might be beneficial to the Drupal community. I acknowledge that by counting countable things I risk highlighting trivial aspects of a thoughtful community or shifting attention away from what the Drupal community actually values. Nevertheless, I believe that interpreting Drupal’s commit history is a worthwhile undertaking, in part because it is publicly-available data that might be misinterpreted, but also because I think that a careful analysis reveals further evidence of a claim that Dries and I made in 2016: Drupal “is a healthy project” and “the Drupal community is far ahead in understanding how to sustain and scale the project.”

Who Commits Drupal Core Code?

The Git commit history cannot answer all of our questions, but it can answer some questions. As one GitLab employee put it, “Git commit messages are the fingerprints that you leave on the code you touch.” Commit messages tell us who has been pushing code and why. The messages form a line by line history of the Drupal core codebase, from the very first commit to the “birth” of Drupal 1.0.0, to today.

The commit history can answer questions such as, “Who has made the most commits to Drupal core?” Unsurprisingly, the answer to that question is “Dries”:

However, since 2015 Dries has dramatically reduced his core commits. In fact, he only has 4 commits since October 2015:

If someone just looked at the contributor charts or a graph like the one above, they might not realize the fact that Dries is as committed to Drupal as ever. He spends less time obsessing about the code and architecture and more time setting strategy, helping the Drupal Association, talking to core committers, and getting funding for core initiatives and core committers. In recent years he has dedicated considerable time to communication and promotion, and he has been forthcoming with regards to his new role. He has been writing more in-depth blog posts about the various Drupal initiatives as well as other aspects of the project. In other words, he has intentionally shifted his focus away from committing towards other aspects of the project, and his “guiding principle” is to “optimize for impact.”

Another part of the reason that Dries has had fewer commits stems from the recent shift in effort from Drupal core to contrib. Overall commits to Drupal core have decreased since their highest point in 2013, and have been down considerably since the release of Drupal 8 in 2015:

But once again, we must interpret these data carefully. Even if the total number of commits to Drupal core has declined since 2015, the Drupal project continues to evolve. Since Drupal 8.0.0, BigPipe, Workflows, Migrate, Media, and Layout Builder are just a few of the new modules that have become stable, and the list of strategic initiatives remains ambitious. So while the data may seem to suggest that interest in Drupal core has waned, I suspect that, in fact, the opposite is true.

We can, on the other hand, use the git commit history to get a sense for how the other core committers have become involved in committing code to Drupal core. We can visualize all commits by day over the entire history of the Drupal codebase for each (current) individual core committer:

We get a better sense of the distribution of work by looking beyond total commits to the percentage of core commits per committer for each year. Using percentages better demonstrates how the work of the code committing has become far more distributed (in this chart, "colorful") than it was during the early years of Drupal's lifespan:

You might notice that the chart above does not include past core committers such as the Drupal 5 core committer, Neil Drumm (406 commits), or the Drupal 4.7 core committer, Gerhard Killesreiter (193 commits). I’m more interested in recent changes.

When we shift back to looking at total commits (rather than percentages) we can watch the team grow over the entire history of the Drupal project in the following animation, which stacks (ranks) committers by year based on their total number of commits:

 

One fact that caught my attention was that Alex Pott’s name topped the list for 6 of the last 7 years. But I’d like to stress again that this visualization can only tell part of the story. For instance, those numbers don’t reflect the fact that Alex quit his job in order to work on Drupal 8 (before becoming a core committer) or his dedication to working on “non-technical” issues, such as a recent change that replaced gendered language with gender-neutral language in the Drupal codebase. I admit to a particular bias because I have had the pleasure of giving talks as well as working with him on the Configuration Management Initiative (CMI), but I think the correct way to interpret these data is to conclude simply that Alex Pott, along with Nathaniel Catchpole and Angie Byron, are a few of the members of the core committer team who have been spending more of their time committing code.

We find a slightly different story when we look beyond just the number of commits. The commit history also contains the total number of modified files, as well as the number of added and deleted lines. Each commit includes entries like this:

2 files changed, 4 insertions(+), 15 deletions(-)

Parsing the Git logs in order to measure insertions and deletions reveals a slightly different breakdown, with Nathaniel Catchpole’s name at the top of the list:

Differences in the ranking are largely the result of just a few issues that moved around more than 100,000 lines of code and significantly affected the totals, such as removing external dependencies, moving all core files under /core, converting to array syntax, not including vendor test code, and removing migrate-db.sh.

The commit history contains a wealth of additional fascinating data points that are beyond the scope of this article, but for now, I’d like to discuss just one more to suggest the changing nature in the land of core committing: commit messages. Every core commit includes a message that follows a prescribed pattern and includes the issue number, a comma-separated list of usernames, and a short summary of the change. The syntax looks like this:

Issue #52287 by sun, Dries: Fix outdated commit message standards

Combining all commit messages and removing the English language “stopwords” – such as “to,” “if,” “this,” and “were” – results in a list of words and usernames, with one core committer near the top of the list, alexpott (Alex Pott’s username):

 

Only one other user, Daniel Wehner (dawehner), is mentioned more than Alex Pott. I find it mildly interesting to see that “dawehner” and “alexpott” appear in more commit messages than words such as “tests,” “use,” “fix,” “entity,” “field,” or even “Drupal.” It also caught my attention that the word “dries” did not make my top 20 list. Thus, I would suggest that a basic ranking of the words used in commit messages does not provide much value and is not even a particularly good method to determine who is contributing code to Drupal – DrupalCores, for instance, does a much better job.

Nonetheless, I mention the commit messages because they are part of the commit history and because those messages remind us once again that core committers like Alex Pott do a lot more than commit code to the Drupal project – they also contribute a remarkable amount of code. Alex Pott, Jess, Gábor Hojtsy, Nathaniel Catchpole, and Alex Bronstein are each (as of this writing) among the top 20 contributors to Drupal 8. Moreover, this list of words brings us back to questions about the suitability of a term such as “BDFL.”

BDFL Comparisons

While Dries could still legitimately don a hat that reads “Undisputed Leader of the Drupal Project,” it seems clear that the dynamics of committing code to Drupal core have shifted and that core committers assume a variety of key roles in the success of the Drupal project. During the process of writing this article, someone even opened an issue on Drupal.org to “Officially replace the title BDFL with Project Lead.” Whatever his official title, the evolving structure of the core committer team has allowed Dries to focus on the overall direction of the Drupal project and spend less time involved in choices about the code that gets committed to Drupal core on a daily basis. And it’s a considerable amount of code – since Drupal 8 was released there have been more than 5719 commits to Drupal core, or roughly 4.42 commits per day.

While other well-known free software projects with a BDFL, such as Vim, only have one contributor, numerous other well-known projects have moved in a direction comparable to Drupal. As of this writing, Linus Torvalds sits at #37 on the list of contributors to the Linux kernel. Or perhaps more related to Drupal, Matt Mullenweg, who calls himself the BDFL of WordPress, is not listed as a core contributor to the project and is not the top contributor to the project – that honor goes to Sergey Biryukov, who has held it for a while.

Further, one could reasonably conclude that Drupal’s commit history calls into question a concern that many people, including me, have raised regarding the influence of Acquia (Dries’s company) in the Drupal community. Acquia sponsors a lot of Drupal development, including core committers. Angie Byron, Jess, Gábor Hojtsy, and Alex Bronstein are all paid by Acquia to work on Drupal core full-time. However, I still believe what Dries and I wrote in 2016 when we stated that we do not think Acquia should “contribute less. Instead, we would like to see more companies provide more leadership to Drupal and meaningfully contribute on Drupal.org.” On this topic, the commit logs indicate positive movement: since Drupal 8 was released, Alex Pott and Nathaniel Catchpole – the two most active core committers – have made 72% of the commits to Drupal core – and neither of them work for Acquia. So while everyone in the Drupal community owes a debt of gratitude to Acquia for their sponsorship of the Drupal project, we should also thank companies the sponsor core committers like Alex Pott and Nathaniel Catchpole, including Thunder, Acro Media, Chapter Three, Third and Grove, and Tag1 Consulting.

And the other core committers? Well, I can’t possibly visualize all of the work that they do. They are helping coordinate core initiatives, such as the Admin UI & JavaScript Modernisation initiative and Drupal 9 initiative. They are working on Drupal’s out-of-the-box experience and ensuring consistency across APIs. They are helping other contributors collaborate more effectively and efficiently. They are coordinating with the security team and helping to remove release blockers. The core committers embody the spirit of the phrase that appears on every new Drupal installation: “Powered by Drupal.” I am grateful for their dedication to the Drupal project and the Drupal community. The work they do is often not highly visible, but it’s vital to the continued success of the project.

A deeper appreciation for the work of the Drupal core committers has been just one of the positive consequences of this project. My first attempts at interpreting Drupal’s commit history were somewhat misguided because I did not fully understand the inner workings of the team of core committers. But in fact, nobody can completely understand or represent what the core committers do, and I personally believe that the “Drupal community” is little more than a collection of stories we choose to believe. However, we live in a time where people desire to understand the world through dashboards that summarize data and where we gloss over complexities. Consequently, I feel more motivated than ever to continue my search for data that more accurately reflect the Drupal community for which I have so much respect. (Incidentally, if you are a statistician with an interest in free software, I would love to collaborate.) If we want a deeper understanding of who contributes to Drupal, we need more and better sources of information than Drupal’s “contributors” page. I accept that I will never concoct the magical visualization that perfectly represents “Drupal,” but I am enjoying the search.

Code for this project is available on GitLab. I would like to thank Cathy Theys, Megh Plunkett, Dries Buytaert, and Alex Pott for their thoughtful feedback on earlier drafts of this article.

Jun 05 2019
Jun 05

Guzzle makes HTTP requests easy. When they work, it's like magic. However, as with all coding, getting something to work requires debugging, and this is where the Drupal implementation of Guzzle has a major usability problem - any returned messages are truncated, meaning that with the default settings, error messages that can help debug an issue are not accessible to the developer. This article will show developers how they can re-structure their Guzzle queries to log the full error to the Drupal log, instead of a truncated error that does not help fix the issue.

Standard Methodology

Generally, when making a Guzzle request, it is made using a try/catch paradigm, so that the site does not crash in the case of an error. When not using try/catch, a Guzzle error will result in a WSOD, which is as bad as it gets for usability. So let's take a look at an example of how Guzzle would request a page using a standard try/catch:

try {
  $client = \Drupal::httpClient();
  $result = $client->request('GET', 'https://www.google.com');
}
catch (\Exception $error) {
  $logger = \Drupal::logger('HTTP Client error');
  $logger->error($error->getMessage());
}

This code will request the results of www.google.com, and place them in the $result variable. In the case that the request failed for some reason, the system logs the result of $error->getMessage() to the Drupal log.

The problem, as mentioned in the intro, is that the value returned from $error->getMessage() contains a truncated version of the response returned from the remote website. If the developer is lucky, the text shown will contain enough information to debug the problem, but rarely is that the case. Often the error message will look something along the lines of:

Client error: `POST https://exaxmple.com/3.0/users` resulted in a `400 Bad Request` response: {"type":"http://developer.example.com/documentation/guides/error-glossary/","title":"Invalid Resource","stat (truncated...)

As can be seen, the full response is not shown. The actual details of the problem, and any suggestions as to a solution are not able to be seen. What we want to happen is that the full response details are logged, so we can get some accurate information as to what happened with the request.

Debugging Guzzle Errors

In the code shown above, we used the catch statement to catch \Exception. Generally developers will create a class that extends \Exception, allowing users to catch specific errors, finally catching \Exception as a generic default fallback.

When Guzzle hits an error, it throws the exception GuzzleHttp\Exception\GuzzleException. This allows us to catch this exception first to create our own log that contains the full response from the remote server.

We can do this, because GuzzleException provides the response object from the original request, which we can use to get the actual response body the remote server sent with the error. We then log that response body to the Drupal log.

use Drupal\Component\Render\FormattableMarkup;
use GuzzleHttp\Exception\GuzzleException;

try {
  $response = $client->request($method, $endpoint, $options);
}

// First try to catch the GuzzleException. This indicates a failed response from the remote API.
catch (GuzzleException $error) {

  // Get the original response
  $response = $error->getResponse();

  // Get the info returned from the remote server.
  $response_info = $response->getBody()->getContents();

  // Using FormattableMarkup allows for the use of <pre/> tags, giving a more readable log item.
  $message = new FormattableMarkup('API connection error. Error details are as follows:<pre>@response</pre>', ['@response' => print_r(json_decode($response_info), TRUE)]);

  // Log the error
  watchdog_exception('Remote API Connection', $error, $message);
}

// A non-Guzzle error occurred. The type of exception is unknown, so a generic log item is created.
catch (\Exception $error) {
  // Log the error.
  watchdog_exception('Remote API Connection', $error, t('An unknown error occurred while trying to connect to the remote API. This is not a Guzzle error, nor an error in the remote API, rather a generic local error ocurred. The reported error was @error', ['@error' => $error->getMessage()));
}

With this code, we have caught the Guzzle exception, and logged the actual content of the response from the remote server to the Drupal log. If the exception thrown was any other kind of exception than GuzzleException, we are catching the generic \Exception class, and logging the given error message.

By logging the response details, our log entry will now look something like this:

Remote API connection error. Error details are as follows:

stdClass Object (
  [title] => Invalid Resource
  [status] => 400
  [detail] => The resource submitted could not be validated. For field-specific details, see the 'errors' array.
  [errors] => Array (
    [0] => stdClass Object (
      [field] => some_field
      [message] => Data presented is not one of the accepted values: 'Something', 'something else', or another thing'
    )
  )
)

* Note that this is just an example, and that each API will give its own response structure.

This is a much more valuable debug message than the original truncated message, which left us understanding that there had been an error, but without the information required to fix it.

Summary

Drupal 8 ships with Guzzle, an excellent HTTP client for making requests to other servers. However, the standard debugging method doesn't provide a helpful log message from Guzzle. This article shows how to catch Guzzle errors, so that the full response can be logged, making debugging of connection to remote servers and APIs much easier.

Happy Drupaling!

Jun 05 2019
Jun 05

Hook 42 is headed to Tennessee for our next community event. Not only have we proudly sponsored Drupal Camp Chattanooga, you'll also find us doing a Gatsby.js training as well as giving talks about topics we hold near and dear to our hearts. Come say hello if you're there.

Presentations

Keynote

We're very excited that Adam Bergstein will be conducting this year's keynote in Chattanooga. You don't wanna miss it!

Change is the only constant in life. As technologists, the landscape around us is constantly shifting. We must evolve or become irrelevant. How do we do so? It's a gradual thing, but it also happens so quickly. Together we're going to explore considerations around that evolution and how we can embrace the changes. 

Topics include the limitations of technical skills, a purpose-driven perspective, and evolving ourselves. When evaluating Drupal, Adam shares how the product and community have evolved in the past and opportunities for the future. You can take away some perspective on how to approach change and evolve professionally.

Glitch: Love to learn the web again

Jonathan Daggerhart is talking about one of his favorite community tools - Glitch! You may not be entirely sure what Glitch is, but we promise you'll leave with more excitement than ever for learning new web technologies again. Jonathan will be covering the basics of Glitch, demoing it, and you to use it for fun and profit! Bonus points if you are already using Glitch today.

Man sitting at desk typing on laptop with gatsby.js logo on the screen

Training

Gatsby.js

Adam Bergstein is leading an all day training on Friday, June 7th, diving deep into Gatsby.js. Make sure you bring your laptop, as this training is very hands-on. We're ensuring everyone participating can leave with a more developed sense of what Gatsby.js can do and how you can implement it in the future. In this training session, Adam will go over setting up your environment followed by primers and follow along exercises that cover the following items:

  • Setting up Gatsby
  • Basic GraphQL & Gatsby
  • Test Drupal GraphQL
  • Recipe Listing Page (plus responsive images)
  • Recipe Detail Page
  • Updating Recipe List
  • Deployment

We hope you're ready to get your hands dirty with this training.

See You In Tennessee

We're excited for our trip to Tennessee. Yet again our ambitious team is always rushing to be first in line for the growth of our community. We enjoy trading stories with all of you, which is why it is important for us to share our experiences and methodologies that we've fine-tuned along the way. Chattanooga is just another stop on the community train for the Hook 42 team, and we couldn't be more excited to watch our community learn and grow together. We hope to see many familiar faces this year and make some new friends along the way.

via GIPHY

Jun 05 2019
Jun 05

The unique Drupal Views module allows you to pull the data from the database and display it in any way you wish. As an example, we discussed creating photo galleries with Drupal 8 Views. Drupal’s flexibility is unlimited, so it offers additional ways to customize the content presentation and meet the customer’s precise requirements. One of them is to rewrite the output of Drupal Views fields. Let’s explore it a little bit in the simplest of cases.

Why rewrite Drupal 8 Views field output?

It’s possible to shape your Views like with Legos when using the field-based format in it. You can add only the desired fields of a content type or other entity type. It’s easy to rearrange the fields in any order, hide or show the field labels, configure the fields, and so on. 

However, there are cases when you just need the fields to display differently. The customer may want to merge two fields into one, use the values of one field in another, link fields to specific pages, replace links with icons, and so on — the sky's the limit. 

The solution depends on the case. In more complicated cases, expert Drupal development teams create custom field formatters. In simpler ones, they just rewrite the output of Drupal Views fields via the built-in Views dashboard capabilities. 

Main principles of rewriting the output of Drupal 8 Views fields

When rewriting Views fields, we need to take into account the main principles:

  • The Views format should be configured as field-based.
  • Every field has a “rewrite results” section in settings, which has 6 options:
     

Rewriting Drupal 8 Views field output

  • There are replacement patterns that allow us to use tokens and display dynamic values (for example, the ID of the current node).

Replacement patterns for Views fields

  • We can add fields to Views, hide them from display, and use their values in other fields.
  • The hidden fields whose values we want to use should always be positioned above the ones we want to rewrite in the Views list of fields.

A simple example on how to rewrite Drupal 8 Views fields

Let’s create a view that displays all nodes of a content type. It uses fields and shows content as a table.

Field-based Drupal 8 view

In our rewrite example, we want to:

  • merge the content title and body into the same Views table column
  • add a content editing link that will be displayed as a pretty edit icon with a pencil.

1) Merging two fields into the same column

We will overwrite the title field by adding the body field values to it. We don’t need the body field to be shown — we just need to grab its values. So we create the body field and exclude it from display.

Exclude a Drupal 8 field from display

And we rearrange the fields so the body field is above the title field.

Rearranging Drupal 8 fields

In the title field settings, we choose “Rewrite Results” — “Override the output of this field with custom text.” And then we open “Replacement Patterns” and see the tokens for the title and the body.

Rewriting output of Drupal Views as custom text

We grab the tokens and put them into the text box.

Using replacement tokens in Drupal Views fields

And now our view shows them in the same column!

Merging title and body fields in Drupal Views

 

2) Adding an edit icon that leads to the edit page

We add “The edit icon” field to our content type, and attach the icon itself as a default image. We can move this field to “Disabled.”

Adding default image to a Drupal field

We then return to our view, find this field, add it to the view, and rewrite it so it leads to the content editing page. For this, we select “Output the field with custom link,” go to Replacement Patterns, grab the “node ID” ({{ nid }}) token, and shape our custom link with it:

Rewriting output of Drupal 8 Views fields

Done! We have a pretty edit icon that leads directly to the node editing page.

Drupal 8 view with field output rewrite

 

Let’s rewrite your Views fields exactly as you need

This has been just an elementary example of how to rewrite the output of Drupal 8 Views fields. Your fields will show exactly in accordance with your wishes. It can be done with the built-in Views dashboard options, or with custom field formatters for more serious cases.

All you need is to contact our Drupal support and development team!

Jun 05 2019
Jun 05

Missed some of the blog posts we wrote in May? You can catch up on those you missed or revisit your favorite ones in this quick recap that we’ve prepared. We hope you enjoy!

Interview with Tim Lehnen: When you're trying to make a mark in the digital space, Drupal is your best choice

For the latest post in our Drupal Community Interviews series, we got a chance to talk to Tim Lehnen who has just finished with his position as the interim Executive Director of the Drupal Association, letting Heather Rocker assume the mantle. 

Tim believes Drupal has the potential to be used in any kind of ambitious digital experience, not just the web, but also trending new technologies such as VR and AR. This is also due to its leading position among omnichannel and decoupled solutions. Because of this, it will only continue to evolve and improve.

But our favorite part of the interview was probably what Tim remembers as one of the most notable moments within the Drupal community, when the Canadian company Evolving Web used their DrupalCon sponsorship time for a totally different purpose rather than for commercial promotion. Check out the whole interview to see what they did.

Read more

Optimizing Images with Drupal 8 Core Features

Next up, we have a post on optimizing images with the core features of Drupal 8, written by our developer Tjaša. Tjaša encountered the problem of having to optimize some images in Drupal and discovered that not much had been written on the subject. Staying true to the spirit of Drupal, she decided to share her solution with the community in a blog post that anyone can always have on hand. 

Out of the box, Drupal provides a great tool for optimizing images, called Image Styles. An image with the Scale image style assigned to it will load faster than one with no image styles, as the file size will be reduced; but this might also result in some loss of quality on a Retina display. For such screens, we should use an image style that’s twice as big as the first one.

We can achieve even faster loading times by adjusting the image quality. With the Responsive Images module, we can even fit the dimensions of an image to the specific screen type on which it’s served. For some additional optimization, we can also use lazy loading.

Read more

7 questions you're probably asking yourself when considering Open Social

The third post we wrote in May presents the Open Social Drupal distribution created by the GoalGorilla team. Open Social allows anyone to quickly and easily establish an online community, either with the paid SaaS version or the free open-source one. It offers a wide range of features, the usual as well as the more innovative ones, and a number of extensions for the SaaS option. 

The Open Social team provides a lot of helpful material for using it effectively, e.g. a blog section on community management and a free guide. As a user of the software, you even get a say in the project’s roadmap. 

A number of notable businesses are already using Open Social to empower people from the entire planet to collaborate, for example the UNDP (United Nations Development Programme). The project’s co-founder Taco Potze excellently sums up what Open Social is all about in a quote that we’ve included - you’ll have to go look at the whole post to see what he had to say!

Read more

Interview with our developer Peter, one of the release managers of PHP 7.4

Our final post from last month is another interview - but this time not a Drupal Community interview. Peter Kokot, one of our developers, is a release manager of PHP 7.4 which is coming next week, and he was able to take the time to answer a few questions regarding the role and the new release.

Having always been interested in computers and related stuff, he felt drawn to open source and discovered PHP very early on in his programming career. Apparently he was doing something right, since members of the community actually nominated him to be one of the two release managers

He presented the responsibilities of a PHP release manager, new features that we can expect in the new release (as well as a spoiler for next year’s 8.0 major release!) and some challenges of this release. He also gave us some insight into the RFC voting process of the PHP community. We suggest you go read the whole interview and learn about the upcoming release straight from the horse’s mouth.

Read more

These were all of our blog posts from May. Tune in again next month when we’ll be doing a similar overview of this month’s posts. Cheers!
 

Jun 04 2019
Jun 04

Join us Wednesday, October 2 through Saturday, October 5 at our new venue, The Hotel Shattuck! As always, we promise to deliver the most thought-provoking Drupal content in the Bay Area....we excited to be venturing "off the island" as well.

Another year, another exciting adventure, including:
Sparkling training
Mind-expanding presentations
Mind-altering sessions
Wonky contributions
Loopy socials
Summits galore

Join us as we unroll the 13th year of awesome Drupaliciousness!

Jun 04 2019
Jun 04

Historically, migrating your content management system (CMS) or content platform from one major version of Drupal to the next was nothing short of a Herculean task.

Every new version of Drupal meant rebuilding existing functionality, converting (or migrating) your content, and accepting significant changes along the way. Because of this, it’s become commonplace to see stakeholders want to leapfrog Drupal versions (e.g., 5 to 7, or 6 to 8), to extend the life of both their old and new platforms for as long as possible for the least amount of transitional pain.

But this is no longer the case.

If you’ve been swimming in Lake Drupal for the last year, you’ve already heard the clarion call to prepare for Drupal 9, due to release in June of 2020. Most of the messaging has been tailored towards planning ahead for your migration, regardless of what version your CMS sits on today.

All too often, many of those plans call for waiting until Drupal 9 is ready before migrating away from your older platform… you know, to leapfrog ahead and save yourself the pain of CMS migration more frequently than you need.

And that’s only half the story.

If you’re not already on Drupal 8, the time to migrate is now. Drupal 9’s release within a year marks the end of life for Drupal 7. You could be incurring unnecessary security risks, all manner of technical debt, and a deluge of growing time-to-cost barriers — all while missing out on the most useful Drupal 8 features for marketers and developers like Layout Builder, an extensible media management system, and editorial workflow. Most importantly, Drupal 8 is essentially Drupal 9, so you’ll be ready for that upgrade when the time comes without another major effort.

Read: When the time comes, your Drupal 8 site can become Drupal 9 without migrating again.

TL;DR: Migrate Out of 6 or 7 Before 9 Drops

If you already know you need to migrate from Drupal 6 or Drupal 7, but you’re not sure where to begin, read this primer to help you scope, identify, and take steps to start the process.

If you’re still not convinced why you should already be migrating, here’s why it’s critical to begin migration ASAP.

If you’re on 6

  • Drupal 6 support has already ended (as of February 2016). If you’re still on this version, you’ve got unmitigated security risks that, if left unchecked, could cost your organization unforeseen resources or damages.

  • Migration from Drupal 6 will not be part of Drupal 9 core. It will be deprecated in Drupal 8.8 and removed in Drupal 9 to become a contrib module.

  • Core migration maintainers will manage the contrib module and support it for a while, but it will eventually become community owned. That leaves the future direction of that module unclear.

If you’re on 7

  • Support ends in 2021 (and that’s not too far off!). If you haven’t planned or budgeted for this, it’s time to start now, especially if your budget planning is a traditional calendar year

  • You might have painful memories of past Drupal migration. While previous versions were, in fact, incompatible across migrations, this is not the case from Drupal 7 to Drupal 8

  • This is the “last great migration.” Migrating from Drupal 8 to future versions (Drupal 9 and beyond) won’t require a similar migration effort. Upgrading from Drupal 8 to Drupal 9 will be more or less a drop-in-replacement as a version bump. Relatively speaking, there will be significantly less effort in upgrading from Drupal 8.9 to Drupal 9.0 than in previous core versions.

  • You don’t want to spend the next 12-16 months on an old system that you’re already wanting to upgrade. Just rip the band-aid off now. Drupal 9 is essentially a version of Drupal 8 — so the wait is needless, and will only be more complex and costly when making a two-version jump.

  • When Drupal 7 support is officially dropped, security updates will only be managed by third-party vendors.

[Note for developers: here’s how to navigate some of the more complex aspects of 8 on D7.]

[Note for marketers: even two years ago, we hosted a webinar on the benefits of Drupal 8 for marketers.]

But Drupal 8 Isn’t Drupal 9, Yet

On the day of release, Drupal 9.0 will be the same as Drupal 8.9, but with these significant differences:

  • External dependencies (such as Symfony) will be upgraded to the latest major version.

  • Deprecated code in Drupal 8 will be removed, potentially breaking custom or contrib modules still using that code.

Otherwise, there will be no significant core API breaking changes (as in previous major version upgrades), maintaining all the same core features and functionality. This means that you can effectively upgrade from Drupal 8 to Drupal 9 without overhauling your CMS or migrating content, simply by updating a point release.

Migrating to Drupal 8 now will prepare you for Drupal 9, but you will still need a Drupal 9 readiness plan. Knowing what is being deprecated and how that affects your CMS is essential to your roadmap. However, with a readiness plan in hand, your Drupal 8/9 platform’s lifespan will be significantly increased.

Bottom-line: The thing that you’re waiting for is already here. Don’t cling to an old system that doesn’t meet your needs anymore — and is potentially costing you more time, money, and increasing your security risk. Read Issue #1 of Contributed Magazine, written with marketers and developers (code included) in mind, so they can get the most out of Drupal 8 and it’s soon-to-be baby brother, Drupal 9.

Resource Bank:

Jun 04 2019
Jun 04

One of our recent projects required a progressive enhancement approach for visual changes. Instead of a full end-to-end rebuild of a Drupal theme, a progressive approach can be accomplished with theme switching. Many Drupal 8 projects leverage custom block types, Paragraphs, or Layout Builder to place one or more design components on a page. This provided the client with the ability to split up a larger architectural change into a small set of pages and components that can be gradually rolled out. Of note, such an approach can also serve as a viable solution for A/B testing of visual changes. 

Screenshot of a Drupal 8 layout before and after updates were made

Understanding Context

There are several solutions capable of providing theme switching. One key differentiator is context. Do you want to switch a theme by page, role, language, associated taxonomy, URL parameter, or authenticated/unauthenticated traffic? Context serves as a critical requirement for determining when a theme switches.

In our case, we progressively enhanced a theme page-by-page. We would work on one page, configure the theme to switch for that page, and continue to add pages as our work evolved. Solutions may vary based on the desired context. The rest of the blog post helps explore solutions for page-level context.

Background Research

I explored the following approaches to help solve the problem.

  1. Theme Key module: This is a very popular approach from Drupal 7 sites but did not appear to have a Drupal 8 release and this issue paints a murky future for any sort of use of the module.
  2. Style Switcher module: This offers a block for switching themes, sort of like CSS Zen Garden where you could select the look and feel. This wasn’t quite the context we needed.
  3. Switch Page Theme module: This was most effective for our use case. It allowed both page-level specificity and optionally allowed us to select the applicable roles. It also offered configuration, which was helpful for deploying progressive theme switching with theming changes.

Setting Up Switch Page Theme

It’s basic configuration. No programming is required. 

preview of theme switcher in drupal 8

The configuration page is fairly straightforward. Each rule is demonstrated by a row and can be ordered if there are rules that take precedence over others. The checkbox demonstrates how to enable or disable a rule as needed. Page paths are specified line-by-line per rule, followed by the selection of the displayed theme and the applied roles. 

After saving, going to the various paths should switch the theme as specified. And, don’t forget to export the configuration.

Conclusion

We were able to set up a new theme and gradually build out the various components with a theme switching approach. This allowed us to deploy changes over time instead of deploying an entirely new theme all at once. Switch Page Theme was an easy to use site building solution for us to specify the desired theme switching behaviors.  

Jun 04 2019
Jun 04

Facilitating design workshops with key stakeholders allows them to have insight into the process of "how the sausage is made" and provides the product team buy-in from the get-go.

Join Palantir's Director of UX Operations, Lesley Guthrie, for a session on design workshops. She'll go over:

  • How to choose the right exercises 
  • How to play to the team skill sets
  • Ways to adjust the workshop to fit the needs of the project 

You'll learn how to sell it the idea of the design workshop to stakeholders and collaborate with them on a solution that can be tested and validated with real users.

Jun 03 2019
Jun 03
ReThink Orphanages

ReThink Orphanages is a courageous organization with a benevolent charge, grand ambition, a network of high-powered partners, and a commitment to make the world a better place. The organization is…

Visit Site Witness.orgWitness.org: Using Video to Document and Tell Stories

Witness.org is a Brooklyn-based non-profit that “…makes it possible for anyone, anywhere to use video and technology to protect and defend…

Visit Site NWETC

The Northwest Environmental Training Center (NWETC) is an organization that is committed to helping environmental protections improve their career opportunities. The organization focuses on two…

Visit Site Fred Hutchinson Cancer Research Center eagle-i IntegrationAbout Fred Hutchinson Cancer Research Center

Fred Hutchinson Cancer Research Center’s (FHCRC) Shared Resources core facilities support biomedical research by providing services and expertise that…

Visit Site University of Washington Center for Reinventing Public Education (CRPE)

We originally partnered with CRPE's in-house web manager in 2012. He was familiar with the content management aspect of Drupal, but needed a bit of support with the more intricate ways that Drupal…

Visit Site Seattle Humane Society

We began working with Seattle Humane Society in February of 2016. They had reached out to us because they needed some emergency help with their website. For some reason, their site was reverting…

Visit Site Middle East Policy Council

The Middle East Policy Council (MEPC) is a 501(c)(3) nonprofit organization founded in 1981 whose mission is to contribute to American understanding of the political, economic and cultural issues…

Visit Site American College for Healthcare Sciences (ACHS)

ACHS originally partnered with Freelock in August of 2011 to perform some easy wins on their site. We started with a Freelock Site Assessment and code review of their Drupal 6 website. After that…

Visit Site Peninsula College

Peninsula College reached out to us in 2012 for some emergency work related performance issues on their site and problems with their site crashing. Once we were able to jump in and diagnose, we…

Visit Site Appliance Standards Awareness Project - ASAP

Appliance Standards Awareness Project (ASAP) organizes and leads a broad-based coalition effort that works to advance, win and defend new appliance, equipment and lighting standards which deliver…

Visit Site Georgetown University Qatar

We were contacted by the Georgetown University team in Qatar in late November 2016 regarding several of their sites that were using the Drupal Domain Access module. They had several requirements…

Visit Site Seattle Children's Alliance

Another Drupal 8 site upgrade! In June of 2016 we were approached by Seattle’s Children’s Alliance for a Drupal 5 to Drupal 8 migration. Their main concern was that their Drupal 5 site modules…

Visit Site Fred Hutchinson Cancer Research Center – HANC

We started working with another team at Fred Hutch in early 2016. They contacted us after they were needing some local TLC with their HIV/AIDS Network Coordination global CRM database (…

Visit Site DIYZ.com

We were approached in late 2015 by a marketing/design agency to take over this project. Their Drupal developer was on her way out and they needed some Drupal expertise. The website was just in…

Visit Site Jim Ovia Foundation

We originally worked with the main Jim Ovia stakeholder on a separate project, when she worked with a different giving organization. She then reached out to us in September of 2015 to let us know…

Visit Site World Vision Knit for Kids

When the team at World Vision approached us in late 2015 to work on a few of their Drupal sites, they also had their Knit for Kids website that was in WordPress. They wanted to take that site and…

Visit Site Second Nature Sports

Second Nature Sports is owned and operated by the same folks over at Locker Soccer Academy, so when their previous developer was closing shop, it was just natural to have them roll this site into…

Visit Site Locker Soccer AcadamyLocker Soccer Academy

In December of 2013, our friends at Locker Soccer Academy reached out to us regarding their soccer academy sites, that were already developed by a shop in Colombus, Ohio. The development shop was…

Visit Site mEducation Alliance screenshotWorld Vision mEducation Alliance

The product owners of the mEducation Alliance website contacted us in September, 2015 to provide ongoing monthly Drupal security and module updates. The site is a partnership between…

Visit Site World Vision Chinese siteWorld Vision Chinese/Korean Websites

World Vision decided to partner with Freelock in September of 2015 for their Chinese and Korean websites. Headquartered in Federal Way, Washington – this was a perfect fit! We took…

Visit Site Queen City Yacht Club

Our friends at Queen City Yacht Club approached us in April of 2015 regarding their Drupal 5 website. It was at the end of life and they wanted to upgrade. Their motivations were that they wanted…

Visit Site National Center for Science Education

In June of 2015, our collegue recommended our Drupal maintenance services to the National Center for Science Education. Our colleague was looking forward to large project and just didn't have the…

Visit Site Snoqualmie Tribe

Snoqualmie Tribe contacted us in December of 2014 in desperate need to secure their website. It turns out, they were susceptible to the Drupalgeddon attack and needed the Drupal 7.34 core…

Visit Site Lease Crutcher Lewis

In December of 2013, we were contacted by Lease Crutcher Lewis to take over their hosting. Their site is a great contender for Drupal 8! They were also interested in our Drupal maintenance plan…

Visit Site Bonavita World

In early 2014, our friends at Bonavita came to Freelock requesting that we help manage their main website Espresso Supply. Soon thereafter, they wanted to launch a website for one of their brands…

Visit Site Washington Housing Alliance Action Fund

The Washington Low Income Housing Alliance Action Fund first talked to us about building a new site last October, but they were not ready to proceed. This summer they were finally ready, and used…

Visit Site Makah Community Portal About the Makah Tribe

The Makah Tribe is located in Neah Bay, Washington. They had a custom portal for the Makah Tribe and the Neah Bay Community. Their website is the hub for the community,…

Visit Site Max Dale's Steak and Chop House

Max Dale's Steak House is a popular restaurant a few dozen miles up the road in Mt. Vernon, Washington. If you're not from this state, you might have heard of Mt. Vernon when a major Interstate…

Visit Site IslandWood

About Islandwood

IslandWood is a nonprofit educational…

Visit Site Northwest Wall & Ceiling Bureau

Freelock built an informational website for the Northwest Wall & Ceiling Bureau (NWCB), an international trade organization for the wall and ceiling industry. We delivered a snappy…

Visit Site Totem Ocean

Freelock teamed up with Eben Design to build a new site for Totem Ocean Trailer Express, a shipping company that has two voyages between Tacoma and Anchorage each week. In addition to being a…

I-TECH

The International Training and Education Center for Health (I-TECH), a non-profit collaboration between the University of Washington and the University of California, San Francisco, came to…

Bellingham School District

For the Bellingham School District, Freelock put together a large, multi-faceted Drupal site for district-wide information and standardized sites for schools within the district containing…

Visit Site Olympic Peninsula Tourism Commission

The Olympic Peninsula Tourism Board came to us in early 2009 to assist them in developing a visually stunning and highly functional website in a Content Management System. The site needed to be…

Latitudes in Learning

Latitudes in Learning creates personalized learning experiences that engage people and organizations in meaningful interactions with the world. Learning is one of the most difficult activities in…

Visit Site World Class Hunting The Project

The owner of World Class Hunting approached Freelock to launch their website. They had worked with Drupal on a previous project, so they were familiar and enjoyed Drupal. The project…

Visit Site Joey Klein The Project

Joey Klein's team approached Freelock to "rescue" their website. Through the course of their planning stages, the original developers found that they had reached a point where they did…

Visit Site LedgerSMB Web Site

LedgerSMB is an open source accounting and financial package. Freelock has used LedgerSMB for its bookkeeping practically since the project began, forking an earlier open source project called…

Visit Site Hydra Content Management System

Freelock worked closely with Consumer Media Network to create a content management system (Hydra) through which they can track assignments and submissions. We implemented a custom workflow system…

Visit Site DanceSafe

DanceSafe is a non-profit, harm reduction organization promoting health and safety within the rave and nightclub community. Local chapters consist of young people from within the dance culture…

Visit Site Answers for Elders

Freelock developed an informational website for Answers for Elders. Answers for Elders is an online resource for adults caring for elderly parents. Branded as the "Boomers' Online Community to…

Visit Site Ge•cko About Geocko

Geocko builds powerful tools that save time and increase engagement for nonprofit organizations.  They simplify tasks, so organizations can stay forcused on running programs and…

Visit Site I-TECH Drupal 7 Upgrade About I-TECH

The International Training and Education Center for Health (I-TECH) is a center in the University of Washington's Department of Global Health.  I-TECH headquarters in Seattle with…

Visit Site Nightingale-Bamford School About Nightingale-Bamford School

The Nightingale-Bamford School is an independent all-female university-preparatory school founded in 1920.  With grades K-12, NBS is one of the top-ranked private…

Visit Site Lindbergh Gallery About Lindbergh Gallery

Lindbergh Gallery is Erik Lindbergh's venue for selling aerospace sculptures, furniture and other custom art pieces he creates.  Erik Lindberg is the grandson of Charles…

Visit Site RevEquip About RevEquip

The RevEquip team is composed of foodservice consultants experienced in Revit and the creation of foodservice documents.  Revit Families are developed to meet the standards…

Visit Site Nia Technique, Inc. About Nia Technique, Inc.

Nia is a sensory-based movement practice that draws from martial arts, dance arts and healing arts. Nia Technique Inc is built…

Visit Site Crossfit Games/PLY Interactive

In December 2011, Ply Interactive came to Freelock for assistance theming the Crossfit Games site, because of our Drupal expertise and the tight schedule for the project. This site was built from…

Visit Site Alaska Fishing Jobs Center

Scott Coughlin, a 24-season veteran of Alaska's salmon, herring and halibut fisheries, came to Freelock for help getting his site done. We picked up the pieces of the development project, yet…

Visit Site West Seattle Family Zone

The folks at WSFZ needed a directory-based website that was easy to maintain and easy to use. Catering to the families of this popular Seattle-area neighborhood, West Seattle, WSFZ wanted a clean…

Visit Site Cool Day Trips

Freelock was approached to build a website focused on the “Top 50” Day Trips from Seattle, based on rankings and reviews from users. Cooldaytrips.com includes a description of each destination,…

Visit Site Maltby Produce Markets, CSA

Our friends at Flower World came back to us for their latest project, Maltby Produce Markets CSA. Maltby Produce Markets grow a wide variety of fruits and vegetables in their fields, orchards,…

Visit Site Littlestar Prints

Littlestar Prints is one of our favorite sites. It combines some powerful drag-and-drop photo editing in the browser with e-commerce. We got to use both of our favorite software packages--Drupal…

Visit Site Organic Materials Research Institute (OMRI)

Another large scale project by Freelock Computing, the Organic Materials Research Institute tested our abilities to work with a variety of sources and the Drupal system. The project brought their…

Visit Site TerraBella Flowers - Organic Florist in Seattle

TerraBella Flowers & Mercantile specializes in European garden-style designs, using an assortment of local, organic, and sustainably grown flowers and is based in the Greenwood neighborhood…

Visit Site RadioFrame Networks

RadioFrame Networks came to Freelock in late 2008 for a web development project aimed at bringing their existing corporate static site content into the Joomla CMS. We worked with their existing…

WestSide Baby

WestSide Baby, in partnership with the Puget Sound community, provides essential items to local children in need by collecting and distributing diapers, clothing, toys and equipment. They partner…

Visit Site Booktrope

Booktrope's goal of getting online books to as many people as possible (for free!) was a project right up our alley, fitting nicely with our open source foundation.

From the beginning, we…

Visit Site Robinson Newspapers

Robinson Papers hired us to build a centrally-managed web site with different personalities for each of their papers but shared control. We built out a sophisticated system in Drupal, with…

Visit Site Riverview Community Church

Riverview originally came to Freelock to design and develop a website that would serve the needs of their rapidly growing church community. Originally a simple Joomla deployment, we have since…

Visit Site Phytec America

In early 2008, Phytec America brought Freelock on to maintain its Linux server systems and add an additional server. We configured a new server as an internal mail and file server, and converted…

Visit Site BlueView Technologies

BlueView Technologies initially hired us for Linux server administration in 2007. We have worked extensively with BlueView, expanding their IT infrastructure from one server which did everything…

Visit Site Running Wild Spirit Zen Cart

Running Wild Spirit is one of our earliest Zen Cart projects and has greatly contributed to the success and growth of their business. Based out of the small town of Maltby an hour and a half away…

Visit Site Seattle Jobs Scraper System

SeattleJobs.org hired Freelock to implement a system to scrape job listings from their customers' web sites. SeattleJobs.org lists jobs from about 45 member companies. In order for Seattle Jobs…

Visit Site Outdoor Research

Outdoor Research, an outdoor gear manufacturer, hired us to build their main public web site, along with a full administrative back end. We implemented a system that imports product data from…

Visit Site P5 Group Website

When P5 Group was looking to create a dynamic website, they looked to Freelock Computing to help. Using Drupal as a CMS platform, we created a site with multiple access levels for their wide…

Visit Site An XML-based Report Browser

One of Freelock, LLC's ongoing customers needed a web front-end for a proprietary reporting tool. This reporting tool could be configured to generate reports that ended up in Microsoft Excel.…

Custom Client Extranet

One of Freelock, LLC's ongoing customers needed a password-protected site that actually provided different content to different users, depending on the company or user group the user is part of…

Single-Source Help System

Over the course of creating help systems for multiple clients, Freelock, LLC developed a set of scripts that manage browse sequences, tables of contents, and cross-references for help systems.…

Jun 03 2019
Jun 03

By nature, menus are complicated. They’re not easy to work with, build or style, and yet they are probably the single most important navigation element of any website. Despite their complication, they need to be perfect to serve their purpose. A menu can make or break a website. They can make your browsing experience a pleasant one, or can drive you to leave a website frustrated and likely never to return.

When it comes to menus and forms, it is best to let Drupal dictate the direction rather than build them independently of Drupal. By adhering to Drupal’s best practices we can save a lot of time, effort and frustration. For example, rather than writing your menu’s markup before you see it being printed by Drupal, it is best to build your menu in Drupal and see what the markup looks like. Then you can use Drupal’s markup as a starting point for writing your menu’s markup. 

This is going to be a lengthy post (mostly because it includes a lot of code snippets), but this article will cover all you need to accomplish the following:

Build a multi-level menu component in Pattern Lab

Let’s start by building a pretty straight forward multi-level menu component in Pattern Lab. If you’ve used Pattern Lab or KSS Node you know most components require at least three files: 

  • .twig for the component markup and logic,
  • .yml or json for the component data or dummy content
  • .css or scss for the component styles
  • In some cases you may also need a Javascript file
     

For more in-depth explanation on building and integrating components read our blog series.  
Note: This series is over two years old and many things have changed since then, but the basics of building a component still apply.

Building the component

If the code above does not look familiar to you it’s probably because you’ve never used a Twig Macro. I will explain the macro in detail shortly, but for now let’s move on to completing the component.

  1. In your theme’s components location create a new directory called main-menu
  2. In the main-menu directory, create the following three files:
    • main-menu.twig
    • main-menu.yml
    • main-menu.scss
  3. Inside main-menu.yml add the code below:
  4. The data above represents an array of items. Each item has 3 key/value pairs: Title, URL and menu_level.  Each item represents a link in the menu.  You may notice some of the links have nested arrays (i.e. below). These represent submenus in the menu tree. The items array above is only intended to simulate the menu’s data for our component. In Drupal the array will be provided when we add menu links to Drupal’s Main Menu.
  5. Inside main-menu.twig add the code below:
  6. Finally add the following styles in main-menu.scss

These styles are as bare as possible. They are simply to make the menu look presentable and could use a lot of improvements. This is what the multi-level menu looks like:

multi-level menu

It’s important to note that the component will simply be used for styleguide purposes. We will create a similar component for Drupal, but we will use the original component above as a base for markup styles and behavior.

Why do we need to create a duplicate component for Drupal?

Drupal provides attributes Pattern Lab does not understand. Rather than over complicating the component, we are going to keep it simple for styleguide purposes while the Drupal version is more elaborate with all the things Drupal needs. This is not required but provides more clarity to the process.

Create a Twig template suggestion for the main menu

Our ultimate goal is to update Drupal’s menu system to render with similar markup as the main-menu component. This will require several steps which we will cover next.

Follow these steps to enable Twig Debugging in your theme. Then, you can inspect your site, which will allow you to see the various template suggestions that Drupal uses to render the page; including your navigation menu. The debug information looks like this:

Under File Name Suggestions notice two template names: menu.html.twig & main-menu.html.twig. The X next to menu.html.twig indicates Drupal is using this file to render the Main Menu. The second file, main-menu.html.twig, is what Drupal is suggesting we create if we only want to alter the Main Menu and not other menus.

Under Begin Output notice the path where menu.html.twig can be found, the example above is pointing to Drupal’s stable theme.

To ensure we only affect the main menu and not other menus on our site, we are going to make a copy of Drupal’s menu.html.twig in our theme and then override it. This is recommended rather than modifying Drupal core’s template. Let’s start:

  1. Copy the menu.html.twig template from core/themes/stable/templates/navigation/ into [site_root]/themes/custom/<your-theme>/templates/navigation/menu.html.twig (if these folders do not exist yet in your theme go ahead and create them).
    Following the golden rule “Never hack core”, we want to make a copy of Drupal’s menu template in our own theme. Replace the core theme’s name with your core base theme if you are not using stable.

  2. Next, In your theme rename the newly copied template to main-menu.html.twig.
    Copying menu.html.twig into our theme will affect other menus. This is why we are renaming the template so it only affects the main menu (main-menu.html.twig). Replace ‘main’ with whatever your menu’s machine name is if you are not using Drupal’s Main Menu. This can be found in Drupal’s Menus page (admin/structure/menus).

  3. After clearing Drupal’s cache, inspect the menu again and you should see the X next to main-menu.html.twig which means Drupal is now using our custom twig template suggestion to render the menu.

Create a multi-level menu in Drupal

  • Let’s make sure we have a menu we can see in Drupal. Let’s create a multi-level menu using the Main Navigation menu (Structure | Menus | Main Navigation).

  • Add as many links as you wish. Be sure to add nested items so we end up with a multi-level menu.

  • In addition, ensure each of the submenu’s parent links are set to “show expanded”. You will see the option on the Add/Edit Link page.

  • Finally, go to Structure | Block Layout and click Configure next to Main Navigation

Customize the template suggestion

Before we look at the code inside menu.html.twig as it may look confusing or not familiar, we are going to move it into the same directory as the main-menu component. We are doing this to make some improvements to the macro.

  1. In the same directory where you created the main-menu component, create a new file called _main-menu-macro.twig (notice the underscore as first character of file name). This file is only for Drupal purposes and we don’t need it to be shown in Pattern Lab. The underscore allows Pattern Lab to ignore it.

  2. Copy all the code from main-menu.html.twig into _main-menu-macro.twig.

The above code is a Twig Macro. Macros are the Twig version of functions. Just like you would write a function in PHP to do something and return something, you can use a Twig macro to generate some output.

Rendering menu with default macro

If we were to use the macro provided by Drupal as is our menu would render at its simplest form with minimum markup and almost no semantic css classes. See example:

The markup above may look different depending on your base menu. The classy base menu may show more markup but it does not make our job easier to style the menu.

Update Drupal’s menu macro to match our component’s markup

Not having the right markup for the menu, or any other element for that matter, can really complicate things for us when it’s time to style. We are going to modify the macro so it matches the markup of the main-menu component, and as a result the styles we wrote for the component will apply to the Drupal menu.

Menu Macro explained

Let’s step through this macro line by line to understand what it does. To keep things simple we are going to ignore all the custom classes we added above and focus on the macro itself.

  • Twig macros can be called from other twig templates; and it's also possible to place the macro within the same twig template from which you call it. The context is used in this case (line 21). So, with this import statement, we imported the macro and set it as a variable called menus.
  • Using the menus variable we then assign a name to it (main_menu), (line 23), which will take the following parameters: items, attributes, and 0). This name can be anything you wish.
  • Now we declare the macro again but this time with its new name, main_menu,( line 25), and pass the slightly modified parameters items, attributes, menu_level. We've changed the menu_level to a variable. If you are wondering where these parameters come from, the comments above the macro code in menu.html.twig provide all these variables.
  • Now that we’ve updated the arguments, we self import the macro again to make use of it (line 26).
  • Before writing any markup, we first check whether there are menu items to render (line 27).
    • If there are items in our main menu we start writing the markup. However, since we may have a multi-level menu, we want to make sure we identify the top level menu from nested (submenus), menus in the tree.  
    • This is where we first check if the menu_level is 0 (zero).
    • If it is the top level menu, we print a <ul> and we pass Drupal’s attributes in addition to our custom class.
    • If menu is not top level (submenus), then we simply print a <ul> with its corresponding class.

Learn more about Macros in Twig Templates.

Looping through the menu tree

Looping through the items array allows us to intersect each item and apply classes or attributes.

  • First we loop through the items array (line 33), and for each item, we print a <li> some classes which can be helpful if we need to style the different states of the menu.
  • For each link in a list item, we pass two things:
    • The node title
    • The node url
  • Inside the list item, we check to see if that particular item has other items or submenus.
  • When submenus exist, we make use of the macro again to repeat the process of printing the menu. This is where the macro saves us from writing duplicate code.
  • For each level of submenus we are increasing the menu_level by 1 and printing it as part of the submenu class. This is handy if we want to target a specific submenu in the tree.
  • Finally, we close all previously open actions/tags (i.e. for loops, if statements, lists, and macro).

RESOURCE: I recently ran into a blog post by Tamas Hajas where he has a great way to address classes and states on a menu. Check it out Drupal 8 Twig: add custom CSS classes to menus

Looking at the rendered menu after Macro improvements

Now that we have a better understanding on how the macro works, and after making the improvements discussed above, the markup for the menu would look something like this:

Integrate the Main Menu component with Drupal’s Menu

The last part of the process is to integrate all the work we’ve done with Drupal, so our Main Menu is rendered with the markup, styles and behavior we implemented when we built the component.  

  1. >In your editor, open [site_root]/themes/custom/<your-theme>/templates/navigation/main-menu.html.twig
  2. Delete all the content in the twig template except for the comments, and then paste the code below into it
{{ attach_library('your_theme/main-menu') }}
{% import '@patterns/main-menu/_main-menu-macro.twig' as menus %}
{{ menus.main_menu(items, attributes, 0) }}
  1. Clear Drupal’s cache
  2. Reload Drupal’s page

Since we moved the macro to the component’s location, all we need to do in the main-menu.html.twig template is to import the macro and provide the parameters the macro expects. These parameters can be found in the twig template’s comments.

If we did our job right, Drupal’s menu should now look and behave the same way as our component. In addition, if you inspect the Drupal page, the menu should reflect the same markup as the main-menu component.

IMPORTANT: If you are using the Main Navigation blog to position the navigation where you want it in the page, you may need to make a copy of the twig template for that block in order to assign the main-menu class the menu needs.  

Drupal Libraries

As a best practice, we should create a drupal library to attach any styles and javascript to our component. See this article for adding CSS and JS to a page or component.

In our case our library would look like this:

main-menu:
  css:
    component:
      dist/css/main-menu.css: {}

This library has already been attached above inside menu--main.html.twig

By doing this any styles we wrote for the component will apply to the main navigation when it’s rendered in Drupal. Drupal libraries have no effect in Pattern Lab.

After completing the steps above, clear your Drupal’s cache and reload your Drupal site. You should see your Drupal menu being rendered with all the styles and markup we wrote throughout this post.

In closing

I’d like to admit that I went about the long way to get the main menu working on both, Pattern Lab and Drupal. There are other ways to accomplish this by using contrib modules such as Simplify Menu (full disclosure, I helped create the module), and perhaps Twig Tweak among several others, however, the approach I took here gives you the most control and that can make all the difference if you are dealing with a pretty advanced or complicated menu.

Jun 03 2019
Jun 03
  • Shriganesh Hegde
  • Date: 03-06-2019

The term Drupal invokes different feelings among different people, based on their professional background or on what they have heard or learned about the CMS . Over the years, Drupal CMS has evolved from a simple tool for hobbyists, to a powerful digital experience platform for Global enterprises. While Dries describes Drupal as a platform for "ambitious digital experiences" (apparently he never loved "for the enterprise" categorization of Drupal), it is commonly referred to as a content management framework which allows for extensibility & scalability through the addition of various user-created modules that build upon its core framework.

Drupal is one of the most popular CMS' currently available & is the preferred choice for government agencies, large associations, non-profits & numerous Fortune 500 companies. This graph compares the trend for the term "Drupal" with another popular CMS "Joomla" over a period of 3 years & it clearly depicts the growth of popularity of Drupal.

But why do large enterprises prefer Drupal? Is it as "easy to use " as they say? Or does the picture below depicts the true story of Drupal? Let us find out.

Drupal - A CMS for Everyone

One of the toughest challenges that Drupal adopters face, whether they are new site owners or beginning developers, is trying to figure out what is hard & what is easy with Drupal. Most of their questions revolve around the ease of use that Drupal as a platform brings to the table. Let us look at some of the basic (yet important) features that Drupal CMS provides to website owners.

Installation

For Drupal installation, more than the “technical knowledge”, you will rather than just need to know how to connect through FTP and install databases. Would you believe me if I say that the installation time of Drupal CMS for a new user with knowledge of general installation of other systems might be less than “One & half minute??”

Maintenance and Upgrades

Drupal CMS ensures that the maintenance and upgrades are easy to handle by the site administrators. The procedures for updating your website include backing up the website and then replacing the files using a web update interface.

Backing up the website takes minimal effort as the site administrator can back up the whole website by downloading only one file which contains the assets of the website.

Drupal also notices the site admin every time an upgrade is required, thus ensuring that the website never misses an opportunity to stay up-to-date. However, if the administrator does not wish to change the version, Drupal CMS also provides security updates for the previous versions.

Community Strength and Contribution

The unofficial tagline of Drupal - “Come for the Software, stay for the Community” speaks volumes about the strength of the community. Functioning well since 2001, the Drupal Community is known for its dedicated bunch of developers and contributors who use, build, teach, document and market the best practices in Drupal. You can find their amazing works on Drupal.org.

Usability

Drupal CMS allows administrators to access any page or a section of the page in visitor mode by clicking on edit. While the core does not include a WYSIWYG editor, you can still get it in the form of a module, replacing all the other editor integration modules. Drupal CMS allows easy editing of pages or sections of a page by creating a simplified experience for the editors and administrators.

Scalability

Drupal CMS is highly scalable with high traffic handling capabilities. Its WebPages are cached indefinitely as the default setting configuration, but can also be manually cached for a specific time. Moreover, functionality area blocks can be cached, thus allowing better traffic handling capabilities for your websites.

Whether it is the extreme traffic spikes on certain occasions or the constant web traffic, Drupal handles all of that with utmost ease. Did you know that the digital experience of Australian Open 2019 was powered by Drupal? Like Dries said “When the world is watching an event, there is no room for error!”

Web 2.0 Features

Drupal CMS is an excellent community platform provider and It outperforms all other options in this particular area. The platform allows a website administrator to set permissions for site visitors to comment on any content of website.

Drupal also facilitates administrators to set permissions on who can edit, create or delete various content types. It can be an article, pictures, videos or any other media files, everything managed by the admin.

Security

Security is a major concern for web properties these days and Drupal leaves no stone unturned to ensure that your website is secure from any possible security breach. Security updates are published on drupal.org and the users are provided a notice every time a new update is released. Drupal’s active community is alert and any security loopholes are remedied very quickly. They also provide references to guide the user in making a site more secure.

User Roles and Workflow

The greatest asset of Drupal CMS is its ability to create any number of user roles and assign different permissions. While Drupal’s core includes two default set of roles, anonymous user and authenticated user, it allows you to create multiple user roles depending upon the content types. Also, granular permissions to each user can be assigned based on content section using the taxonomy function.

How Does Drupal Make Things Easy?

  • Advanced Control of URL: Drupal provides a precise control over URL structure of a page. Each content item which is called node in Drupal can be given a custom URL. Also, the path auto module can automate custom URL structure for each content type.
  • Custom Content Types and Views: Using Views and the Content Construction Kit (CCK), Drupal allows you to create new content type without having to write a single line of code! Yes, any number of custom content types can be created and displayed in many different ways without any code! Some examples of content types that you can create are forum posts, tutorials, blog spots, news stories, classified ads, podcasts, videos and more.
  • Themeing and PHP Template: PHP knowledge for themeing? No, not anymore! Themeing in Drupal can be done with absolutely no PHP knowledge. Drupal CMS uses PHP template theme engine by default.
  • Hook System: This system in Drupal enables you to hook in new modules easily. This hook system is invoked when a particular activity is performed in Drupal. This approach allows Drupal core to call at specific places certain functions defined in modules and enhance the functionality of core. They make it possible for a module to define new urls and pages within the site (hook_menu), to add content to pages (hook_block, hook_footer, etc.), to set up custom database tables (hook_schema) and more.

I completely agree with Dries when he said that Boris nailed it!

While there are some of the best CMS' out there in the market, Drupal is often the best choice, not only for large enterprises, but also for Individuals, small startups, universities, museums and non-profits who are looking to create seamless digital experiences. With its easy to use features and a decent learning curve, Drupal provides an opportunity for organizations to transform digitally, leaving behind their old business processes in dust.

Jun 03 2019
Jun 03

In the battle for insurance customer loyalty, the best customer experience wins. Equipped with a powerful content management system (CMS) like Drupal, insurance web teams are prepared for a competitive landscape crowded with fast-on-their-feet insurtech startups and looming giants of tech, Amazon and Google

The Drupal 7 Versus 8 Debate: A Team Approach 

Drupal 9 is coming. With the release just under a year away, the time is now for insurers’ teams to resolve their internal CMS debate — remain on Drupal 7 or upgrade to Drupal 8?

Bridging the customer experience gap is no small feat. However, insurance business leaders, marketers and developers are tackling the challenge head on. They comprise the team of experience builders with seats at the table for decisions like a CMS upgrade. To forward growth, their technology decisions are prioritized by data security and cost control. Also topping the list of evaluation criteria is a capacity for continuous improvement and swift speed to market of applications and functionality. Business leaders, marketers and developers bring unique approaches to achieve these common goals. In this article, we’ll evaluate Drupal 7 and Drupal 8 through the lens of these three stakeholders.

Current Drupal 7 sites have captured a glimpse of why Drupal is a fit for insurance, but the real power lies within Drupal 8. Of course, the decision to upgrade requires thoughtful consideration and planning. It’s a significant undertaking, particularly for large sites. However, factoring in the robust features of Drupal 8 with the appealing innovation forecast for Drupal 9—and the simple upgrade path connecting the two—insurers are likely to find that the advantages of upgrading far exceed the disadvantages. 

Drupal 7 Versus Drupal 8 for Business Leaders

Business leaders’ roles and responsibilities revolve around improving operating efficiency and cutting expenses. A flexible technology stack is crucial to stay competitive, perhaps even opening doors to collaborate with emerging insurtech startups. 

Focusing on the bottom line, insurance business leaders are understandably concerned with forecasting migration costs. 

Gaining a Competitive Edge 

With Drupal 8, insurers can gain a foothold to gain, and keep, a competitive edge in the market. 

  • Drupal 8 core offers many advantages, including improved performance and a better editorial and developer experience, to close the innovation loop.
  • To support the leap from Drupal 7, Drupal 8 now includes a built-in user interface to streamline migrations and offers more support for multilingual migrations.
  • More accessible web forms and other accessibility improvements in Drupal 8 serve to support legal compliance efforts and extend insurance offerings to the widest possible audience.

Benefits of Drupal 8 

business benefits of Drupal 8

Source: Mediacurrent

The many advancements in Drupal 8 core are reason enough to consider an upgrade, but contributed modules represent the best innovation in the Drupal ecosystem. The brilliant and globally spread Drupal community has shone a spotlight on Drupal 8. Drupal 7 simply hasn’t received the same level of enhancements and attention. Furthermore, passing on Drupal 8 now can also mean missing competitive advantages during the waiting time before Drupal 9. 

Looking ahead, moving to Drupal 8 now will make for an easier transition to Drupal 9. In the words of Frank Sinatra, “The best is yet to come...and won’t it be fine” (or should we say, nine?).   

Estimating Effort and Cost

Insurance business leaders are naturally concerned with total cost of ownership for their Drupal CMS. The migration roadmap is an important factor in that equation. 

Can you take your time to upgrade for Drupal 9? The answer is, technically, yes — but consider both migration and opportunity costs.  After clearing the jump from Drupal 7 to Drupal 8, expect future upgrades to Drupal 9 and onward will be significantly easier. 

Drupal 8 marked the beginning of a new continuous innovation model where advances in functionality are released rapidly on a six-month release cycle. Also, the Drupal 8 architecture is tuned so that a simplified upgrade path awaits to Drupal 9. This approach allows you to benefit from the innovation of Drupal 8 as Drupal 9 brews in the same codebase. 

Mediacurrent’s Drupal 9 Upgrade Guide can help prep your site for the move to Drupal 9. 

Drupal 7 Versus Drupal 8 for Marketers

Insurance marketers of all types, e.g., home, auto and life, view the customer experience as synonymous with digital experience. They have watched customer loyalty dwindle as the market has shifted online, where it’s never been easier to switch providers and shop online for quotes.

Earning Loyalty, Improving Customer Experience

Drupal 8’s appeal to marketers has grown significantly with major releases emphasizing ease of use and customer experience. Insurance organizations like MagMutual have embarked on the transition from Drupal 7 to Drupal 8 to better serve marketing teams:

Our Drupal platform allows our team to adapt to that very quickly to change marketing strategies as we continue to grow and evolve with our customer base.

Sallie Graves, CIO, MagMutual

Catch up on our CIO Interview with MagMutual to see how the organization is bringing new engagement strategies to life on an adaptable platform.

The key to forging deep customer loyalty lies in improving the customer experience from start to finish. In evaluating a CMS platform, marketers need a solution to tighten the reins on data so that it can be applied to the customer experience. 

For Guardian Insurance, Drupal 8 was a savvy place to land. Read Guardian’s Drupal 8 case study to see how they built a data-informed customer experience to win millennial insurance shoppers. 

Our Drupal 8 platform will serve as a foundation as we scale and enhance our web and mobile experiences for customers.

Peggy Maher, SVP, direct to consumer at Guardian Life Insurance 

Drupal 8 and Modern MarTech Stack 

Insurance marketers on Drupal 7 have most likely been with the same platform for a few years. If that rings true for you, consider the strategic doors that an upgrade can open. Think big about your website as a business tool. 

Consider questions like:

  • Does your conversion rate, bounce rate, site traffic and page load time indicate it’s time for a redesign?
  • Do you have a solution for customer journey mapping? Can you see what works, what doesn’t and, most importantly, why to engage prospective and current customers?
  • What usability improvements can help shape the customer experience?
  • Are there any areas of your digital presence lacking in personalization?

Drupal 8 is built for easy integration with your current and future marketing toolkit. Connect marketing automation, email service providers, CRM and more with Drupal 8 as the foundation for your digital experience ecosystem.

Drupal 7 Versus Drupal 8 for Developers

Security 

Developers in the insurance space are tasked with managing the security implications for mountains of personal data and sensitive information. 

We mentioned previously that the developer community has been laser focused on innovation in Drupal 8 —this also applies to security. Major security flaws are first found—and first fixed—in Drupal 8. If that’s not reason enough to contemplate a move to Drupal 8, consider also the security implications of Drupal 7’s impending end of life where core maintainers check out of security duty.  Beware— your site’s data could become vulnerable to hacking and other exploits. 

A study from 2018 found 63% of hacked sites running Drupal had outdated versions when breached.  

Ahead of the Curve 

The Internet of Things (IoT), which includes smart home devices and new telematics solutions, gives insurers a new opportunity to learn from customers to serve them better. Beyond just a website, insurers need to meet customers on their screen of choice. Whether it’s mobile, wearables or smart home devices, screen time is all the time. Drupal 8 core is built with the elasticity to accommodate customers’ devices of today and tomorrow. 

For more considerations from a site builder’s perspective, read 10 Reasons Why You Should Start Your New Project in Drupal 8 on the Acquia Developers blog. 

Conclusion

For insurance providers, digital transformation is where customer experience meets Drupal 8 technology. With a highly proactive community behind the screens, the Drupal project is paving the runway for next-generation customer experiences. 

Drupal 7 to Drupal 8 converts like the State of Georgia and Pegasystems are but two examples of large, complex sites that saw significant gains from their migration. Acquia and Mediacurrent have proudly supported these organizations on their Drupal journey. Watch their migration stories here

Master Your Drupal 8 Upgrade With a Trusted Partner

The final crucial consideration on the road to adopting Drupal 8 is choosing a migration partner. As a leader in Drupal development, strategy and design, Mediacurrent has partnered with high-profile clients ranging from large enterprise businesses to education. Together with Acquia, our talent, tools and processes ensure a smooth and successful migration. Partnering with us will help you establish the personalized digital experiences that capture customer loyalty — leveraging flexible open source technology and with the lock-tight security the industry requires.

Jun 03 2019
Jun 03

Fresh off the inaugural Flyover Camp, co-organizer Karl Kedrovsky talks organizing local user groups, what it means to give back to the community, and why some furniture is timeless.

You've done it once...you've done it one more time than most people, so you can absolutely give a talk or just share some knowledge on the subject.

Jun 03 2019
Jun 03

Astute marketers have stepped up to the concept of the Buyer’s Journey.  Taking the time to understand the full range of client personas and to gain empathy for the distinct phases that clients progress through as they explore and compare solutions, is now a key component of the marketing mix.

Let’s look at the potential for applying the concept of the Buyer’s Journey to a new leadership model that can serve as an essential resource for setting employees up for success.

First: a review of how understanding the Buyer's Journey is at the core of marketing effectiveness.

The exercise of mapping out the Buyer’s Journey produces insights that equip marketers to craft the right messages for the right media at the right time. The Buyer’s Journey also takes into account that not only do clients continue to have choices after the purchase, they now have a social media megaphone for broadcasting their experiences, and as such, there can be dire consequences for not continuing to pay attention after the purchase.  

While there are different models and different terminology to describe the Buyer’s Journey, the table below represents a snapshot of the distinct phases and the general types of marketing and messaging associated with optimizing impact within each. 

Buyer's Journey Snapshot

Phase Strategy Messaging/Media Awareness of need Focus on pain points / gain mindshare Industry-focused content that emphasizes empathy / Social media and sponsorships Consideration of solutions Education / help determine purchase criteria / Offer insight into what it’s like to work with you Emphasize scope and superiority of your offering / Content-rich blog posts, checklists, white papers, webinars, speaking engagements, case studies, trial offers Decision to purchase Validate decision Ease of implementation / training, support, webinars, user guides, community engagement Evaluation / advocacy Continuous added value Superior support, ongoing education and updates, closed Facebook groups, exclusive invitations, surveys, loyalty programs

 

Functional Model

Clearly, the days of the one-size-fits-all marketing campaign is a thing of the past. The bar has been raised and expectations are high for both messaging and solutions that are relevant to and resonate with clients’ specific needs. 

The concept of the Buyer’s Journey has gained traction because it makes sense and it works. It’s built upon genuine empathy and a sharpened focus on human centeredness in the design and delivery of both messaging campaigns and the solutions that they represent. 

Next Frontier: The Talent Journey

Imagine the impact if business leadership applied a similar model to the recruiting and retention of talent.  

Clearly, employees progress through distinct phases as they: 

  • Decide to search for a new job
  • Evaluate their options
  • Prepare for an interview
  • Participate in the interview process
  • Agree to join forces
  • Get onboarded
  • Become proficient in their new role
  • Evaluate the job and the company against initial expectations, 
  • Grow within the organization, and 
  • Evaluate future options.

Essentially these above phases fall within four basic categories:

  • Search
  • Sign on
  • Onboard
  • Empower

The following is a framework for the Talent Journey that mirrors the four phases of the Buyer’s Journey -- recognizing that this is simply a skeletal overview that needs to be refined and fleshed out to factor in the makeup of your team and the requirements of your company.

Talent Journey Snapshot

Phase Strategy Actions Search
Maximum positive exposure

Consistent social media posting, clear social media guidelines for current employees, presence at industry events, networking, incentive programs to encourage current employees to recruit to their sphere

Sign on Clarify expectations
Behavioral assessments that can be validated at the outset to help launch positive working relationships, detailed job descriptions and clarity concerning expected challenges, thorough information concerning benefits and company policies Onboard Set up for success

Frequent check-in along with a formal 30-day, 60-day, and 90-day program that sets goals and encourages issues and obstacles to be dealt with quickly

Empower Encourage stretch goals, remove obstacles, create a path for growth

Training, memberships in industry organizations, participation in industry events, open communication, employee surveys, 360 degree reviews, recognition programs

 

Talent Optimization

Leaders who adopt a Talent Journey mindset commit to paying attention and always being mindful of where team members are on the journey, within the framework of an intentional, empathetic model for connecting. As is true for the Buyer’s Journey, outcomes are optimized when there’s a recognition that different kinds of outreach are best suited for different phases of the journey.

Too often though, once talent has been hired and onboarded (insofar as such a process exists) they’re expected to merge with the culture, meet whatever demands come their way, and suck up any frustrations about the degree to which the actual job is out of alignment with their original expectations. 

To those who are thinking, “That’s too bad. This is business. The focus needs to be on innovation, attracting clients and maximizing profits--not coddling employees…” consider the cost of constant turnover, losing top talent to your competition, or frustrated employees operating at sub-par levels.

Talent Magnets = Great Leaders

A decade ago, when unemployment was teetering around 10 percent, leadership might have gotten away with more cavalier attitudes about cultivating talent. 

In the current economic climate, competing for talent is as critical of a success factor as competing for customers, and here’s the critical point: The competition is not won on the day that they agree to join forces. 

It’s no secret that turnover in tech is rampant. Talent knows their worth. They are mobile, well-connected, want top dollar for what they have to offer. According to Spicework’s recently published 2018 IT Career Outlook, more than one third of IT professionals in the United States are currently on the lookout for a new opportunity. Within your current team, can you accurately identify this 33 percent? Do you know who would be subject to being poached by a competitor if they got a better offer. Do you know who is frustrated and how that’s having an impact on their performance? 

Just as the Buyer’s Journey calls upon marketers to sharpen proficiency in multiple areas in order to optimize targeted effectiveness, the Talent Journey challenges leaders to be firing on all cylinders as they set talent up for success and help to remove obstacles for growth. The Talent Journey is both a model and a mindset that brings a richer dimension to our professional lives, deepening both relationships and the bottom line.

We’d love to hear from you! Do you view the Talent Journey as a workable model? What kinds of successes have you had in applying various components of it? Add your comments below or contact us today for a workshop on a leadership model that serves the specific needs of the talent journeys within your organization.
 

Jun 01 2019
Jun 01

AmyJune Hineline, Open Source Community Ambassador at Kanopi Studios joins Mike Anello to talk about her upcoming Contribution Tour 2019, as she visits numerous Drupal and WordPress events to help train new contributors.

Discussion

DrupalEasy News

Upcoming Events

Sponsors

  • Drupal Aid - Drupal support and maintenance services. Get unlimited support, monthly maintenance, and unlimited small jobs starting at $99/mo.
  • WebEnabled.com - devPanel.

Follow us on Twitter

Subscribe

Subscribe to our podcast on iTunes, Google Play or Miro. Listen to our podcast on Stitcher.

If you'd like to leave us a voicemail, call 321-396-2340. Please keep in mind that we might play your voicemail during one of our future podcasts. Feel free to call in with suggestions, rants, questions, or corrections. If you'd rather just send us an email, please use our contact page.

May 31 2019
May 31

For all its benefits, working remote— as most of our Mediacurrent team does— still has its challenges. 

The one that people ask me about the most is, "how do you keep any kind of work / life balance when your work and home are inseparable?" For me, the answer to this has been what I call my "shutdown ritual." It's basically just how I try to end my workday every day, but I've found putting some thought into a routine has helped a lot to make my evenings more relaxing and my mornings more productive.

In this post, I'm going to cover:

  • what a shutdown ritual is
  • the benefits  of having a shutdown ritual
  • my specific shutdown ritual

What is a shutdown ritual?

So first, what is a shutdown ritual?

A shutdown ritual is a set routine of actions that you perform at the end of each work day to finalize your day and signify that your work day is done.

I got this concept from an excellent book called Deep Work: Rules for Focused Success in a Distracted World, by Cal Newport. 

His core argument in the book is that the most valuable skill in our economy is deep focused work and that is becoming increasingly rare. If you want to set yourself apart, cultivating a deep work ethic is the way to go. He outlines several rules and guidelines you can follow to start cultivating this habit.

One of the tools he recommends is the shutdown ritual.

The bare outline of the shutdown routine that he outlines in Deep Work is:

  1. update all todo lists
  2. read over the todo lists in their entirety (reprioritizing items as necessary)
  3. review the calendar for the next two weeks, make sure any todos required for events are on the todo list
  4. write down a plan for the next day
  5. close everything on your computer
  6. say a magic phrase, like "Shutdown complete" or "I'm outta here"

Newport also discusses the shutdown ritual briefly on his blog: Drastically Reduce Stress with a Work Shutdown Ritual.

Why do a shutdown ritual?

One of Newport's biggest criticisms of modern workers is that we're always on, and because of this, our attention and energy is too dispersed. We can get notifications or just compulsively check Slack or email, even outside of work hours. But deep work requires disciplined attention and energy. If you want to do deep work during the day, you need to make sure you are not constantly doing shallow work (even off the clock). 

Benefit 1: A defined ending

One of the main benefits of the shutdown ritual is having a well-defined end of the workday. Once the shutdown ritual is done, work is done. Don't think about it. Don't worry about it. Don't check email. Don't look at Slack. If you want to be your most productive self, you need to take a complete break until the next work day.

Now it's time to do all the relaxing evening things like feeding your kids and washing the dishes.

When I tell people I work from home, a majority of them say something like, "You must feel like you're working all the time" or "How do you separate your work life from home life?" and I have certainly found it to be a bigger challenge to turn off at the end of the day since I don't really leave "the office." The shutdown ritual helps define the end of the workday and the beginning of being fully present at home.

It has helped me be more productive during the day and helped me have more focused attention with the family after work.

Benefit 2: Confidence in the ending

The important part about the steps in the shutdown routine is giving you confidence that everything you needed to do is done. 

If you're like me, you might be washing the dishes and still be debugging code in your head. Or you might suddenly remember an important email you were supposed to respond to and didn't. Or you might start thinking about a meeting on your schedule tomorrow that you're anxious about.

But the steps of your shutdown ritual should help you capture all these thoughts before you end your workday. You want to capture them and write them down somewhere, so they aren't floating around in your brain all night. 

Sometimes, you might be in the middle of your shutdown ritual and remember something that can't wait until tomorrow. That's fine, go ahead and do it and then start your shutdown ritual over.

Because once your shutdown ritual is over, and a work worry comes into your head, you want to be confident to say to yourself: 

I went through the shutdown ritual. I know that everything important has already been accounted for. Therefore, there is no need to worry.

And move on with your night.

Benefit 3: Having an anchor for other habits

The last benefit I'll mention is that having a shutdown ritual at the end of the day can be a helpful anchor for other habits.

If you have a well-established habit like a shutdown routine, you can leverage it to help establish other habits. James Clear calls this Habit stacking. The idea is that by pairing a new habit with one that already exists, you make it more likely to stick to a new habit.

Some examples of habit stacking with the shutdown ritual:

  • after my shutdown ritual, I will take 5 deep breaths and smile
  • after my shutdown ritual, I will put on my workout clothes and go to the gym
  • after my shutdown ritual, I will call a friend
     

A shutdown ritual can help you end your workday productively and launch a new habit or hobby to make the rest of your life even better as well!

My Shutdown Ritual

Here's what my shutdown ritual looks like. At 5:15pm everyday, I get a friendly message from slackbot to start my shutdown ritual. 

You can set a reminder in Slack like this:

/remind me to 

Time to start your shutdown ritual!

- reconcile timesheet
- check email for anything requiring urgent response
- add new / outstanding tasks to todo list
- check JIRA
- skim task lists
- check calendar for tomorrow
- make a rough plan for the next day

Shut down complete

every weekday at 5:15pm

For me, this is actually about 45 minutes before the end of my workday. I used to have the reminder for 15 minutes before I signed off, but I could never get to a stopping point and do the shutdown in 15 minutes. 45 minutes gives me enough time to start looking for an exit in my current work and to go through the routine.

Here is what is on my shutdown ritual list:

  • reconcile timesheet
  • check email for anything requiring urgent response
  • check JIRA
  • add new / outstanding tasks to todo list
  • skim task lists
  • check calendar for tomorrow
  • make a rough plan for the next day
     

Reconcile Timesheets

I take a look at my time tracking software and make sure all my time is accounted for.

Check Email

I go through my email inbox, responding to anything that is really urgent, and adding tasks to Todoist for anything that is not. My goal is to delete as many as possible.

Check JIRA

I open up JIRA to see what tasks are assigned to me, and add them to Todoist, if they aren't already there. I sometimes remember things I said I was going to do but didn't (like update a ticket or assign to someone else) so if I can quickly do that I will.

Skim Todo lists

This gives me a broad view of what's going on. Sometimes I notice a glaring error or remember something that completely slipped my mind, so I add that here. I also sometimes reorder things based on how priorities changed throughout the day.

Check Calendar

Next, I check my calendar for tomorrow. Do I have any meetings tomorrow that I have a deliverable for? Did I complete the deliverable? Any conflicts?

Make a rough plan for the next day

The last item on my list is making a rough plan for the next day. This really sets me up for success in the morning, and helps prevent a slow, groggy start to the work day. Sometimes I make my plan in Todoist just by setting due dates for todos for tomorrow and putting them in the order I want. Other times I have a simple text file where I make a list. It kind of depends on what projects I'm on and the kind of work I'm doing from week to week.

Shut down

I close all applications on my computer. I put the computer to sleep or shut it down. Sometimes I say "shutdown complete"

Sometimes here I tidy up my desk.

I start singing "It's a wonderful day in the neighborhood" and change into my house sweater and house shoes.

The work day is done. I'll be back tomorrow. 

And that's how I end my days productively with the shutdown ritual.

May 31 2019
May 31

An adapted Pride-themed Drupal Association logo

In June last year, we changed our Drupal Association logo on social media platforms to add a little color for Pride Month and I am really happy to say we will be doing the same again this year.

Since last year, we have introduced better tools for understanding the demographic groups in Drupal and I asked for a report on that. Quite rightly, I don’t have access myself - it is very much locked down. I was interested to see that, of those confirmed users who have filled something into the field (including “none” or “prefer not to answer”), 15.8% have indicated they identify as LGBTQIA. That’s far more than I expected!

We would love to continue to improve our statistics; we're asking everyone to complete the data in the demographics field, even if that is to click “none” - it’s a totally valid and useful response. Go to your user profile, click edit, and find it in the “Personal information” tab.

Finally, whilst the Drupal Association is an educational non-profit and does not advocate policy, I have been personally reminded this week of the extraordinary bravery, friendship, and sheer commitment to overcome challenges by people in the LGBTQIA community and I wanted to help celebrate that in any way we can.

You are strong and you are beautiful. Thank you for being you.

May 31 2019
May 31

How to create a custom Facets query for your Drupal 8 faceted search app

When it comes to allowing users to search a site easily, a faceted search app can be an unparalleled solution. Being able to quickly drill down into search results using specific, easy-to-understand parameters is something that most users now simply expect from any site’s search app.

For Drupal 8 sites, the Facets module makes it relatively simple to create your own faceted search app, whether you’re using the Drupal core Search module or the very popular Search API module to manage your search functionality.

In the case of a site using Search API, the Facets module works particularly well in parallel with more powerful search engine backends like Apache Solr and Elasticsearch. Facets within a search app can take all shapes and sizes, and the Facets module provides a few plugins types that, in concert with each other, can be leveraged to programmatically create any sort of facet you may need for your search app. Because the Facets module relies on the Entity API within Drupal 8, these plugins should appear relatively familiar to most Drupal 8 developers:

  • \Drupal\facets\Entity\Facet
    • Describes the facet entity itself, whose data is received via a widget plugin and parsed by processor plugins
  • \Drupal\facets\Entity\FacetSource
    • Describes the source of the data being fed into the facet
  • \Drupal\facets\QueryType\QueryTypePluginBase
    • Describes the type of query being made against the search backend.
  • \Drupal\facets\Widget\WidgetPluginBase
    • Describes the widget that the user interacts with to control the search UI.
  • \Drupal\facets\Processor\ProcessorPluginBase
    • Describes the processor that translates the user input from the widget into data that can be used within the query.

The Facets module (along with its submodule Facets Range Widget) provides 4 basic query types:

  • \Drupal\facets\Plugin\facets\query_type\SearchApiString
    • The most comment facet query type, based on searching for simple strings.
  • \Drupal\facets\Plugin\facets\query_type\SearchApiGranular
    • Used for numbers-based facets that provide a spectrum of values between a set step size.
  • \Drupal\facets\Plugin\facets\query_type\SearchApiRange
    • Used for queries that allow users to select a range of possible numerical values.
  • \Drupal\facets\Plugin\facets\query_type\SearchApiDate
    • Used for queries to allow users to choose (ranges of) date values.

NOTE: These query types are to be used within the context of a Search API backend, rather than the Drupal core Search module.

So how do we do it?

I’d like to offer a brief example of how you might go about writing your own custom query types for a faceted search app using the Search API and Facets modules.

In our recent scenario, we needed a way to allow users to query against our search backend using numerical values, but in the format of comparing their chosen number value against searchable values using a specific comparison operator. In this case, our users were students who needed to be able to search for specific academic or volunteer programs. They also needed to be able to filter results based on a length of time (in weeks) that would be greater than or less than a specified value.or example, users would need a facet that allowed them to filter results by: any length of time, 1+ weeks, 2+ weeks, 3+ weeks, etc.

With this requirement in mind, the 4 basic query types listed above were not quite up to the task. Instead, we needed to write a custom "Integer Comparison" query type that would take in two key pieces of data. A number to compare values against and a comparison operator with which to make those comparisons. From our example use case above, we only needed the number from the user, because we would be setting the comparison operator (“>=“ AKA “greater than or equal to”) in configuration. However, we wanted to write a generic enough query type that could allow for any basic comparison operator in the future. This is the result:

In the code above, the two key pieces of data (the user-input number and the configuration-defined comparison operator) are $value['int’] and $value['op’]. However, in order to get these two simple values, we also needed to write a custom processor that could receive the raw input in from our facet widget and process that input into those two simple $value['int’] and $value['op'] values.

To understand what’s happening in the preQuery method above, you just need to know that the slider widget we implemented on the frontend had its possible data values encoded in a format like this:

Finally, in the code above, you’ll notice the one method getQueryType(), which is needed to specify which query type the processor should pass its data along to (in this case, our custom integer_comparison query type). In order to make our new query type plugin and processor plugin aware of each other, we need to implement one last hook in our module:

Contributed Customization

We're always looking for ways to customize integrations to fit the specific needs of project goals and we understand that out of the box solutions aren't always going to work. For example, the Facets module itself provides a submodule called Facets Range Widget that allows users to search using a range of numbers or dates. However, the default behavior of this facet assumed the use of a bounded range, as opposed to what we needed, which was an infinite range starting from a definite value. In that case, it was simpler for us to quickly create the exact facet query type that we needed, rather than wrestling with the defaults provided by the Facets module. We were only able to do that thanks to the Facets module’s highly extensible plugin system that leverages the contributed Search API and core Entity API of the Drupal ecosystem. That is why, even when we have a need for custom code, it is always a helpful first step to start from the strong contributed code provided by the Drupal community.

May 31 2019
May 31

Drupal is a great choice for media websites. This is due to easy content editing, flexible moderation workflows, advanced media handling, and much more.

And, of course, media and news websites on Drupal can enjoy unlimited content display options for. Today, we would like to show you one of them that we implemented for our customer’s Drupal website — so-called featured news collections, aka grouped news.

According to this Drupal setup, news on the same topic are grouped together in ways that provide a high level of usability for readers. More details are coming next.

Featured news collections as opposed to standard Drupal setup

Let’s see what makes the grouped news functionality special for news websites on Drupal, and how it differs from the standard Drupal setup:

  • Standard news are represented by Drupal nodes — one node per item. When you open a Drupal node, you see it in full view. When you open another Drupal node — you see another one. They can be grouped together by topic or category if they are tagged with the same taxonomy term. Still, all of them will be opened one by one.
  • On the contrary, featured news collections include multiple news on the same topic. When something happens in the world, they allow the reader to see the situation from all angles, or its step-by-step progress shown by new updates. The display offers a full view of all news items, which is very handy to read.

Featured news collection VS standard Drupal newsThe features of this news setup in more detail

Individual URLs for news items

We provided each featured news page has a general URL that the reader sees in the browser. However, each news item also has an individual direct link. When it is used, the page smoothly scrolls directly to the place where the particular item begins (due to jQuery Animate plugin).

The URL in the browser is also updated to the URL of the particular item. The URL change is achieved through the replaceState() method of the HTML5 History API, which allows developers to change the URL without the full page refresh.

These individual URLs are added to RSS feed and to the sitemap. Each of them also has social share buttons.

When shared, all pieces of news have individual meta tags. When someone follows their individual shared links, the page will smoothly scroll exactly to the place where each of them begins.

social media icons

Individual URLs and SEO

Every SEO expert knows that the same content available at different URls is a bad idea for Drupal sites or any others. We solved this by providing custom functionality that tells search engines to index the featured news collection only. The separate pieces of news will not be indexed or displayed in search results.

Navigation through the page

So the page with featured news has two blocks:

1) the block with news items in full view

If the block with news items has many of them, they will be divided into pages using the pager functionality.

2) the list of titles to navigate between all news items

What happens when a user clicks on a certain news item title in the navigation block?

  • If the item is found on the currently displayed page, the page smoothly scrolls to it and the URL is replaced, as we described above.
  • If it is not found on that page, we query the page that has it, using AJAX. Thanks to AJAX, the page with the full node view is loaded without page refresh. We calculate the position of the news item from the top of the page and animate scroll to it.

Featured news collection — navigation through the pageDesign for mobiles and tablets

News websites on Drupal should be convenient to access from any device. So, for mobiles and tablets, we provided the styling of the navigation block as a fixed floating block that becomes available upon clicks on the floating icon.

Enjoy interesting options for news websites on Drupal!

This was just a simple example of content display options for news websites on Drupal. Anything else is possible exactly in accordance with your ideas. In addition to AJAX for real-time updates, it’s possible to use frameworks like React, Vue, Angular, and so on.

Contact our Drupal team to discuss your news display functionality!

May 31 2019
May 31

Mediacurrent's Rain Install Profile logo

Mediacurrent created the Rain Install Profile to build fast, consistent Drupal websites and improve the editorial experience. Rain expedites website creation, configuration, and deployment.

The Mediacurrent development team is pleased to announce some new updates to the Rain distribution in version 3.0. We have now made Drupal project template easier to use and maintain by splitting Rain content features (all of which are optional) from the main “base” package. This allows developers flexibility in which features they use while still pre-configuring modules that jump-start development.

There are some key changes that we will highlight here:

  1. The Rain package has now been split and renamed to mediacurrent/rain and mediacurrent/rain_features respectively. The latter repository now contains all the optional content features and their dependencies while the base package pre-configures the base installation.
  2. An UPDATE doc has been added to the Rain repository which explains in detail how to update from the 2x branch to 3x. This document will be kept up to date with any future changes that require manual changes or explanation.
  3. A few new dependencies have been added while several less frequently used dependencies have been removed. The UPDATE doc gives further details on what was added or removed and how to upgrade.

Note that the Drupal-project template is only used for provisioning new projects. Any project that currently uses the 2x version of the Rain distribution will not break or be forced to update. Updates to 2x will continue through to Drupal core 8.8 but then be sunset in favor of the 3x branch. Overall the process of updating from 2x to 3x should be relatively painless. 

If you experience any problems updating please file an issue in the official Rain project queue on Drupal.org: https://www.drupal.org/project/rain.

Installing Rain 3.0

To install the Rain distribution, we recommend you leverage our Drupal project template which includes a VM and Guardr security along with the Rain install profile and other tools.

Our recent article entitled “Drupal 8 Rain & GatsbyJS Integration” covered how to install Rain using the project template so we will recap the first step here which remains the same in version 3.0. 

First you will want to create a repository wherever you typically host your Git projects (i.e. Github, Bitbucket or Gitlab). Once you have that setup you can clone Mediacurrent’s repo and point the origin back to your Git repo.

Example:

git remote set-url origin [email protected]:mediacurrent/shortcode_project.git

Next, you will want to initialize the project. You can do that by running the following commands with your local host name and IP.

Example:

composer install

composer drupal-scaffold

./scripts/hobson project:init example.mcdev 192.168.50.4

Finally, to build the project and run the install you can simply run “./scripts/build.sh” which runs composer install as well as the Drupal install. Note that the project README has more detailed instructions but this will give you an idea how to get up and running quickly.

Video Tutorial for Installing Rain

[embedded content]

Related Resources

[Webinar Recording] Rain + GatsbyJS: Fast-Tracking to Drupal 8

May 31 2019
May 31

Open source communities are more about sharing ultimate value rather than just building something. They love to contribute and impact people all across the globe. Open source culture is more than just reusing free code on GitHub to get products to market faster.

The open source culture embraces an approach to software development which totally lays emphasis on all round collaboration and helpful nature, the teams tend to focus more on increased competencies instead of core infrastructure and cross channel implementation.  The culture embraces an approach to software development that emphasises internal and external collaboration, an increasing focus on core competencies instead of core infrastructure, and implementation of DevOps processes commonly associated with microservices and cloud native technologies. 

What are the key traits of an open source community and culture?

A responsibility to contribute 

Open source involves a broad range of technologies and a diverse set of people who bring some or the other expertise to the table. Often people are more inclined towards contributing the best of their individual abilities. They feel the responsibility to contribute and make sure they are often involved in the betterment of multiple projects and are they are often people are members of multiple projects, involving a broad range of technologies. Frequently, member recognition isn’t set by how much they’re paid or what titles they’re called. It’s how much of a headache is solved or endured for others. 

 All round responsibility and accountability

Accountability between members begins when they know each other as people and professionals. It’s especially important to have consistent written contact, ad hoc and scheduled video conferencing, and meeting in person at least once a year to build personal bonds.

Seamless and undeterred Collaboration

Collaboration for an open source organisation culture stretches across multiple areas. Well into domains like organisation goals, cultural fit, and more.

Team members who define together what a cultural fit is demonstrates what's important to the organisation. Just as, a united group of passionate hackers and designers who take part in the joys of community sharing, they want to hire those having like interests and similar ideals.

More inclination towards automation

Automating tasks within an organisational culture is about respecting people’s effort while not wanting them to be distracted from getting the right thing done when needed. 

Organisational members focus ultimately should be on what’s important to them and, in turn, the organisation.

Consistency in everything 

The consistency of people, processes, and management thereof is the glue of an open source organisation culture. Without consistency of action, principles and guidelines flounder despite the best of intentions.

Streamlined Processes

It's extremely hard work to develop fundamentals when shortcuts and hacks so often seem to provide great short-term benefits. However, consistency is the key to positive long-term results.  

For example; there needs to be a detailed and consistent process in hiring for fit, not skills, and for the long-term. Beyond these two key criteria, the candidates should also be demonstrably capable, driven, and passionate for the role to be filled.  

An underlying passion 

The underlying spirit to do good work is hard to find, it comes to you upon due search. And it is more powerful than any other driving force in the professional landscape. You will strive harder and harder for the things which mean something to you and the Drupal community makes you feel connected to their growth, you grow as they grow, which ultimately helps you feel the need to deliver sheer excellence. 

Shared Responsibility

At an organisation, culture becomes the way you work. Through culture, there’s a shared responsibility for good communication and positive results. In communicating with clients and one another, it needs to be timely, considerate, and accurate. 

Drupal: For great community and culture

Drupal has a predefined set of values and principles

Drupal, since its inception was built around a foundational set of values and principles. The agenda was to gather a community of like minded individuals and bring them on the same page about the vision and mission of the product and its roadmap.

Drupal values and principles Source: Dries Buytaert’s Blog 

Drupal’s code of conduct and CWG 

Drupal community's Community Working Group comprises of independent volunteers who strive hard to protect and promote the health of the entire Drupal community, they also help and maintain and keep on track the Drupal Code of Conduct and also act as the escalation body to help mediate conflict between community members. 

What should make you want to contribute to Drupal?

Can you imagine hundreds of thousands of people relying on your code or waiting to get some feedback from you? Their business’s growth is dependent on the advancements you make in your contribution. The more you contribute the better your worth and stance in the community, what is better than people believing, listening and relying on you for some advancements in the community? 

Final word 

Open Source is here to stay and develop software that has a huge impact upon individuals and businesses. People continue to make efforts because of their underlying passion for building great things and open source communities are an example of that. 

May 31 2019
May 31

Open source software has been receiving some serious criticism and some serious applauds from the tech community all across the world. People beg to differ on a lot of ideas about it, it has led to some serious publicity over these years. But hold on a second, with publicity comes myth and with myth comes some serious thoughts and people get mislead. Which at the end of the day hampers people’s thought process. Some think source software is totally free to use and some question its security quotient.

Open source technology has made it nearly possible to do so much in literally no time.

Let’s get into some myths about open source technology about back them with actual facts.

Myth #1: Open Source is free

Many people get more inclined towards open source software because they are misled into thinking that open source software is free to use and there will be hardly any software run costs in the future. On the correct note, this is not true, open source means open source code and that you can easily  access the source code of any system if you are enrolled in any given community.

To break it into a more understandable concept:

An Open Source Content Management System vendor can charge you for the services being provided around the open source software, And by far there is no link between the software license and the what you have to pay to get out of it.

Take Drupal for example, it's free to download and use for personal purposes but the advancements have gone so far that you will need to seek expert services for utilising the software to it's very best potential.

What's the free part?

You are free to access the source code behind the functionality and alter it for your own use case but provided that you abide by the terms and conditions in the license agreement.

Myth #2 - All open source software is Linux based

This myth is one of the most common and it’s fair enough for people to believe, especially when they are new to the open source landscape or just starting off their careers. When OSS came into the picture, this was the most commonly When people mentioned OSS, the quick and common assumption about it is that OSS only runs on the Linux operating system. It is a quick and easy assumption to make as many open source programs are made with Linux availability as a prime motivator.

MYTH #3: Contribution to OpenSource is only for startups

In the government sector, open source contribution is strong and they have the deploy teams to be able to handle and make the best use out of the open source software. Hence they end up making more and more contributions in the process.

On the other hand, the developers in the public sector do contribute to the code base but they have to expect some benefit out of it, either in the financial aspects or on the career trajectory aspect.  Some state and federal agencies like code.ca.gov and code.gov are using code sharing and collaboration to help the government in cutting down the duplicacy costs.

Drupal as an open source software is great for giving startups a heads up for showcasing their expertise and content. On the other hand, it is also one of the best solutions when it comes to enterprise requirements. You can custom build your content management systems which serve for a large scale content repository.

Myth 4 : OSS is less secure than proprietary software

So, is open source software inherently more secure? Of course not. Before going for any open source solution, you should look into its security thoroughly.

You can always review its version history and the frequency of security updates provided by the supporting community, you should also look for the amount of work being poured into its security segment and what is the word of mouth like?

Maybe you’ll even find an independent agency vouching for a product’s security, or certificates proving its reliability, or a respected colleague who can assure you that it's the best option on the market.

Additionally, you can see what tools your competitors, partners, and established companies in the industry are using. For instance, Ruby on Rails is used by 500px and Airbnb, and that alone is a great indicator that this framework is reliable enough for startups.

Drupal is considered one of the most secure content management systems across the world. Why? Because of its dedicated security team and the frequent security releases which make the system more and more robust over time.

Myth 5 - OSS is not scalable

Open source software is never designed to fit in everyone's shoe, the entire agenda of open source software is to make sure people can make it fit in their shoes with the help of respective expertise and their organisational requirements.

Take Drupal for example, It is designed to be scalable and adaptable in comparison to its commercial competitors. It is supposed to be evolved by the community and hence meet enterprise expectations. Developers have been able to adapt projects to small  and enterprise size requirements.

Myth 6 - Open Source is not maintainable

It is a strong assumption that open source software is harder to maintain and it can lead to possible confusion among the user crowd. There is always a sense of responsibility and motivation to improve the code and better the software overall, not for monetary gain, not for any gain other than a feeling of social responsibility.

Open Source softwares generally track all the upgrades, improvements and maintenance measures using paid tools to help maintain a record of the versioning and who was the code contributed by. See? The community has already got the maintenance concern or issue covered before it even gets started.

One more strong foothold about open source is that it can be managed and the work can be overtaken by other technology service providers, in case your technical team decides to move on. So, you should now be sold on the idea that open source is maintained like a premier software.

Myth 7 - OSS doesn’t have a support system in place

Since there is no one to hold accountable openly, people think open source software is less cared about or not supported so well in the industry.

But things are the absolute opposite, the amount of care and support put in by the community support teams is enthralling and it can completely change your mindset about it. Companies which run on the software bring in their brightest minds to help provide support for their software so that they don't get shut down at the end of the day due to lack of sincerity in support and care.

Final word

There might be a ton of myths and rumors circulating within and outside the communities but one should always think and work this out before making any harsh assumptions. Myths often keep us from adopting or trying out a technology and this has to come to an end sooner or later because the technology and the community speak for themselves.

May 31 2019
May 31

With Drupal 9 on the verge of release in June 2020, the Drupal community has about 18 months to map out a transition plan. The latest versions of Drupal in recent times saw a major breakthrough from the past versions. As the philosophy of development has changed, Drupal 9 is said to be built in Drupal 8 and the migration will be super easy this time.

Released in 2011, Dries announced the end-of-life (EOL) for Drupal 7 to be due in November 2021 after serving for more than 8 years. However, many people are still on Drupal 7 given the compatibility issues in the two versions which caused major disruption and migration became a task for developers. However, the new philosophy makes it easier to plan and anticipate any unforeseen obstacles that you may encounter. Are you prepared for it?

Planning for Drupal 9?

Launching with the objective to modernise the dependencies such as Twigs and Symfony and to remove support of deprecated APIs, Drupal 9 is making its way into the Drupal community soon.

Every new information being released about the update and new features is gearing us up for the big leap. The first and foremost action to be taken in consideration is to plan and upgrade no later than the summer of 2019. Experts believe, as long as your modules are updated with minor releases like Drupal 8.7 and the upcoming Drupal 8.9 in December 2019, there won’t be much to worry during the main release of Drupal 9. Being upto date with Drupal 8 is a crucial step for adaptability and easier usability in the future.  

Dries Buytaert wrote recently in a blog:

‘’Instead of working on Drupal 9 in a separate codebase, we are building Drupal 9 in Drupal 8. This means that we are adding new functionality as backwards-compatible code and experimental features. Once the code becomes stable, we deprecate any old functionality.’’
Timeline of Drupal versions

What’s New in Drupal 9?

With a lot of buzz around the new features to be delivered, let’s understand few important reasons for the strategic release of Drupal 9:

  • The innovative model of Drupal 8 had new releases every six months which led to adding of new features and enabling improved ways of problem solving. However, Drupal 9 will deprecate the codes which are needed for backward compatibility. In the process, it will provide an opportunity to remove the codes and anything else that is no longer needed.
  • As of now, Drupal needs to adhere to the vendor support life cycles and integrates with common PHP projects like Twig and Symfony. But the third-party dependencies will reduce with Drupal 9 and we’ll have supported versions of software for a long time such as Twig 2 and Symfony 4/5.

Why upgrade Drupal 8 when Drupal 9 is coming?

Drupal 9 is not being built on a new core and its functionalities will not look alien to Drupal 8 users. Instead, they will be added to D8 as backward-compatible code. Only with time and familiarity, as the new features will hold a stable position and mark their success, the older counterparts will be deprecated. As a result, D9 will be stripped of all deprecated code and only the complete collection of stable features will be termed as Drupal 9.

For example, in Drupal 8.0.0, the Drupal::l($text, $url) was deprecated. Instead of using \Drupal::l(), you can use Link::fromTextAndUrl($text, $url). The \Drupal::l() function was marked for removal as part of some clean-up work.

What does it Mean…

With no new paradigms of development and yet being a big leap, how will Drupal 9 change the workings?

For Core Contributors:

Your tasks will get limited in Drupal 9 even before the release. Making the quality robust and release more predictable, new features will remove deprecated functionality and lead to Drupal's dependencies to a minimum.    

For contributed module authors

Similarly, authors can also start working on the compatibility issues before the release as their Drupal 8 know-how will still remains relevant in Drupal 9 with no dramatic changes in the core.

For Drupal site owners

The release of Drupal 9 will make the upgradation much easier for site owners. It will be the same as Drupal 8, only with its deprecated codes removed. According to the experts, keeping your modules and themes stay up-to-date with the latest Drupal 8 APIs will do and a 12- to 18-month upgrade period will be sufficient.

What happens to module, profile and theme maintainers?

Though existing Drupal 8 sites have a year and a half to upgrade to Drupal 9, the technology in Drupal 9 would be already battle-tested in Drupal 8. The set of tasks for module and theme maintainers involve getting updated with the new and better APIs. It would be a mandate to check if your code is compatible with Drupal 9 as it may hold invalid when sites migrate. However, do not wait till the release of Drupal 8.8 which is expected at the end of 2019. As six months will be a limited time to upgrade to Drupal 9 for complex codes, it’s advisable to start assessing now.

How to Prepare for Drupal 9

The big catch in this whole drill of migration is to make sure that you no longer use the deprecated codes. Following are few ways suggested by Acquia:

  • Be updated with Drupal 8 features and modules
  • Create a report for deprecation using Drupal Check.
  • Check for your active modules which might be deprecated at api.drupal.org
  • Address a consolidated list of errors that can occur and need upgradation to Drupal 9 by generating a ‘’readiness assessment’’.
  • Use the latest versions of dependencies in line with Drupal 9.
Drupal 9 loading

Wrapping it up

As Drupal 9 will emerge as a phoenix from the ashes of Drupal 8, Buytaert sums it up best, “The big deal about Drupal 9 is that…it should not be a big deal.”

Excited? Have questions about how Drupal 9 will impact your site? Want to chalk out a plan for upgradation? We are here to help. Drop a line to our experts at [email protected].

May 31 2019
May 31

Usain Bolt, in his last appearance at the World Track and Field Championships in 2017, stood third by a narrow defeat in the 100m race leaving behind a yawning gulf. Bolt finished the race just a hundredth of a second later than his fellow competitors.

Every (nano)second counts!

Four sprinters crossing the finishing line with crowd cheering them on in the background


Such is the importance of speed that even a three-time Olympic gold medallist, Usain Bolt, had to bear the brunt of those nanoseconds. Someone might ask “How do I get started learning about web performance?”

Visualise that it is the Mega Book Sale Day and the bookworms are thronging the best performing online stores that are selling the books of renowned authors. Coping with such a colossal turn-up, a site with much faster page load speed would be preferred over the ones that are a bit sluggish. Drupal offers a superb platform for an effective website performance optimisation thereby making it faster and user-friendly.

The Significance of Website Performance Optimisation

Web performance optimisation involves monitoring the performance of web application analysing and assessing it, and identifying the best practices to improve it.

Web applications are a combination of server-side and client-side code. To improve the web performance, both the sides need to be optimised.

The client-side optimisation relates to the initial page load time, JavaScript that runs in the browser, downloading all of the resources etc. that are seen in the web browser.

The server-side optimisation relates to database queries and other application dependencies to check how long it takes to run on the server for executing requests.

Performance optimisation is significant because of the following factors:

User retention

BBC found that they are losing out of 10% of users for every extra second their website took to load. Also, DoubleClick by Google found that if the web page took more than 3 seconds to load, 53% of mobile site visitors tend to abandon the page.

Infographic showing statistics on the importance of performance optimisation for improving user retention

 

We all strive to make our users engage in a meaningful interaction with what we have built for the web.

So, if it is an online store, you would like to see a prospective audience turning into buyers. Or if it is a social networking web application, you would want your online visitors to get ensconced in an arresting interaction with one another. High performing sites play a vital role in engaging and retaining users.

An increase in user retention by 5% can result in increased profits by up to 95%.

It costs 5 to 25 times more to attract new customers. So, even a 5% enhancement in customer retention can lead to increased profits of 25%-95%.

By redesigning their web pages, Pinterest combated a 40% reduction in perceived wait times and witnessed a 15% increase in their search engine traffic and sign-ups.

COOK, a provider of high-quality frozen meals, was able to address the average page load time and cut it down by 850 milliseconds which resulted in 7% in conversions, 10% increase in pages per session and 7% decrease in bounce rate.

Improved Conversions

User retention ultimately leads to better conversion rates. Slow sites can have huge repercussions on the business revenues. Better performance of sites can be highly profitable to shore up revenues.

Graphical representation depicting conversion rate and bounce rate with respect to page load timeSource: Hubspot

According to 2016 Q2 Mobile Insights Report by Mobify, 1.11% increase in session-based conversion was seen for every 100ms decrease in homepage load speed. Moreover, a 1.55% increase in session-based conversion was noticed for every 100ms decrease in checkout page load time. The outcome was an increase in the average annual revenue by approximately $530,000.

Also, AutoAnything revved up their sales by 12-13% after decreasing their page load time by half.

User experience

When sites ship tons of code, underwhelming performance persists as the browsers chew through megabytes of it on snail-paced networks. 

Infographic showing statistics on importance of web user experienceSource: Impactbnd

Even the devices with limited processing power and memory can find it hard to cope up with the modest amount of unoptimised code. With poor performance taking centre stage, application responsiveness and availability diminishes.

Better optimised code lead to high functioning and better-performing sites which in return alleviate the digital user experience.

Strategising the web performance

Formulation of strategies to improve web performance can be done in two ways:

Bottom-up strategy

Also known as performance-by-design, the bottom-up strategy is the preferred approach to integrate performance as a core development principle. In this strategy, the performance optimisation principles are framed, applied and maintained. This is done right from the application design phase. 

The key stages that are involved in this approach are stated below:

  • Performance principles are laid out.
  • The key pages/transactions are identified, optimised accordingly, and then performance principles are executed.
  • Performance SLAs (Service Level Agreement) are monitored and maintained.

Here's a chart by Infosys which explains it best: 

Illustration showing the key stages involved in bottom-up strategy for improving the web performanceKey stages involved in bottom-up strategy

Top-down strategy

If an existing application needs to be optimised for performance, top-down strategy comes into play. This is a preferred option only when the legacy applications are being optimised for high performance. Also, this is not cost effective and the optimisation options are limited.

Steps involved in this strategy are as follows:

  1. Factors that are contributing to the page performance are assessed using tools like PageSpeed Insights, WebPageTest etc.
  2. Activities that would lead to maximum performance improvements are optimised.
  3. Other optimisations with subsequent releases are iteratively implemented.

In addition to these strategies, one must consider an important methodology called ‘Performance Budgeting’. It means setting a performance threshold that you aim to stay within. You can safeguard your site speed and detect any regression in the performance by setting up a performance budget to ensure continual eye on performance.

This is how we do it!

Expected load time and Google page speed score, as shown below, is the core of our perpetual and iterative development process.

Illustration showing the key processes involved in the performance budgeting methodology 

The above chart shows that, while applying performance budgeting methodology, we take note of:

  1. Average load time of 2 seconds or less
  2. Defined maximum limit on page size and number of HTTP requests
  3. Verification of all server site tuning for an efficient and responsive site
  4. Google page speed performance grade of above 90
  5. Implementing performance optimisation

Implementing Performance Optimisation

How to speed up my Drupal website performance? Drupal is loaded with an enormous amount of features which, when implemented smartly, can lead to superfast page loads. There are several techniques to make your website faster by leveraging the amazing features of Drupal.

Keeping your site and modules updated

Outmoded modules can deter your efforts in speeding up your website. Thus, it is important to update every module enabled on your Drupal site.

Uninstalling unused modules

Like those outdated modules, it is significant to keep a tab on least used or no longer used modules. The number of Drupal modules installed on the site is directly proportional to the time taken for code execution which affects page load time. Uninstalling unwanted modules can alleviate execution time.

Moreover disabling the modules also adds to the execution time of the code. So, a complete removal by uninstalling the unused modules can speed up the Drupal site.

Optimising Cache

Optimisation of native cache system ensures that all the web page components are stored in an easily accessible location after a user visits your site for the very time. So, whenever the user visits your site again, the page elements are loaded from the cache which leads to increased page load speed.

Drupal has the provision of advanced caching with a great set of modules:

  • Internal Page Cache module helps in caching the web pages for anonymous users to increase the speed for subsequent users.
     
  • Dynamic Page Cache module caches web pages for the anonymous and authenticated users and is recommended for the websites of all screen sizes.
     
  • BigPipe module allows your users to quickly see the unchanged, cacheable page elements while the personalised content is exhibited next. This technology was inspired by Facebook. Drupal 8’s much improved render pipeline and render API is of huge help.
     
  • Redis module helps in integrating Drupal with Redis key-value store thereby providing a robust cache system for static pages.
     
  • Varnish module lets you integrate Drupal sites with an advanced and fast reverse-proxy system - Varnish cache -  to serve static files and unknown page-views quicker and at high volumes.

Optimising database

Website coding is not the sole thing that can be optimised. Optimising database by regularly cleaning up the data and removing the unwanted piece of information.

Memcache API and Integration module, help in the integration of Drupal and Memcached. It stores your data in active memory for a limited period of time thereby making it faster to access. 

So, instead of making queries to the database constantly, the information is readily available. Such a system also works on the shared web hosting plans.

Incorporating a Content Delivery Network (CDN)

Components like CSS, JavaScript and media are hosted by CDN and served to the online visitors from the nearest location. This can help in mitigating the page load time by rapidly delivering web page components.

Drupal module, CDN, helps in the integration of Content Delivery Network for Drupal websites. It changes the file URLs so that files like CSS, JavaScripts, images, videos, and fonts are downloaded from the CDN instead of your web server.

Optimising bandwidth

Aggregating all CSS and JavaScript files to make them load together is what bandwidth optimisation refers to. Such a parallel processing ensures that all the page elements can be seen by the users almost immediately.

Optimising images

Drupal 8 core is loaded with image optimisation feature to set the compression ratio of the images and fine-tune the page performance.

Moreover, the size of the images for screen sizes of different devices can be optimised in Drupal 8 to enhance the page load speed.

Handling 404 errors

Whenever something on the website breaks to cause a 404 error, it can lead to sluggishness. For instance, a failed image can damage the performance of the site. Drupal 8 provides a module called Fast 404 which utilises the resources better and whitelists files and verifies pathways of problem.

Managing the use of CSS and JavaScript

CSS and JavaScript provide wonderful methods for customisation and flexibility. But, too much of good things can be troublesome for your websites. Avoiding excessive use of CSS files and JavaScript use and keeping the code to a minimum can improve performance.

Advanced CSS/JS Aggregation, Drupal module, can help in keeping a tab of your front-end performance by aggregating CSS and JavaScript files to improve speed.

Using lazy loading

Lazy or on-demand loading is a perfect way to optimise your site’s performance. In this method, you split your code at logical breakpoints and then load it once the user has done something that requires a new block of code.

Basically, in traditional websites, all the images and content are preloaded into the web browser when someone accesses the site. Lazy loading loads these elements as soon as a user scrolls to view a content.

Blazy, Drupal module, provides the functionalities of lazy loading and multi-serving the images to save bandwidth and server requests.

Better web hosting

It is of consummate importance that, while implementing every possible tips and trick and utilising the Drupal’s amazing features, you chose the best web hosting provider that will decide your site’s ultimate speed, stability and security.

Upgrading the server hardware

Server scaling is of paramount importance in order to optimise the website. And to do so, you can either upgrade the server hardware by scaling vertically or by scaling horizontally. When you scale vertically, more resources are thrown at the same server and is considered the simplest approach of scaling the hardware. And when you scale horizontally, more servers are added to separate the load. This approach, when executed well, can minimise the load that any single server receives. In case, you have multiple app servers for Drupal, you will need a method of deploying code to each server concurrently. For example, plartform.sh and pantheon.io can manage the entire hosting setup for you but if you are handling it by yourself, you would require rsync setup or git push to each of your servers etc.

Case Study

The Drupal website of the Farm Journal’s MILK was optimised for high performance and better search engine rankings with a help of carefully drafted audit report by Opensense Labs.

In this section, we will focus on how we used our Drupal expertise to resolve the performance issues.

Project highlights

Previously segregated CSS and JS files cached separately which escalated the page load time. We aggregated all these files and put them in one place which assuaged the page load time.

Moreover, we used Advanced CSS/JS Aggregation Drupal module to minify CSS, JS and HTML and reduce load time.

In addition to these, we enabled Redis, used as a database, cache and message broker, so that it can be used as the backend instead of MySQL. This allowed cached items to be retrieved swiftly and improved performance.

Project outcome

On testing the performance metrics on tools like PageSpeed Insights and Pingdom, we witnessed significant improvement.

PageSpeed Insights

  • Result on handheld devices
Google pagespeed insights result for mobile devices before implementing performance enhancement in the sitePre-implementation (Live Instance)

 

Alt text: Google pagespeed insights result for mobile devices after implementing performance enhancement in the sitePost-implementation (Live Instance)

 

  • Result on Desktop
Google pagespeed insights result for desktop before implementing performance enhancement in the sitePre-implementation (Live Instance)

 

Google pagespeed insights result for desktop after implementing performance enhancement in the sitePost-implementation (Live Instance)

 

Pingdom

Pingdom scores on different performance metrics of site before implementing performance enhancementPre-implementation Pingdom Score (Live Environment)

 

Pingdom scores on different performance metrics of site after implementing performance enhancementPost-implementation Pingdom Score (Live Environment)

 

Conclusion

Speed can be the determining factor in the amount of time an online user spends on your website. It’s important that you remove the sluggishness from your website and inculcate betterments in its performance. Drupal 8 can help by incorporating wonderful features to make your site a high performing space.

Feel free to reach us at [email protected] for developing a high performing Drupal website

May 30 2019
May 30

Only a few years ago it was a challenge to manually integrate marketing services into a website. However, a perfect marketing automation tool cannot exist without the ability to be integrated across multiple channels. Nowadays, marketing tools can be digitally integrated with any platform, including Drupal-based websites. This is possible because Drupal 8 provides custom modules for most of such services.

Today, the team at WishDesk explores the most popular marketing automation tools that integrate with Drupal 8.

What is marketing automation?

Marketing automation is a tool that automates repetitive marketing actions, such as social media, email, tracking processes and others. In such a way marketers are able to focus on more urgent tasks and increase productivity.

This study by Social Media Today states that 75% of business currently use automation tools.

businesses that use automation tools

Key features of marketing automation tools

Marketing automation tools let marketers get rid of routine manual tasks. The key points and advantages of them are:

  • tracking visitors
  • email marketing
  • lead scoring
  • customizable workflows

Marketing tools that integrate with Drupal 8

Drupal is a universal CMS and has modules for any feature which will definitely benefit your business. Drupal cares about marketers as well. Here is a list of Drupal 8 marketing modules that can be integrated with a website.

Hubspot

HubSpot is the most popular inbound marketing platform on the internet.

HubSpot Integration for Drupal 8

With the help of Drupal 8 HubSpot module, this service can be easily integrated with Drupal. Website owners can create content on HubSpot and display it on Drupal 8’s front-end.

Key features:

  • submit any Webform to the HubSpot Leads API, as a lead to be tracked by HubSpot
  • easily embed the HubSpot JavaScript tracking code in Drupal website
  • see your latest leads in the Drupal admin dashboard 
  • extensive documentation is available

MailChimp

MailChimp is an email marketing tool. MailChimp allows you not only to set up mailing lists based on multiple preferences but also retrieve mailing lists from a database. Users who sign up on your Drupal 8 website will automatically be stored in your site’s database. You can use these emails for a newsletter and use the MailChimp integration to send emails without manually creating a list of such users.

MailChimp-integration-for-Drupal8

There’s the MailChimp module available for Drupal 8. It helps easily integrate marketing automation tool with Drupal.

Key features:

  • connect a MailChimp List to any entity with an email address field 
  • display subscription forms or status for Lists on entities
  • subscription controlled on Entity creation
  • create forms to allow site visitors to sign up for any Mailchimp List or combination of Lists
  • create Pages, Blocks, or both to display forms
  • create campaigns containing any Drupal entity
  • send campaigns created in Drupal through Mailchimp or Drupal interfaces
  • campaign statistics

Salesforce

Salesforce is a software company that specializes in customer relationship management (CRM) that can benefit both small and large businesses. The Salesforce platform has functionalities for sales management, partner relationship management, and customer service. It allows users to synchronize contacts, calendars, emails, and various tasks.

saleforce integration module for Drupal8

Drupal 8 offers the Salesforce Suite of modules to integrate with your Drupal website.

Key Features:

  • supports pushing Drupal data to Salesforce as well as pulling, or importing, Salesforce data into Drupal
  • marketing and sales lead synchronization
  • OAuth 2.0 authorization to maximize access control and safety
  • real-time visibility

Google Analytics 

Google Analytics is a powerful tracking tool that creates all imaginable statistics for your website. With the help of this marketing automation tool, you can track users, average session duration, bounce rate, conversions, traffic source, locations, type of device, and much more!

GoogleAnalytics integration for Drupal8

Drupal 8 offers the Google Analytics module that turns the integration of this marketing tool with Drupal into an easy task.

Key features:

  • single/multi/cross domain tracking
  • selectively track/exclude certain users, roles and pages
  • monitor what files are downloaded from your pages
  • demographics and interests support
  • anonymize visitors IP address
  • DoNotTrack support (non-cached content only)
  • Drupal messages tracking
  • access denied (403) and page not found (404) tracking

Check out this post on how to integrate Google Analytics with Drupal 8.

Crazy Egg

Crazy Egg is another helpful marketing automation tool that generates a heatmap of your site. It shows where visitors spend most of their time on your website. Crazy Egg also shows where visitors scroll and where they click the most.

CrazyEgg integration for drupal8

The Crazy Egg module for Drupal 8 allows easy integration of the tool with your Drupal site.

Key features:

  • scroll maps so you can see where people are scrolling
  • session recordings that allow you to watch recordings of your visitors interacting with your website
  • A/B tests

Social Auth Google

Social Auth Google allows users to register or login to the Drupal site with the help of their Google account. This module allows websites to request any scopes so that any tasks requiring authentication with Google services can be performed.

social auth google integrated with drupal8

A path user/login/google redirects users to Google Accounts for authentication.

Integrate marketing tools with Drupal 8!

These are just some of the examples of marketing tools that integrate with Drupal 8. You definitely need them on your website if you want to keep your business on top.

Please get in touch if you need any help with integrating marketing automation tools with Drupal website.

May 29 2019
May 29

3 minute read Published: 29 May, 2019 Author: Colan Schwartz
Drupal Planet , Aegir , DevOps

Have you been looking for a self-hosted solution for hosting and managing Drupal sites? Would you like be able able to upgrade all of your sites at once with a single button click? Are you tired of dealing with all of the proprietary Drupal hosting providers that won’t let you customize your set-up? Wouldn’t it be nice if all of your sites had free automatically-updating HTTPS certificates? You probably know that Aegir can do all of this, but it’s now trivial to set up a temporary trial instance to see how it works.

The new Aegir Development VM makes this possible.

History

Throughout Aegir’s history, we’ve had several projects striving to achieve the same goal. They’re listed in the Contributed Projects section of the documentation.

Aegir Up

Aegir Up was based on a VirtualBox virtual machine (VM), managed by Vagrant and provisioned with Puppet. It was superseded by Valkyrie (see below).

Aegir Development Environment

Aegir Development Environment took a completely different approach using Docker. It assembles all of the services (each one in a container, e.g. the MySQL database) into a system managed by Docker Compose. While this is a novel approach, it’s not necessary to have multiple containers to get a basic Aegir instance up and running.

Valkyrie

Valkyrie was similar to Aegir Up, but provisioning moved from Puppet to Ansible. Valkyrie also made extensive use of custom Drush commands to simplify development.

Its focus was more on developing Drupal sites than on developing Aegir. Now that we have Lando, it’s no longer necessary to include this type of functionality.

It was superseded by the now current Aegir Development VM.

Present

Like Valkyrie, the Aegir Development VM is based on a VirtualBox VM (but that’s not the only option; see below) managed with Vagrant and provisioned with Ansible. However, it doesn’t rely on custom Drush commands.

Features

Customizable configuration

The Aegir Development VM configuration is very easy to customize as Ansible variables are used throughout.

For example, if you’d like to use Nginx instead of Apache, simply replace:

    aegir_http_service_type: apache

…with:

    aegir_http_service_type: nginx

…or override using the command line.

You can also install and enable additional Aegir modules from the available set.

Support for remote VMs

For those folks with older hardware who are unable to spare extra gigabytes (GB) for VMs, it’s possible to set up the VM remotely.

While the default amount of RAM necessary is 1 GB, 2 GB would be better for any serious work, and 4 GB is necessary if creating platforms directly from Packagist.

Support for DigitalOcean is included, but other IaaS providers (e.g. OpenStack) can be added later. Patches welcome!

Fully qualified domain name (FQDN) not required

While Aegir can quickly be installed with a small number of commands in the Quick Start Guide, that process requires an FQDN, usually something like aegir.example.com (which requires global DNS configuration). That is not the case with the Dev VM, which assumes aegir.local by default.

Simplified development

You can use it for Aegir development as well as trying Aegir!

Unlike the default set-up provisioned by the Quick Start Guide, which would require additional configuration, the individual components (e.g. Hosting, Provision, etc.) are cloned repositories making it easy to create patches (and for module maintainers: push changes upstream).

Conclusion

We’ve recently updated the project so that an up-to-date VM is being used, and it’s now ready for general use. Please go ahead and try it.

If you run into any problems, feel free to create issues on the issue board and/or submit merge requests.

The article Try Aegir now with the new Dev VM first appeared on the Consensus Enterprises blog.

We've disabled blog comments to prevent spam, but if you have questions or comments about this post, get in touch!

May 29 2019
May 29

I'm pleased to share that Francesco Placella (plach on Drupal.org) is moving from a "provisional" core committer to a full-fledged framework manager. (Read more about Drupal core's governance structure.)

Francesco has been a member of the Drupal community for over 11 years. He contributed an incredible amount to multilingual efforts, the Field and Entity API, and was a top contributor to the Drupal Association's D8 Accelerate program, so you can also thank him for Drupal 8 getting released. :)

This experience has given Francesco an extremely well-rounded knowledge of Drupal's API underpinnings, making him a perfect candidate for Framework Manager. He is also extremely meticulous in his patch reviews, and always willing to jump in on problems to help others.

The rest of the committer team all were extremely happy to recommend his promotion to full-fledged committer, so please join me in formally welcoming plach to the team!

May 29 2019
May 29

Have a few menus on your site & looking for a quick way to add or change the menu classes and attributes? Use the theme_menu_tree__[menu_name] override in your theme’s template.php file to change Drupal 7 menu list class and attributes:

// template.php

/**
 * Override theme_menu_tree().
 */
function theme_menu_tree($variables) {
  return '<ul class="menu">' . $variables['tree'] . '</ul>';
}

/**
 * Override theme_menu_tree__[menu_name]().
 */
function theme_menu_tree__main_menu($variables) {
  return '<ul class="menu">' . $variables['tree'] . '</ul>';
}

The code above will allow you to easily change all menu ul classes and other attributes or just the main menu’s ul classes and attributes.

Change Drupal 7 Menu List Class

Looking for a module to change Drupal 7 menu list class & attributes?

Unfortunately, I haven’t been able to find one that handles the individual menu ul instances cleanly, but the Menu Attributes module is a start. It gives users the ability to set the following attributes for each menu item — this does not help with setting the ul classes & attributes:

  • id
  • name
  • target
  • rel
  • class
  • style
  • accesskey

What about Drupal 8? Check this out article out by Tamas Hajas: Drupal 8 Twig: add custom CSS classes to menus (based on menu name).

Related Articles

Like this:

Like Loading...

May 29 2019
May 29

Gaining approval to launch a new website is a big investment — and it’s expected to achieve a big reward. Your internal team (and customers) expect it to match up to their favorite website. That could be Amazon, Apple, or any number of well-known brands relying strongly on their website.

Needless to say, the expectations for a new website are very high, regardless of your budget. Compounding the challenge is the fact that a site build remains a complex process due to technology, expectations, diverse perspectives, and competing goals within the organization.

The challenge for the business is that a new website build is not standard operating procedure. It is not something that is done regularly. It is often resisted by the internal users because as much as people want the latest and greatest site, they may also fear change. So the risk-reward can be very high for the person in charge of the project, but selecting the right digital agency and leveraging your agency-partner relationship can tip the scales in your favor. Your agency-partner, let’s say partner, can help you, because it is standard for them.

Perspective from both sides of the aisle 

My career experiences have given me a broad perspective and good understanding of the internal challenges one faces to get buy-in for a major website re-build project.

Today, as a Mediacurrent Project Manager, I primarily work with existing clients for both site builds and post launch support, and I also work on pre-sale projects.

I was previously hired by a top 20 medical device manufacturer into a new position responsible for Online Marketing Strategy and Analytics, reporting up to a reasonably new head of the department of Marketing Services. Up to that point, online marketing and the website was not a focus for the marketing team. We made the case for a new website, got management and budget approval, chose Drupal, and I managed the entire process — including vendor selection.

The RFP Process

  • If you have an existing agency partner, they can help you. It would essentially be consulting time, but often the partner sees a lot of RFPs and can identify areas that you may have missed.

  • Have a diverse group of people involved in the process. This can make the process slower, but can help significantly in the end if you have early buy-in from all the right parties.

  • Accept what you think is fair based on the request vs. resources and experience being made available to you. You may not always have the names of all the individuals assigned to your project, but the partner will ensure the resources meet the need.

Development

  • If the partner doesn’t offer, ask for regular demos of functionality throughout the development phase. This will help you see the work being done and you can make adjustments as needed. Be careful with adjustments though. You want them to be clarifications and not changes to the original scope of work.
  • Don’t go short on Quality Assurance (QA) time. Partner QA teams do nothing but QA and are well versed at finding things you may not think to look for. Allow the partner to QA each ticket you review. If you by-pass QA or do it yourself, you run a high risk that there will be issues and ultimately misses.
  • Keep your stakeholders abreast of the work being done, so they see progress. Invite them to the demos and reconfirm their approval.

Training Internal Users

  • During development, begin planning for training your internal users. Without their buy-in, you will fail. Keep them informed of the progress and if possible create a campaign that raises awareness and keeps the project top of mind.
  • Be sure to build your site with help text for each field. When demos take place, have them recorded so you have videos of both front and back end for the users to understand how what they insert is rendered.
  • Your partner can help plan training sessions to get everyone acclimated to the new system.

Post-Launch

  • Websites are evolutionary; new features and functions arise as users get acclimated to them. Most likely there will be items that didn’t make the initial launch in order to keep within time or budget, but having a support agreement will allow you to continue to improve your site. If necessary, have your partner convey the fact that these new features and functionalities are possible, but can be done post-launch to keep the project on time.
  • Reporting is critical. While this has to be established during the development phase, you need to develop a series of reports. There should be a report for the product team with specific areas for them to focus on and the senior management team, which wants to know if their investment is paying off. Your partner can help develop these as they have done them for other clients in the past, as opposed to taking time to do it yourself.
  • Your hosting and development companies need to work in unison, and sometimes this can be more than two companies. Keep them connected to ensure the entire platform is optimized.

While these are high-level considerations, I believe they are all critical to success. When you have the opportunity to build a new site or revise an existing one, following these guidelines will put you in a position to be successful and to leverage that success to a promotion.

May 29 2019
May 29

May has been most generous with us, no doubt about it: it has "spoiled" us with a heavy load of both useful and usable Drupal content. The community has been altruistic enough to share their “enlightening” experiences of working with Drupal, their discoveries and latest contributions. As for us, we "feasted" on their articles and tutorials, even managed to sync all our personal tops and to come up a unique "best Drupal blog posts” list for this month.
 

Ranging from valuable tutorials to overviews of the latest Drupal releases, to glimpses of these Drupal contributors' hard work, our selection is as varied as it is valuable.
 

Now, in the name of open source we're ready to share our selection with you, OPTASY team's 5 most appreciated Drupal blog posts in May:
 

Drupal 8.7 had just been "taken out of the oven", it was still steamy fresh when the Srijan team published their inventory on its new features and newsworthy updates.

From:
 

  • JSON:API now in Drupal 8 core
  • to the Media Libray module, that grew from experimental to stable 
  • to the "rockstar" Drupal 8 module, the Layout Builder, that turned stable
  • to the newly improved configuration management system
     

... and other upgrades, updates, and newly added features, they managed to include in their post all the "highlights" of this Drupal minor release.

And, most of all, to do it promptly enough to be among the first (if not the first) to share their overview on the release with the world/the Drupal community...
 

Another piece of content that made it to our “best Drupal blog posts” list this month has been Matt Oliveira's tutorial on how to use Laravel's Homestead for Drupal local development.

He first adds some sort of context to justify his choice (since he used to go with Vagrant for his Drupal projects), then he explains, step by step:
 

  • what software you need to install, first things first ( VMWare, a VM provider, Hyper-V, Vagrant, etc.)
  • how to install and setup Homestead using Composer, but only after you've first cloned your Composer Drupal project
  • the command to enter for... launching it, after you've run all the due configurations
     

And his clearly formulated and practical tutorial goes all the way to the cool features that Homestead will provide you with and some useful warnings to keep in mind.

Have you used Homestead for your local development when working on your Drupal projects before?
 

Did the “secure Drupal” frenzy get you, too, last year? Particularly after the Drupalgeddon attacks?

Then you must have rushed to:
 

  • implement all the security best practices out there
  • put up a thick security shield around your Drupal modules and your Drupal theme
     

But did you know how insecure Drupal code even looked like?

And it's precisely this rhetorical question that generated the ThinkShout team's blog post.

They point out that:
 

  • way too many Drupal developers risk to “host” insecure code under their websites' hoods without even knowing it
  • most of us genuinely assume that all Drupal APIs are safe
     

Next, once they point out the issue(s), they enlist several exploitable holes that you could identify in your code, grouped in 3 main categories:
 

  • XSS vulnerabilities when rendering HTML
  • SQL injection risks
  • PHP code issues
     

A priceless resource to keep at hand and to tap into whenever we run our own code review sessions here, at OPTASY. One that we're most grateful for. 
 

It's useful, it's enjoyable, it's packed with helpful tips on both:
 

  • what optimizing images for the web really means; take it as a helpful checklist
  • what Drupal tools to use to... automate the whole process
     

And I'm talking here about the “Configure image styles” feature that enables you to define some sort of “pattern” to apply on all the future images on your website. One already incorporating all the due properties, the right width and height.

About the “Image toolkit” feature, that enables you to easily improve your image's quality. And the list goes on (with the Responsive Images module and so on...)

A way too valuable piece of content not to include it in our “best Drupal blog posts” list.
 

The real challenge highlighted by the Duo team in their post? Drupal site search in case of large organizations.

And their real struggle to look for a solution that:
 

  • would allow users to query across an entire ecosystem of websites and platforms
  • wouldn't put too much pressure on Drupal
     

In this respect, they bring to our attention a solution architected and developed by the Palantir team: the federated search.

Next, they back up their choice with strong arguments:
 

  • it's a robust enough search solution to meet large organizations' needs
  • being a decoupled solution, it leverages Drupal's powerful back-end without putting a strain on its front-end, as well
     

In short: for us, the OPTASY team, this post opened a world of possibilities. What if search in Drupal could be way more flexible, yet powerful enough to meet enterprise-level requirements?

And I'm thinking here of all our clients “juggling” with multiples websites...

 
The END!

These are the best Drupal blog posts on our monthly list. And we have to admit: picking just 5 pieces of content on Drupal was one hell of a challenge.

Photo by Daniel McCullough on Unsplash

May 29 2019
May 29

6 minute read Published: 29 May, 2019 Author: Derek Laventure
Drupal Planet , Drupal 8 , Lando , Drumkit

Over the last 2 or 3 years, the Drupal community has been converging around a solid set of Docker-based workflows to manage local development environments, and there are a number of worthy tools that make life easier.

My personal favourite is Lando, not only because of the Star Wars geekery, but also because it makes easy things easy and hard things possible (a lot like Drupal). I appreciate that a “standard” Lando config file is only a few lines long, but that it’s relatively easy to configure and customize a much more complex setup by simply adding the appropriate lines to the config.

In this post I want to focus on an additional tool I’ve come to lean on heavily that complements Lando quite nicely, and that ultimately boils down to good ol’ fashioned Makefiles. Last summer at DrupalNorth I gave a talk that was primarily about the benefits of Lando, and I only mentioned Drumkit in passing. Here I want to illustrate in more detail how and why this collection of Makefile tools is a valuable addition to my localdev toolbox.

The key benefits provided by adding a Drumkit environment are:

  • consistent make <target>-based workflow to tie various dev tasks together
  • ease onboarding of new devs (make help)
  • make multistep tasks easier (make tests)
  • make tasks in Lando or CI environment the same (ie. make install && make tests)

Basic Setup

As an example, suppose you’re setting up a new D8 project from scratch. Following this slide from my Lando talk, you would do the basic Lando D8 project steps:

  1. Create codebase with Composer (composer create-project drupal-composer/drupal-project:8.x-dev code --stability dev --no-interaction)
  2. Initialize Git repository (git init etc.)
  3. Initialize Lando (lando init)

For now, leave out the lando start step, which we’ll let Drumkit handle momentarily. We should also customize the .lando.yml a little with custom database credentials, which we’ll tell Drumkit about later. Append the following to your .lando.yml:

services:
  database:
    creds:
      user: chewie_dbuser
      password: chewie_dbpass
      database: chewie_db

Add Drumkit

To insert Drumkit into this setup, we add it as a git submodule to our project using the helper install.sh script, create a simple .env file, and bootstrap Drumkit:

wget -O - https://gitlab.com/consensus.enterprises/drumkit/raw/master/scripts/install.sh | /bin/bash
echo "COMPOSER_CACHE_DIR=tmp/composer-cache/" >> .env
. d  # Use 'source d' if you're not using Bash

The install script checks that you are in the root of a git repository, and pulls in Drumkit as a submodule, then initializes a top-level Makefile for you. Because we’re using Composer to manage our codebase, we also add a COMPOSER_CACHE_DIR environment variable, using the standard .env file.

Finally, we initialize the Drumkit environment, by sourcing the d script (itself a symlink to .mk/drumkit) into our shell.

Drumkit modifies the (shell) environment!

Note that Drumkit will modify your PATH and BIN_PATH variables to add the project-specific .mk/.local/bin directory, which is where Drumkit installs any tools you request (eg. with make selenium. This means if you have multiple Drumkit-enabled projects on the go, you’re best to work on them in separate shell instances, to keep these environment variables distinct.

Note that you can take advantage of this environment-specific setup to customize the bootstrap script to (for example) inject project credentials for external services into the shell environment. Typically we would achieve this by creating a scripts/bootstrap.sh that in turn calls the main .mk/drumkit, and re-point the d symlink there.

Drumkit is not just for Drupal!

This example is using Drumkit for a Drupal 8 localdev environment, but there’s no reason you couldn’t use it for other purposes (and in fact, we at Consensus have lately been doing just that.

Set up your kit

From here, we can start customizing for Drupal-specific dev with Lando. First, we make a place in our repo for some Makefile snippets to be included:

mkdir -p scripts/makefiles
echo "include scripts/makefiles/*.mk" >> Makefile

Now we can start creating make targets for our project (click the links below to see the file contents in an example Chewie project. For modularity, we create a series of “snippet” makefiles to provide the targets mentioned above:

NB You’ll need to customize the variables.mk file with the DB credentials you set above in your .lando.yml as well as your site name, admin user/password, install profile, etc.

Now our initial workflow to setup the project looks like this:

git clone --recursive <project-repo>
cd <project-repo>
. d # or "source d" if you're not using Bash
make start
make build
make install

This will get a new developer up and running quickly, and can be customized to add whatever project-specific steps are needed along the way.

But wait- it gets even better! If I want to make things really easy on fellow developers (or even just myself), I can consolidate common steps into a single target within the top-level Makefile. For example, append the make all target to your Makefile:

.PHONY: all

all:
        @$(MAKE-QUIET) start
        @$(MAKE-QUIET) build
        @$(MAKE-QUIET) install

Now, the above workflow for a developer getting bootstrapped into the project simplifies down to this:

git clone --recursive <project-repo>
cd <project-repo>
. d
make all

Customize your kit

At this point, you can start adding your own project-specific targets to make common workflow tasks easier. For example, on a recent migration project I was working on, we had a custom Features module (ingredients) that needed to be enabled, and a corresponding migration module (ingredients_migrate) that needed to be enabled before migrations could run.

I created the following make targets to facilitate that workflow:

We often take this further, adding a make tests target to setup and run our test suite, for example. This in turn allows us to automate the build/install/test process within our CI environment, which can call exactly the same make targets as we do locally.

Ultimately, Drumkit is a very simple idea: superimpose a modular Makefile-driven system on top of Lando to provide some syntactic sugar that eases developer workflow, makes consistent targets that CI can use, and consolidates multi-step tasks into a single command.

There’s lots more that Drumkit can do, and plenty of ideas we have yet to implement, so if you like this idea, feel free to jump in and contribute!

The article Lando and Drumkit for Drupal 8 Localdev first appeared on the Consensus Enterprises blog.

We've disabled blog comments to prevent spam, but if you have questions or comments about this post, get in touch!

May 29 2019
May 29

9 minute read Published: 29 May, 2019 Author: Derek Laventure
Drupal Planet , Drupal 8 , OpenSocial

In Drupal 7, hook_update()/hook_install() were well-established mechanisms for manipulating the database when installing a new site or updating an existing one. Most of these routines ended up directly running SQL against the database, where all kinds of state, configuration, and content data lived. This worked reasonably well if you were careful and had a good knowledge of how the database schema fit together, but things tended to get complicated.

With the maturing of Features module, we were able to move some of this into configuration settings via the ctools-style export files, making the drush feature-revert command part of standard workflow for deploying new features and updates to an existing site.

In Drupal 8, we’ve made huge strides in the direction of Object Orientation, and started to separate Configuration/State, Content Structure, and Content itself. The config/install directory is often all that’s needed in terms of setting up a contributed or custom module to work out of the box, and with the D8 version of Features, the same is often true of updates that involve straightforward updates to configuration .yml files.

It turns out that both hook_update() and hook_install() are still valuable tools in our box, however, so I decided to compile some of the more complicated D8 scenarios I’ve run across recently.

Drupal 8 Update basics

The hook_update_N API docs reveal that this function operates more or less as before, with some excellent guidelines for how to approach the body of the function’s implementation. The Introduction to update API handbook page provides some more detail and offers some more guidance around the kinds of updates to handle, naming conventions, and adding unit tests to the your update routines.

The sub-pages of that Handbook section have some excellent examples covering the basics:

All of these provided a valuable basis on which to write my own real-life update hooks, but I found I still had to combine various pieces and search through code to properly write these myself.

Context

We recently launched our first complex platform based on Drupal 8 and the excellent OpenSocial, albeit heavily modified to suit the particular requirements of the project. The sub-profile required more extensive customization than simply extending the parent profile’s functionality (as discussed here). Instead, we needed to integrate new functionality into that provided by the upstream distribution, and this often resulted in tricky interactions between the two.

Particularly with a complex site with many moving parts, we take the approach of treating the site as a system or platform, installing and reinstalling regularly via a custom installation profile and set of feature modules. This allows us to integrate:

  • a CI system to build the system repeatedly, proving that everything works
  • a Behat test suite to validate the behaviour of the platform matches the requirements

In the context of a sub-profile of OpenSocial, this became complicated when the configuration we wanted to customize actually lived in feature modules from the upstream profile, and there was no easy way to just override them in our own modules’ config/install directories.

We developed a technique of overriding entire feature modules within our own codebase, effectively forking the upstream versions, so that we could then modify the installed configuration and other functionality (in Block Plugins, for example). The trouble with this approach is that you have to manage the divergence upstream, incorporating new improvements and fixes manually (and with care).

Thus, in cases where there were only a handful of configuration items to correct, we began using hook_install() routines to adjust the upstream-installed config later in the install process, to end up with the setup we were after.

Adjust order of user/register form elements

We make use of entity_legal for Terms of Service, Privacy Policy, and User Guidelines documents. Our installation profile’s feature modules create the 3 entity legal types, but we needed to be able to tweak the order of the form elements on the user/register page, which is a core entity_form_display created for the user entity.

To achieve this using YAML files in the config/install directory per usual seemed tricky or impossible, so I wrote some code to run near the end of the installation process, after the new legal_entity types were created and the core user.register form display was set. This code simply loads up the configuration in question, makes some alterations to it, and then re-saves:

/**
 * Implements hook_install().
 */
function example_install() {
  _example_install_adjust_legal_doc_weights();
}

/**
 * Adjust weights of legal docs in user/register form.
 */
function example_update_8001() {
  _example_install_adjust_legal_doc_weights();
}

/**
 * Ensure the field weights on the user register form put legal docs at the bottom
 */
function _example_install_adjust_legal_doc_weights() {
       $config = \Drupal::getContainer()->get('config.factory')->getEditable('core.entity_form_display.user.user.register');
       $content = $config->get('content');

       $content['private_messages']['weight'] = 0;
       $content['account']['weight'] = 1;
       $content['google_analytics']['weight'] = 2;
       $content['path']['weight'] = 3;
       $content['legal_terms_of_service']['weight'] = 4;
       $content['legal_privacy_policy']['weight'] = 5;
       $content['legal_user_guidelines']['weight'] = 6;
       $config->set('content', $content)->save();
}

Modify views configuration managed by upstream (or core)

A slightly more complicated situation is to alter a views configuration that is managed by an upstream feature module during the installation process. This is not an ideal solution, but currently it’s quite challenging to properly “override” configuration that’s managed by a “parent” installation profile within your own custom sub-profile (although Config Actions appears to be a promising solution to this).

As such, this was the best solution I could come up with: essentially, run some code very nearly at the end of the installation process (an installation profile task after all the contrib and feature modules and related configuration are installed), that again loads up the views configuration, changes the key items needed, and then re-saves it.

In this case, we wanted to add a custom text header to a number of views, as well as switch the pager type from the default “mini” type to “full”. This required some thorough digging into the Views API and related code, to determine how to adjust the “handlers” programmatically.

This helper function lives in the example.profile code itself, and is called via a new installation task wrapper function, which passes in the view IDs that need to be altered. Here again, we can write trivial hook_update() implementations that call this same wrapper function to update existing site instances.

/**
 * Helper to update views config to add header and set pager.
 */
function _settlement_install_activity_view_header($view_id) {
  # First grab the view and handler types
  $view = Views::getView($view_id);
  $types = $view->getHandlerTypes();

  # Get the header handlers, and add our new one
  $headers = $view->getHandlers('header', 'default');

  $custom_header = array(
    'id' => 'area_text_custom',
    'table' => 'views',
    'field' => 'area_text_custom',
    'relationship' => 'none',
    'group_type' => 'group',
    'admin_label' => '',
    'empty' => '1',
    'content' => '<h4>Latest Activity</h4>',
    'plugin_id' => 'text_custom',
    'weight' => -1,
  );
  array_unshift($headers, $custom_header);

  # Add the list of headers back in the right order.
  $view->displayHandlers->get('default')->setOption($types['header']['plural'], $headers);

  # Set the pager type to 'full'
  $pager = $view->getDisplay()->getOption('pager');
  $pager['type'] = 'full';
  $view->display_handler->setOption('pager', $pager);

  $view->save();
}

Of particular note here is the ordering of the Header components on the views. There was an existing Header on most of the views, and the new “Latest Activity” one needed to appear above the existing one. Initially I had tried creating the new custom element and calling ViewExecutable::setHandler method instead of the more complicated $view->displayHandlers->get('default')->setOption() construction, which would work, but consistently added the components in the wrong order. I finally found that I had to pull out a full array of handlers using getHandlers(), then array_unshift() the new component onto the front of the array, then put the whole array back in the configuration, to set the order correctly.

Re-customize custom block from upstream profile.

In most cases we’ve been able to use Simple Block module to provide “custom” blocks as configuration, rather than the core “custom” block types, which are treated as content. However, in one case we inherited a custom block type that had relevant fields like an image and call-to-action links and text.

Here again, the upstream OpenSocial modules create and install the block configs, and we didn’t want to fork/override the entire module just to make a small adjustment to the images and text/links. I came up with the following code block to effectively alter the block later in the installation process:

First, the helper function (called from the hook_install() of a late-stage feature module in our sub-profile), sets up the basic data elements needed, in order to make it easy to adjust the details later (and re-call this helper in a hook_update(), for example):

function _example_update_an_homepage_block() {

  ## CUSTOM ANON HOMEPAGE HERO BLOCK ##
  ## Edit $data array elements to update in future ##

  $data = array();
  $data['filename'] = 'bkgd-banner--front.png'; # Lives in the images/ folder of example module
  $data['textblock'] = '<h2>Example.org is a community of practice site.</h2>'

<p>Sign up now to <b>learn, share, connect </b>and<b> collaborate</b> with leaders and those in related fields.</p>
';
  $data['cta1'] = array(
    'url' => '/user/register',
    'text' => 'Get Started',
  );
  $data['cta2'] = array(
    'url' => '/about',
    'text' => 'More about the Community',
  );

  ## DO NOT EDIT BELOW THIS LINE! ##
  ##################################

The rest of the function does the heavy lifting:

  # This code cobbled together from `social_core.install` and # `social_demo/src/DemoSystem.php`
  // This uuid can be used like this since it's defined
  // in the code as well (@see social_core.install).
  $block = \Drupal::entityTypeManager()->getStorage('block_content')->loadByProperties(['uuid' => '8bb9d4bb-f182-4afc-b138-8a4b802824e4']);
  $block = current($block);

  if ($block instanceof \Drupal\block_content\Entity\BlockContent) {
    # Setup the image file
    $fid = _example_setup_an_homepage_image($data['filename']);

    $block->field_text_block = [
      'value' => $data['textblock'],
      'format' => 'full_html',
    ];

    // Insert image file in the hero image field.
    $block_image = [
      'target_id' => $fid,
      'alt' => "Anonymous front page image homepage'",
    ];
    $block->field_hero_image = $block_image;

    // Set the links.
    $action_links = [
      [
        'uri' => 'internal:' . $data['cta1']['url'],
        'title' => $data['cta1']['text'],
      ],
      [
        'uri' => 'internal:' . $data['cta2']['url'],
        'title' => $data['cta2']['text'],
      ],
    ];

    $itemList = new \Drupal\Core\Field\FieldItemList($block->field_call_to_action_link->getFieldDefinition());
    $itemList->setValue($action_links);
    $block->field_call_to_action_link = $itemList;

    $block->save();
  }
}

The image helper function prepares the image field:

function _example_setup_an_homepage_image($filename) {

  // TODO: use a better image from the theme.
  // Block image.
  $path = drupal_get_path('module', 'example');
  $image_path = $path . DIRECTORY_SEPARATOR . 'images' . DIRECTORY_SEPARATOR . $filename;
  $uri = file_unmanaged_copy($image_path, 'public://'.$filename, FILE_EXISTS_REPLACE);

  $media = \Drupal\file\Entity\File::create([
    'langcode' => 'en',
    'uid' => 1,
    'status' => 1,
    'uri' => $uri,
  ]);
  $media->save();

  $fid = $media->id();

  // Apply image cropping.
  $data = [
    'x' => 600,
    'y' => 245,
    'width' => 1200,
    'height' => 490,
  ];
  $crop_type = \Drupal::entityTypeManager()
    ->getStorage('crop_type')
    ->load('hero_an');
  if (!empty($crop_type) && $crop_type instanceof CropType) {
    $image_widget_crop_manager = \Drupal::service('image_widget_crop.manager');
    $image_widget_crop_manager->applyCrop($data, [
      'file-uri' => $uri,
      'file-id' => $fid,
    ], $crop_type);
  }

  return $fid;
}

Conclusion

As with most things I’ve encountered with Drupal 8 so far, the Update system is both familiar and new in certain respects. Hopefully these concrete examples are instructive to understand how to adapt older techniques to the new way of managing install and update tasks.

The article Drupal 8 hook_update() Tricks first appeared on the Consensus Enterprises blog.

We've disabled blog comments to prevent spam, but if you have questions or comments about this post, get in touch!

May 29 2019
May 29

Our developer Peter is one of the release managers of the upcoming PHP 7.4 release. Even though he has a lot on his plate right now, he was able to take the time to answer a few questions and give us a glimpse into what new features we can expect. Enjoy the read!

1. How did you first get involved with programming, in particular with PHP?

I got involved with programming during my time at university; I’ve been always interested in computers and this hacky, programming stuff. I discovered PHP very soon since it was very popular on the web development scene and so I started building websites with it. 

Back then we were using all kinds of spaghetti code frameworks and some first CMSes such as Mambo (which was then forked and became Joomla!), then we moved to open source frameworks, starting with PHP as early as in version 4. Following that, I started working with PHP more and more - and now here I am. 

With the arrival of GitHub and its impact on open source, I felt very drawn to open source. GitHub allowed people to connect on a totally different level, enabling easier collaboration of people from all over the world; it’s so widespread that people from anywhere on the planet can help and contribute patches to open source projects and this is also how I started contributing to PHP.

This was all on my own initiative; I was very interested especially in the open source framework Symfony which presented a huge leap for PHP and improved the PHP ecosystem drastically. Then I also got more interested in PHP in particular, i.e. the core and what is happening behind the scenes in PHP, and I started submitting patches there as well because I found some bugs and tried to fix them. 

2. How did you then get to the position of a PHP release manager? Did you volunteer?

No, I didn’t volunteer to be one of the release managers. Rather, I got nominated by the PHP internals community members. I do enjoy it, though. This is my first time as a release manager, so I’m still quite a newbie. Some people from the community also jokingly call me “newcomer”.

It’s quite a challenging project. There are established workflows and teams behind it so a lot of knowledge is needed to participate efficiently. On top of that, constructive and quality cooperation to get along with other community members and their workflows is essential.

3. What are the responsibilities and tasks of a PHP release manager?

A PHP release manager works periodically where he or she creates PHP distribution packages (tarballs) for the release candidate (RC) and stable releases every 2 weeks. With each release it needs to be checked if all tests pass and if changelogs are updated, and certain files needed for further compilation from the end users’ side need to be generated. Release announcements also need to be made over the mailing lists with each release. It is a very “long-distance” task, lasting for several years (minimum 3 years for the period of the particular PHP branch support). 

Here, I have to point out that I’m actually one of the two release managers - the other one being Derick Rethans, author of Xdebug, who is more familiar with PHP internals. This week we had our first meeting where we discussed and synced our workflows.

It can however be a very stressful task, since people expect a lot from you for tasks on an open source project. It all depends on people’s free time, because they usually have their daily lives with work and thus need to coordinate their time very well. Of course, the community expects the release to be done on the exact date, and everything needs to work without any problems, so that Drupal and other PHP projects work with the new version as flawlessly as possible.

So, we could definitely say that the role of a release manager entails both the more tech-oriented and the marketing aspects.

4. Did you encounter any challenges with the development of this minor release? What about with version 8.0 which is coming next year?

The 7.4 version is a minor, less important and mostly a boring release - this is good because upgrades will also be very simple from previous PHP 7 versions. The next major release, PHP 8.0, will have a bigger impact but it’s not yet certain which exact new features will be included, because the plan contains many of those which the community isn’t yet familiar with.

For PHP 7.4, however, there have been a lot of new features, e.g. the integration of the FFI (Foreign Function Interface) extension - a completely new extension. FFI opens up a new, broader world to PHP besides web development. For example, machine learning and similar. There are still some bugs though so it is still marked as experimental. It should get stabilized over time before the PHP 8 release.

So, with the current plan, on June 13th we’ll see the first alpha version of PHP 7.4. This one won’t be a feature freeze milestone yet. That one is planned for July 23rd. Up until that point we can include new features, not only bug fixes, but also new functionality.

This is where RFCs (Requests for Comments) come in. An RFC is a document for proposing changes to the PHP language.

The RFC process includes discussing a request on the mailing list and then it goes to a voting phase for 2 weeks if the initial feedback looks promising. So, for example, less than two weeks before the feature freeze we can no longer expect the RFC to appear in the PHP 7.4 version. In this case, it should then target the PHP 8.0 release.

In PHP, while this is an official process, someone who has been involved with a project for a very long time might still veto a certain RFC. This is something that happens very rarely though, but it did happen with one of the RFCs targeting the 7.4 release (deprecation of the short opening tags) - the community might not be super happy about it, but let’s see what comes out of it. There might still be other ways of solving this using a different deprecation way and future changes.

5. Besides the stuff we already discussed, what other new features can we expect in next month’s release? What about in PHP 8.0?

The 7.4 version actually has a lot of new features; they’re also listed here. There are some backwards incompatible changes which means that code will need to be tweaked a little in some cases. Strictly speaking, minor versions shouldn’t contain any backward incompatibilities. These should happen in the major release. However PHP seems to allow minor BC breaks here and there, so the language can progress further.

Besides the previously mentioned new FFI extension, an interesting new feature is preloading. It means loading PHP classes or functions directly into the memory. When you run the program, it works faster compared to usual autoloading approaches. This is a relatively small but important feature as it has long-term potential to be used instead of the autoloading in certain cases.

There are a ton of new features and some extensions were removed since they are no longer properly maintained. Typed Properties is another big thing, very useful for object-oriented programming.

One of the major new features in the next major release PHP 8.0 will certainly be JIT - Just-in-time compiling. It was planned for the 7.4 release but based on the RFC voting it was decided it’s still a bit too early to release it and more time is needed for thorough testing. It’s quite a different concept of compiling PHP code internally and in combination with the FFI extension it enables some really cool stuff because it opens up a whole new world of possibilities to PHP beyond just the web. 

6. What does it mean to you that the community has selected you as one of the release managers for this version?

It’s a very interesting role, so it’s interesting also from the point of view of experience and a chance to see how other open source projects are run, and most of all a chance to directly help out PHP the best I can.

I’m definitely happy with being chosen. In fact, I must admit that in the beginning it was mostly other people that were proud, but I quickly realized that this really is a big thing. You have to put a lot of work into it. Performing a task at specific times of a month is very very very exhausting; luckily, there are a number of people who feel very at home doing this, they can help out or even fill in. E.g. someone who’s an expert in a certain field can step in, so for example a 7.2 release manager can help out with the 7.3 release if someone goes on vacation, has to take a leave or something like that.

The new version has to be released, but there are of course human errors, it takes a lot of synchronization and good communication, as well as getting along with other people working on the project - if you don’t get along, you can’t collaborate effectively. 

7. Now that you’ve broken the ice, do you think the community will nominate you to be the release manager of a future release, maybe even a major one? Do you perhaps even plan on volunteering?

I’ll definitely continue contributing to PHP the best I can. I see PHP’s progress more through the extensions and PHP libraries contributed by the community, not so much through the core. I think the entire community is a vital part of PHP to function as it should and to be a successful language further on.

Oh, next week we’re hosting a local PHP meetup in our offices in Ljubljana, where I’ll also be presenting an interesting PHP topic, i.e. the upcoming PHP 7.4 version - you guessed it, right? :) It'll be a short presentation about the features of PHP 7.4, how to upgrade and what to expect. I’ll also briefly explain some PHP internals things. We’ll do our best to make it fun and interesting. :)

May 29 2019
May 29

Search Engine Optimization (SEO) might not be the first thing you think of when designing a new website, but building an optimized framework from the start will help you drive traffic to your site and keep it there.

With our Drupal SEO checklist in hand, you can build an excellent website that draws customers in as soon as you launch. To give you a quick summary before we go into detail, here’s a bullet list of what to check before the launch day.

  • Check that all web pages have unique titles using the Page Title module

  • Check if your XML Sitemap and Google News Sitemap are configured properly

  • Check if the Redirect module is enabled and configured

  • Check if the Global Redirect module is enabled and configured

  • Check that .htaccess redirects to your site

  • Check that your homepage title includes a descriptive headline, logo, and primary image

  • Check if your meta tags are filled with descriptive information

  • Check that OG tags are filled correctly and with descriptive information

  • Check if your site's information displays well when shared on social

  • Check if your path alias patterns are meaningful

  • Check if Google Analytics is enabled and configured

  • Check if Site Verification is enabled and configured

  • Check if Search 404 module is enabled and configured

 

Drupal SEO: 13 Things that Will Improve Your Site's Ranking

 

1. Check that all web pages have unique titles

Titles are the first element that any user will see --whether they come directly to your site, find it on a search engine, or see it shared on social media. Not only do good page titles help customers who are already on your site, but they help with social sharing, and picking your site out of search engine results.

All of your pages should be easily identifiable to the end user. Not only should they have unique titles, but they should also have meaningful titles. Having multiple pages with the same titles (like “Get in touch”, “Contact us” and “Make a booking”) will simply confuse your end users and search engine crawlers.

From an SEO perspective, page titles are among the most important types of data you can fill, because they help search engines understand what each of your web pages is about.

Writing good titles is extremely important, and having keywords in your title that match a user's search greatly improves the chances of them clicking on your page. Moz suggests the following format for title tag design: Primary Keyword - Secondary Keyword | Brand Name.

You can set up unique page titles much easier if you install the Drupal Page Title module.

 

2. Check if XML Sitemap and Google News Sitemap are configured properly

The XML Sitemap module for Drupal creates a robot-friendly map of your site that Google and other search engines can crawl to categorize your website. You should configure XML Sitemap early in your site build for the best effect, but you can also alter the settings later on at admin/config/search/XML if needed.

You can view your sitemap from http://yoursite.com/sitemap.xml (just replace “yoursite.com” with your own domain).

Google News Sitemap offers a similar but different service that creates a Google-specific map for ranking under their “News” section and to appear as news items on their main SERP pages. These two modules work nicely side by side to make your site easy for search engines to crawl and index.

Google News Sitemap

Image from Drupal.org

Please note that if your site contains accelerated mobile pages (AMPs), there is no need to create sitemaps for them. The rel=amphtml link is enough for Google to pick up on AMP versions, which means you can easily gain traffic from Top Stories carousels and mobile search.

 

3. Check if Redirect module is enabled and configured

Redirect is a handy module for making sure users always make it to your site. It uses case-insensitive matching to help catch broken links with redirects and tracks how often users are hitting those redirects.

You can use redirects to capture any broken links, set up promotional links, or simply capture typos users are entering when trying to access your site.

Drupal SEO: Redirect Module Enabled

Image from webwash.net

 

4. Check if Global Redirect module is enabled and configured

If you’re using Drupal 8 you can skip this one because the functionality has been rolled into the Redirect module. Otherwise, install Global Redirect to work in tandem with Redirect to catch any broken links.

Global Redirect will test all links with and without a trailing slash, ensure links are case-insensitive, and if a link is truly broken, it will return a user to your home page rather than a 404 page that decreases the position of your site in SERPs.

Global Redirect Module

Image from webwash.net

 

5. Check that .htaccess redirects to your site

Some users attempting to visit your site will navigate to www.yoursite.com, while others will simply type yoursite.com. By setting up your site to handle either request using an .htaccess redirect, you can be sure you won’t miss any visitors.

 

6. Check that the homepage title includes a descriptive headline, logo and primary image

Design a homepage title that contains a descriptive headline as well as a slogan, to represent who you are as a business. This is usually the first impression you give off to visitors the moment they land on your site or catch your entry on a search engine.

This is a good opportunity to load your website up with SEO-friendly keywords, but don’t go overboard and sacrifice your image for it - keyword stuffing may not only decrease the trust index of your site but also its conversion rates.

Vardot Website

7. Ensure that your meta tags are filled with descriptive information

SEO-optimized meta tags remains to be one of the top on-page ranking factors. You can think of these as expanded page headers --short-form descriptions of your website that give users and search engines a clearer idea of what to expect out of a webpage.

Make sure to install the Metatag module on your site to have an easy, user-friendly interface for updating metadata. With the module installed you can easily populate meta data with keywords, page descriptions, and more.

The Metatag module will also give you extra control over how your site appears when shared on Twitter or Facebook.

8. Check that OG tags are filled correctly and with descriptive information.

OG tags are meta tags specifically designed to ensure your site communicates nicely with Facebook. By setting these tags correctly you will be able to control exactly how your site appears on Facebook, including what images and what taglines are used.

 

9. Check if your site information displays well when shared on Facebook and Twitter

After configuring the Metatag module and OG tags, pop over to Facebook and make sure that your site shares the way you would like it to. It’s important to test this out now before users start sharing your site.

Similarly, try tweeting a couple of your pages to see how well your Twitter Cards come through. If you don’t want to show your site to your audience until you are sure it’s set up properly, you can check Twitter Cards using the Card Validator.

For more information on configuring Twitter cards, check out these user guides by Twitter.

Vardot Facebook

10. Check if your path alias patterns are meaningful

By default, Drupal will set your URLs to node/123 - while this works great for the database backend, it doesn’t work well for your end users, or for search engines.

You can use the Pathauto module to create rules and patterns for your URLs that will significantly cut down on your maintenance times and simplify your site navigation.

11. Check if Google Analytics is enabled and configured

While having Google Analytics configured won’t improve your SEO, it will give you all the data you need to understand where your users are coming from and how they behave once they hit your site.

Installing the Google Analytics module makes setting up and configuring Google Analytics a breeze.

12. Check if Site Verification is enabled and configured

Having your site verified will make it easier for search engines crawlers to reward you with a higher rank, and for Google to allow you to access private search data. With site verification, you will receive better data and better search engine rankings for just a few minutes work.

The Site Verification module makes it easy to prove to search engines that your site is truly your own.

13. Check if Search 404 module is enabled and configured

The Search 404 module is a saving grace for reducing your bounce rate and SERP rankings, as well as for improving your overall user experience. Instead of your users finding an ‘Error: Page not Found” in place of the content they were hoping for, they will be offered a search of your site based on the URL string.

For example, if www.yoursite.com/great-seo-tips doesn’t exist, use this module will automatically search your site for “Great SEO tips” and show visitors the results.

While SEO may seem like a tricky subject to wrap your head around, the basics are easy with the right modules and guidance, and Drupal is a great content management system for building search engine optimized websites.


If you liked our SEO checklist, then check out the other educational materials that we at Vardot have designed to help you build a top quality website. If you’re looking for even more ways to improve your site’s SEO, have a look at SEO articles on our blog --or better yet, get in touch with our team!

May 28 2019
May 28

This is the second post in a two part series focused on specific platforms for experience-led ecommerce. The first post focused on Drupal, an open-source CMS, as an excellent option for creating content-rich customer experiences when combined with an ecommerce component of your choice. This post will focus on BigCommerce, an increasingly popular open SaaS ecommerce platform, and how its strengths in ecommerce can be complemented by an integration with Drupal.

A quick introduction

Like the last post, here’s a quick introduction to the main concepts and software discussed.

SaaS

Whether it’s accounting, marketing, ecommerce, etc., SaaS (software as a service) platforms are a great option for many businesses. With this service model, businesses simply sign up and pay a monthly fee to use the platform. This is an attractive option because the cost is generally quite reasonable and the onus is on the service provider, not the business, to host the service and keep it up and running. For a business, it’s hands-off and requires little to no IT staff to manage.

Open SaaS

Open SaaS is still a relatively new term and has a couple different meanings. For this post, I’m using open SaaS to describe a SaaS services that is also open for integration and innovation through APIs and webhooks. This means that a business can use the SaaS service as-is, but it’s not restricted by it. This will become more clear the further you read through this post.

BigCommerce

BigCommerce is gaining popularity as a SaaS ecommerce platform. As a service, BigCommerce provides everything a business needs to quickly create an online store and start selling products. It has a wide variety of customizable themes available, supports custom themes, and has an extension library to add additional functionality to the base platform. While this is all quite normal for SaaS ecommerce, what makes BigCommerce an exciting platform is it’s commitment to being open via APIs and webhooks. This allows BigCommerce to be used as a headless backend store management area with the front-end of your choice, opening up a world of possibilities for creating customer experiences not previously possible with other popular SaaS ecommerce solutions.

SaaS at different stages of growth

Ecommerce businesses can grow quickly. Being set up for scalability to handle this growth is extremely important early on to eliminate headaches later on. This is the main reason why all of us at Acro Media are always talking about the importance of utilizing the right commerce architecture. The right architecture will enable a business to scale effectively without bottlenecking operations with swivel-chair processes. BigCommerce is uniquely capable of handling this growth, from startup all the way up to enterprise powerhouse.

Click to discover your ideal architecture with our analysis.

SaaS for startup and small businesses

For many small ecommerce businesses, SaaS ecommerce platforms like BigCommerce provide a quick and cost-effective solution to get to market. These businesses typically have a low IT budget and are just looking for solutions that are easy to implement and use. In many cases, SaaS checks these boxes and is the perfect starting point. This is why platforms like BigCommerce, Shopify and SquareSpace have become so popular. We call this scenario commerce-led because the ecommerce platform used dictates what other software and integration are also used in combination.

SaaS for medium, large and enterprise businesses

While SaaS is typically great for startups and small businesses, established businesses are an entirely different situation. They’re now looking at technology as an enabler for reaching the next level. They see personalization and the customer’s experience as an area where they can differentiate themselves from their competitors. These businesses are now hitting the limitations and restrictions of their SaaS ecommerce platform due to the fact that SaaS is typically built for the most common use cases and is therefore rigid in allowing these businesses to add the unique functionality and the integrations that they need. As technological requirements for a business changes, the software used must change too. These businesses are now looking at investing in stable technology that increases efficiencies, automates time consuming tasks, and gives them the edge in defining their customer journey. This may mean moving away from a commerce-led architecture and into experience-led. Often, ecommerce replatforming is part of this move.

BigCommerce is different

So, where does BigCommerce and Drupal fit into the mix. As I mentioned earlier, BigCommerce as a SaaS service is an ideal ecommerce platform for startup and small business. Not only does it give these businesses the ecommerce tools and stability needed to easily conduct business online, but it’s uniquely capable of growing with these businesses further, all the way through to enterprise.

How? Through BigCommerce’s open APIs and webhooks, BigCommerce can be run headless as a robust and secure enterprise-level ecommerce backend that compliments the incredible content experience capabilities of Drupal as the frontend. This means that these businesses can start with a SaaS solution that works great and then replace the frontend with Drupal if and when it makes sense to do so. They integrate directly together, creating a SaaS & open source hybrid ready to disrupt the insanely expensive enterprise ecommerce space, finally giving companies a capable and cost-effective alternative solution that is built for growth, scalability and integration.

Why Drupal?

If you haven’t read the first post in this series, I’d recommend you take a moment to do that. It discusses the strengths of Drupal for experience-led ecommerce complete with some examples. In short, customer experience is seen as a major competitive advantage in established ecommerce and Drupal is able to provide that experience while also being able to integrate with the ecommerce component of your choice. One choices being BigCommerce.

How it works

Acro Media teamed up with BigCommerce to create the BigCommerce for Drupal integration, so we are very in-tune with the strengths of both platforms. Here’s a high-level breakdown of how the integration works.

  1. Set up a BigCommerce store
    The business signs up for an account with BigCommerce and adds products, payment gateways and shipping options as it normally would. The BigCommerce backend is used for all of the ecommerce functionality, so the store configuration happens here.

    As mentioned earlier, existing BigCommerce store’s don’t need to create a new store for this integration with Drupal to work. Drupal just replaces the frontend, so the integration can happen at the beginning or anytime in the future.

  2. Connect BigCommerce and Drupal
    Drupal is then installed separately and the BigCommerce for Drupal module is added along with any dependencies. The module’s settings page within Drupal is where the BigCommerce store is connected and products get synced. This brings the products into Drupal as content.
  3. Complete the Drupal website frontend
    The rest of the website is then built within Drupal like any normal Drupal website. This involves setting up additional content types, configuring the display of this content and imported products, and finally theming the site.

That’s it! Drupal is where the content lives and what customers interact with. Operational staff who manage the store and fulfill orders do so within BigCommerce. When customers decide to purchase products, they do so through an embedded BigCommerce secure checkout.

And there you have it, the best of both worlds!

Further information

Interested in learning how your business can leverage the strengths of BigCommerce and Drupal together?

Discover BigCommerce for Drupal

Or check out these related resources.

May 28 2019
May 28

I recently decided to begin rebuilding the various landing pages on DrupalEasy.com using Layout Builder, introduced as a stable module to Drupal 8.7 core. Prior to this, the various landing pages on the site had been built using Paragraphs module.

While I appreciate what Paragraphs module can do as a layout tools for individual entities, I learned the hard way that perhaps it isn't the best tool for the job of building landing pages. 

I've been keen to use Layout Builder for awhile, but also hesitant to make the switch. Layout Builder has (unstated) lofty goals - to be the de-facto method of building landing pages in Drupal. I'll be perfectly happy if I didn't have to use Paragraphs or Panels in the future, instead relying on a core module.

I was biding my time until Layout Builder was stable in core, and now that it has come to pass, I wanted to take the time to rebuilding our landing pages while updating their content, layout, and styles just a bit.

Use layout builderFor starters, I created a new "Landing page" content type. Knowing that all of our landing pages will just be a series of blocks, I didn't add any fields - in fact, I removed the default "Body" field from the content type. I also created a default layout by selecting the "Use Layout Builder" checkbox on the content type's "Manage display" page. Knowing also that I may want to tweak the layout of some of our landing pages, I also selected the "Allow each content item to have its layout customized." (this effectively replaces the Panelizer contrib module). 

From there, I clicked the "Manage layout" button and set up a default layout for our landing pages. I'm not going to take you step-by-step through the process, but it's quite intuitive - and far better than any of the community's attempts to provide a browser-based layout tool in the past (no offense to anyone who has tried - it's a really difficult problem!)

After that, I created a new "Landing page" node and went directly to the "Layout" tab. The default layout I created in the previous step was ready for me to populate - but I was also able to tweak the layout for just this node as well. The process for adding content to the layout is easy primarily because it utilizes Drupal core's settings tray functionality. Existing blocks, custom blocks, as well as fields belonging to the content type are easily placed. I especially like the "Show content preview" checkbox for simplifying (and speeding up?) the interface during construction. 

Show content preview

My experience wasn't without hiccups, however. I did run into a couple of issues that I'd imagine a few other folks will stumble upon as well.

First, I tried adding a system Search block to one of my layouts. When I did this, I was unable to save the layout. I traced this issue to an issue related to rendering form blocks inside Layout Builder. At the time of writing this post, I didn't feel there was a mature enough patch yet, so I opted to remove the Search block for now. 

As this site is hosted on Pantheon, **and its codebase is built on https://github.com/pantheon-systems/example-drops-8-composer** , I ran into an issue where I was unable to add a new section to any layout. Turns our it was caused by this issue - luckily the fix for this was easy.

Finally, as I use the Bootstrap base theme for this site, when adding a bit of styling, I noticed that I had to override (using CSS) some of the breakpoints that Layout Builder uses by default. Specifically, Layout Builder has a 40em breakpoint, which doesn't align with Bootstrap's (default) 768px breakpoint. Not a big deal to do with a little bit of CSS (Sass), but important to note nonetheless. I used the following Sass to align layout builder's 2-column layout with the Bootstrap breakpoint:

.layout--twocol-section {
  &.layout--twocol-section--50-50 {
    > .layout__region--first,
    > .layout__region--second {
      @media #{$mobile} {
        flex: 0 1 100%;
      }
      @media #{$tablet} {
        flex: 0 1 50%;
      }
    }
  }
}

Overall, I'm really happy with Layout Builder so far - the resulting landing pages are easier to update - both from a content and a layout standpoint. It also provides a good deal of confidence knowing that I'm now using a core solution that will only improve with time.

May 28 2019
May 28

As a marketer, you want to make sure that the content you create stays with them. But chances of standing out in the crowd are meagre.

Why?

Because

  • there's a lot of content out there on the web
  • you might not know what your visitor is looking for, so you are showing standard content
  • those of your competitors who do know the visitor needs and preferences have already started working on personalization
After all, personalized content does 212% better (Hubspot) than standard. Why should anyone miss it? 

While the value of personalization is clear, the task can be overwhelming to get started with. If your digital property is on Drupal, you can begin with some of the content personalization modules to yield higher ROIs.

But you must know the challenges before conquering them.

The Challenges with Content Personalization

Personalized messaging not only yields higher ROI but gets you more loyal customers. 45% of online users are more likely to shop on a website that shows personalized suggestions.

 

According to a 2017 research lack of resources (42 percent) and research data (23 percent) remain top challenges for marketers in implementing personalization.

Developing Content 

Content is the only component that's hyper-relevant to the concept. Catering a tailored experience means dynamic and coordinate messaging across multiple digital channels. The content cannot be isolated.

Having the right content strategy in place is crucial.  

Adding personalization to the mix, you’re dealing with the need for individualized content that fuels and satiates the psychological wants for different segments and personas.

personalization-srijan

In order to recommend that ebook on DevOps Consulting to a CTO, you need to have the basic content around.  

Gathering the Right Data  

While marketers realize that a data audit is important to understand the users, what remains a challenge is which data to refer to. For an effective implementation various pieces of customer data need to be brought together to assemble a complete view of the customer.

With a larger 'data lake' at work, identifying a single source of customer truth gets tougher.   

A Hubspot research found that targeted and personalized CTAs had a 42% higher view-to-submission rate than the ones that were the same for every user.


Well, it all can start off small with modules.

Content Personalization With Drupal

A big part of improving user experience comes down to validating the content on your website. Drupal already gives us structured content. Further, there is no restriction on which marketing tools you apply as the Drupal managed content can be turned into standardized data sharing formats with its API-first approach.

  1. Taxonomy: Taxonomy is the practice of classifying content. It is beneficial as it helps define the vocabulary for everything from menu and navigation schemes to view and display options.

    In Drupal 8, it is a core module which allows you to connect, relate and classify your website’s content. Taxonomy is important for personalization as it helps build associations between your personas and the personalized content you’ve created.

    It enable native or third-party personalization tools to identify and pick the right content to showcase to the right user. 

    This is most effective for making intelligent content recommendations content to the visitor. The vocabulary ensures your targeted persona is seeing all the content that's contextually relevant to their historical behaviour on your site.

  2. Smart Content Module: Moving a step beyond taxonomy, you would want to display targeted content that speaks directly to your prospect, to tip the conversion scales. The Smart Content module, can integrate with any data source to help you deliver segmented content based on industry, buyer stage, location or other crucial segments.

    Drupal_SmartContent_srijan
    The module is most effective in conjunction with Smart Content Blocks and Smart Content Segments.

    1. Smart Content Blocks allow you to insert a Smart Block on any page in order to hide/show/swap content within that block, based on the conditions set. They can be added anywhere that traditional content blocks can be placed.
    2. Smart Content Segments allow you to create, save and manage sets of conditions, called segments. Smart Blocks can use any segment(s) to display the corresponding content. For example, conditionally displaying a Smart Block if it's the user’s first time on the site or conditionally displaying a Smart Block to a mobile user.
  3. Acquia Lift: Providing a suite of tools for content personalization, Acquia Lift helps you create contextual digital experiences. It merges content and customer data into one tool, empowering organizations to deliver the most cohesive and personalized experiences across multiple channels and devices.

    Among its other features, Acquia Lift includes content syndication giving organizations the ability to use content from anywhere to personalize across any digital platform, including Drupal and non-Drupal sites.

    Image result for Acquia Lift logoIt has functionalities like drag-and-drop user interface for targeting messages, syndicating content, behavioural targeting, A/B testing, unifying customer profile, and combining anonymous and known online visitor profiles.

    With the ability to target audiences in real-time, marketers can scale their web personalization efforts in order to drive conversions and bottom-line results.

    This gives digital marketers more control over automation, testing and measurement of marketing activities.

Wrapping Up 

At the enterprise level, Drupal has personalization tools and features built right in. So you can show the most relevant message to each of your visitors.

And while setting up personalization can look daunting, Srijan is always at your service to realize your digital business goals. Our work with one leading US media conglomerate and Estee Lauder is a testimony of our customer service and expertise in Drupal. 

Looking to enhance your customer experience and drive more conversions? Speak to our team of experts to explore how to get started. 

May 28 2019
May 28

Since 2018, European site-builders have a legal obligation to meet a specific requirement. Their sites must display a banner to inform people about the use of cookies.

This European requirement is mandatory in order to comply with the GDPR (General Data Protection Regulation).

In other words, you must ask user permission if you want to store cookies on the browser of a European (EU) citizen.

The EU Cookie Compliance D8 module provides an easy way to manage this type of functionality. In this tutorial, you will learn about the installation and basic configuration of this module.

Let’s start!

Step #1. - Install the Required modules

Perhaps the most popular method to download Drupal modules is Composer

  • Open your terminal application and type:

composer require drupal/eu_cookie_compliance

How to Display a Cookie Compliance Banner in a Drupal 8 Site

After downloading the module, it is necessary to enable it.

  • Click Extend.
  • Scroll down until you find the EU Cookie Compliance module and check it.
  • Click Install.

You don’t need to install any further modules.

Step # 2. Configuring the Module

  • Click Configuration > System > EU Cookie Compliance.

This screen has multiple configurations. Let’s take them one by one.

  • The first configuration allows you to enable/disable the banner. After that, you can choose if you want to display this banner only to anonymous users, only to authenticated users or for both. By default, all these options are checked.

  • After that comes the Consent section. This is the most important part, if you want your site to be GDPR compliant, you have to check the second option (opt-in) Opt-in. Don't track visitors unless they specifically give consent. (GDPR compliant)

Be aware that you won’t be able to collect information from users who don’t accept the use of cookies by their web browsers. That is the law.

  • The third section deals with JavaScripts that will not load if the user has not given her consent. If you use the opt-out method, scripts will load until the user chooses to opt out.

You have to enter the full path to the scripts, each in one separated line into the text area. One example here is the Google Analytics script.

  • If you scroll down, you will find the Whitelisted cookies section. You can enter here the cookies that are mandatory for your site and have to be installed, despite the fact that the user has denied her consent. These cookies do not have anything to do with the personal information of the user or their browser.

  • The next section deals with the storage of the users, who have given their consent. The default option is Do not store. If you choose Basic Storage, the following information will be saved to your database:
    • User ID.
    • IP address.
    • Timestamp.
    • Consent method.
    • The actual revision of the privacy policy page.

  • The next section lets you configure the text to be displayed on the banner. You can also have a different version of these texts to make them look better on mobile screens. Pay attention to the HTML tags you are allowed to use (those are more than enough, to be honest). Let’s change these texts!

Cookie information banner message: <h2>Yes, we use cookies too</h2><p>By clicking <strong>any</strong> link on this page you agree with this.</p>

Consent button label: That's ok with me

Cookie policy button label: Our policy

Disagree button label: No way!

  • According to the GDPR, people have to be able to withdraw their consent in an easy way. That is why this module provides a floating tab that displays after the user has given her consent. Make sure the floating privacy settings tab option is checked. You are free to change these texts if you want to.

  • The Thank you Banner section lets you configure a banner that will be displayed right after the user gives her consent. I’m going to uncheck this option.

  • After the Thank you Banner section you will find the input field for the Privacy policy page of your site. You can enter the link to that page here.

  • In the Appearance section, you can tweak the look of the banners to match the colors of your site. Notice that the only mandatory value is the width of the banners. Feel free to play around with these options.

  • If you want to display the Cookie Compliance Banner only in European countries, you will have to install the smart_ip module or enable the geoip_country_code_by_name() PHP function on your Drupal installation. That goes out of the scope of this tutorial.

  • The Advanced settings section lets you exclude domains and paths you don’t want to be tracked. The /admin path is by default excluded. You can also set the domain of the cookie to a specific (global) URL in case you have multiple domains and want to track them in a consistent manner. I’m going to leave the default values here since I’m working on a development environment. The only two mandatory options here are:
    • Banner sliding animation time
    • Cookie lifetime (how long the cookie is going to be stored

  • Click Save Configuration

Step #3. - Testing the module

  • Open your site in a new browser as an anonymous user
  • The cookie compliance banner will appear on top of the site
  • Click the “opt-in” Button

The banner will disappear and the private settings floating tab will be visible on top of your browser (you’ll have to refresh the page if this does not happen).

  • Click the Privacy settings tab
  • Click Withdraw consent

This will make the banner disappear. It will appear again after 100 days (or the time you set in the cookie lifetime option). The cookie will not be tracked anymore.

I hope you liked this tutorial. Thanks for reading!


About the author

Jorge lived in Ecuador and Germany. Now he is back to his homeland Colombia. He spends his time translating from English and German to Spanish. He enjoys playing with Drupal and other Open Source Content Management Systems and technologies.

Pages

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