Cart & Checkout

Drupal Commerce comes with a highly configurable checkout process by giving you a multi-step pane-based configuration engine. For more information on how this works, what functionality exists, and how to configure it, the following resources may be helpful:

When it comes to configuring the checkout process, many UI and procedural options are available. Whether you're looking to improve the anonymous checkout workflow, add order information, or completely customize the workflow, the resources below may be helpful to you.

AJAXify the cart and adding products to the cart

There are a couple of modules that take the cart and add ajax refreshing and management:

Commerce Ajax Add to Cart includes a bit of information on how it differs from the other two modules:

  • Commerce Cart Ajax - This module ajax-ifies only cart page. It does not ajax-ifies the teaser cart block. However, Commerce Ajax Add to Cart provides ajax-ified cart block and teaser cart block, and you can place them anywhere.
  • Commerce Ajax Cart - This module ajax-ifies only the teaser cart block.

You can implement ajax cart using these two modules (with some customizations as per your need). But "Commerce Ajax Add to Cart" provides ajax cart out of the box, and also you can customize its appearance.

One-page Checkout

By allowing for panes to be refreshed and loaded using AJAX, you can implement one-page checkout with Commerce Checkout AJAX.

Extra order information fields in checkout

Have you ever wanted to add extra fields to a checkout pane? Things like "special order instructions", "gift notes", or other information can be added easily with Commerce Checkout Field Group.

Commerce Checkout Field Group turns Commerce order field groups into checkout panes. This allows to add custom fields to the checkout pages.

The main difference between this module and the Commerce Fieldgroup Panes module is that this properly supports the Field Validation module.

Add extra information to each checkout step

Commerce Checkout Information lets you place extra information at the top of the checkout page.

Create new checkout steps without a module

If you need to add a new step to checkout but don't want to create a module to do so, Commerce Checkout Pages will let you do that. From the module page:

By default, drupal commerce has four pages (checkout, payment, review, complete) for the checkout process. Without using this module the only way to create additional checkout pages requires creating a custom module for each additional page. Commerce Checkout Paages gives site administrators the ability to create additional pages for the checkout process through the admin user interface. A common use-case is creating a new page to hold shipping information.

Put the cart and/or cart summary in the checkout flow

Commerce Cart Form Checkout Pane creates two panes–cart and cart summary–that can be put into the checkout flow.

Simplify button text

Use Commerce Checkout Buttons to make the buttons on your checkout pages smaller and replace them with minimal text.

All default ​​button values to be shortened to the shortest meaningful text.
Texts that are used:
Cancel at the first checkout step.
Back for further checkout steps.
Continue at all checkout steps.

Show payment information on order review

Want to add a payment summary on the order review page? Commerce Checkout Pane Payment may be what you are looking for.

Add a checkout progress block

Commerce Checkout Progress can do that. Just theme it to your liking.

Adds a block visible on checkout pages that shows what step of the checkout process the user is currently on. The status is an unordered list with each checkout page title being an item. The active page is designated in the list with an "active" class.

Add content in a checkout pane

If you're wanting to add content such as a Terms of Service or some other information related to the order, Commerce extra panes allows you have a piece of node content within the checkout process.

Add beans to checkouts pages

Use Commerce Bean to enable the placement of beans as a checkout pane.

Display Views in a checkout pane

Commerce Views Pane

Commerce Views Pane provides a Views display plugin to embed a view in a Drupal Commerce checkout pane. This plugin is similar to the Views block display, except it is for Drupal Commerce checkout panes instead of blocks.

Why use Commerce Views Pane?

  • You want to display a view during checkout and optionally pass any order data as a view's contextual argument.
  • You want to display order information on the checkout complete page.
    • Download links to files purchased.
    • Shipping information - addresses, tracking numbers, estimated delivery.
    • Payment transaction information