Simplify Drupal Commerce 2.x checkout by removing "Login or continue as guest" pane

Simplify Drupal Commerce 2.x checkout by removing "Login or continue as guest" pane

In just two simple steps you can remove the Login or continue as guest pane and simplify your checkout process. In my opinion, this step is completely unnecessary and just confuses your customers.

If your user is a returning customer, you're asking them to remember which email they registered with and the password. If your user is a new customer, you’re asking them to decide whether they want to create a new account on your website or proceed as a guest. Each option creates an unnecessary disconnect between the user and their goal – buying the product.

This isn't just my opinion. Check out what Neil Patel thinks why most online shoppers don’t make it past the first step of checkout.

Luckily, removing this pane in Drupal Commerce 2.x is easy.

The first step is to disable the Login or continue as guest pane by visiting the Checkout flows page (/admin/commerce/config/checkout-flows).

Disable login or continue as guest pane Drupal Commerce 2.x
Disable login or continue as guest pane Drupal Commerce 2.x

If you have the Commerce Shipping module enabled, then you probably have at least two checkout flows. To find out which one you are using go to your order configuration page (/admin/commerce/config/order-types) and search for the Checkout flow field.

Checkout flow Drupal Commerce 2.x
Checkout flow Drupal Commerce 2.x

The second step in removing the pane is to write a simple hook_ENTITY_TYPE_presave() hook. This hook will try to recognize a returning customer from the email address registered in Drupal.

/**
 * Implements hook_ENTITY_TYPE_presave().
 */
function MY_MODULE_commerce_order_presave(OrderInterface $entity) {
  if ($entity->getCustomerId() === '0' && $entity->getEmail() && $entity->getState()->getId() == 'completed') {
    $user = user_load_by_mail($entity->getEmail());
    if ($user) {
      $entity->setCustomerId($user->id());
    }
  }
}

As you can see, if we find a user with the email address then we are setting the customer ID to the order.

This way orders created by users that have an account on your site but are not logged in will have their order connected to their account.

And anonymous users that don't have an account on your site, will see the registration form at the end of the checkout process. So, if they want they can create an account. That is the responsibility of the Guest registration after checkout pane.

To wrap this post up, by removing the Login or continue as guest pane you are not changing anything for the logged in users. You are removing one step for the anonymous users, by not making them choose what to do. They will enter their email address, and by using this address you can figure out if they have an account on your site or not.

If I can be of assistance, please do not hesitate to contact me.

About the author

Goran Nikolovski is a highly experienced Drupal developer with an extensive skill set that includes PHP, MySQL, HTML, CSS and Javascript. He has experience with large Drupal sites and Drupal Commerce 2.x integration, and he is author of several Drupal modules.

You may also like

Drupal 8, nginx and Let's Encrypt

This site is powered by Drupal 8. I'm using Nginx as a web server and Let's Encrypt to add HTTPS encryption to my site. In this post, I will show you how my Nginx config file looks like.