Ecommerce Drupal

How to create an ecommerce website with Drupal

Status of online retail in 2024

The beginning of 2020s was a challenge for trading.

On the one hand, it led to a drop in revenue for small and medium businesses and the shutdown of some of them. The survey conducted by PNAS showed that 43% out of 5,800 companies belonging to a small business referral network Alignable temporarily closed down. Most of all the coronavirus affected trade, art, entertainment, catering, and hospitality businesses.

On the other hand, the internet saved the business from a total crash. The survey by SearchNode indicates that 90% of the entrepreneurs surveyed saw an increase in online sales during the lockdown, and the increase was over 100% in 50 percent of cases. In particular, Walmart sales grew by 97%. BestBuy online sales had an even more impressive growth: 255% in the period between the second quarter and July 18. Amazon online and traditional retail sales increased by 40% and accounted for 88.9 billion dollars.

As time passed by, the pandemic conditions have become our new normal. Online retail keeps growing as if nothing happened. According to Statista, the overall income of online shops in 2021 reached 5 trillion dollars, including 3,5 trillion from mobile purchases. The future seems to be bright, too: the year 2025 is anticipated to generate 7 trillion dollars.

Online sales trends in 2024

There are several trends that describe online sales and user behavior over the past years:

  • omnichannel sales;
  • the BOPIS model (Buy Online, Pick Up in Store);
  • door-to-door delivery;
  • customer pick-up;
  • personalization;
  • active social media marketing;
  • subscription business model.

The perfect match looks like that now: a buyer anticipates and highly appreciates when a seller meticulously crafts and makes a special offer designed for a particular buyer’s need right here right now. The seller, in their turn, spies over customers across many devices to come up with that very special offer.

We hope that the conclusion is obvious for everyone: an ecommerce website available on all devices helps ensure a business's long life and profitability.

How to create an ecommerce website

First of all, the choice of technology for a retail website depends on the task and the size of your business. You may choose ready-made ecommerce website builders, such as Tilda or Wix, for a business with a simple logic of orders and payments and a small flow of customers (for example, a home bakery or local cafe).

The move from a small business to a medium and large one sets new tasks for its owner:

  • differentiation of access rights for users of the online sales tool;
  • scalability, as the website becomes high-load;
  • search for goods by several characteristics (or faceted search);
  • integration with CRM and other services.

In this case, you should turn to a ready-made CRM solution and ecommerce platform. There are many such platforms, but as a Drupal web development company, we will only talk about one of them.

Drupal ecommerce

Ready-made open-source platforms save the budget and are even more attractive during a crisis. With Drupal, you can manage both content and sales at the same time. It is a great success for all types of businesses and credit to the Drupal community spread all over the world. Is Drupal good for ecommerce? Yes. There are at least 12 reasons.

  1. Taxonomy. The Taxonomy module organizes the filtering and sorting of products in the product catalog of the ecommerce website. Without this, a webshop is impossible. For a while, developers had to download and install Taxonomy separately as any contributed module. But due to the high demand, it was included in the Drupal core.
  2. Data-driven approach in ecommerce. If you want your sales to be driven by content, you need full integration of the ecommerce platform and CMS (content management system). It rarely goes fast, but here we find one of the profitable advantages of Drupal: Drupal Commerce. This is an addition to Drupal, which plays the role of a module and framework. Below, we will expand on it.
  3. Hundreds of modules, distributions, and themes. The influence of the international Drupal community on the platform can not be overestimated: its members work on solutions to problems of any complexity so that owners can implement them on their retail websites.
  4. Integration with third-party services. For normal operation, you need to add payment systems and analytics systems, integrate with social networks, set up a chat, and automate the marketing of an ecommerce website on Drupal. Drupal’s core modular architecture and a multitude of modules give a CMS access to a wide variety of such tools.
  5. Ability to integrate with stores on popular SaaS-eCommerce platforms. In order to maintain and improve a Drupal site, its owner must be familiar with PHP, HTML, CSS, and JavaScript. If you are a non-tech person, you may be advised to start your ecommerce journey with a no-code Shopify store. But one day your business will grow, and you will want more freedom than a SaaS solution can provide. Drupal works with Shopify through a special module. It will help you add additional functionality to your existing store, such as payment processing, and a custom Drupal theme. It will also import products from the Shopify store so that you can later manage them through the CMS admin panel. In other words, the Shopify platform is used as an internal API, and the user interacts with the site on Drupal.
  6. Mobile-first architecture. If you want to help master those trillions that mCommerce projects will earn in 2025, your retail website must work on all mobile devices. Responsive design is one of the distinctive characteristics of Drupal.
  7. Multilanguage. People buy and sell all over the world, so any eCommerce/mCommerce project should be able to speak with the client in any language. Drupal knows about a hundred languages, including those that read from right to left.
  8. Inventory control. If you are selling clothes, they must have size parameters, color, and size. If your product is comics, then they can be divided into originals or translations, for persons older than 6 or 18, issued by one or another publisher, and so forth. The Drupal Commerce module includes the concept of a Stock Keeping Unit (SKU). This is an identifier that will be different for each product with different parameters. Also, this opportunity helps to control the stock balance.
  9. User Divisions. The buyer should not be given access to the admin panel as well as the seller should not have access to replacing banners and website themes.
  10. Good UX. The faster the user purchases from a website, the greater the chance that she/he comes back. Drupal can provide this speed, and adherence to the principle of Headless ecommerce would allow the user to move on between pages with lightning speed.
  11. Omnichannel. The more points of contact with a company customers have, the better. And Drupal has the potential to build an entire ecosystem of products. If you need mobile app development after creating the website, then there will be less work. Thanks to the same principle of Headless ecommerce, the content management system acts as a database, common for both the website and the mobile application.
  12. Regular updates. Drupal gets minor updates every month or so depending on the number of discovered vulnerabilities. We made the regular updates a part of our complex website audit offer.

Drupal ecommerce development

Drupal is often referred to as a platform in which it is enough to tick necessary checkboxes to get the first sales. Well, that’s an exaggeration! You will highly likely encounter the first obstacles during the Drupal configuration. Ask yourself, "If it were that simple, what would the large Drupal developer community be doing?" and get a step closer to creating a beautiful, modern, competitive, and secure online shop. A Drupal shop cannot be created without the knowledge that the community has gathered over the years. But we will still attach instructions for non-programmers: new knowledge will increase your self-esteem and subsequently allow you to communicate more effectively with the development team. 

First and foremost, Drupal allows you to post content on the website, and all other features are being added by Drupal-compatible modules. One of these is Drupal Commerce.

Being an open-source software, Drupal Commerce doesn’t require any fees to download. This module is a framework that allows for a native integration of commercial options into a Drupal website. The developer will quickly be able to link the module with any third-party application with the API-first principle. This is particularly important if your business is already integrated with some systems before creating an e-commerce website. Since this is a framework, all configurations, settings, and themes are created from scratch.

The basic set of entities that can be created with the help of Commerce includes:

  • Product — what is sold in the store;
  • Orders — one or more product units that the ecommerce site user puts in the shopping cartю It also includes conditions that have to be taken into account when calculating the final cost, for example a discount code;
  • Line Items — product unit of the with its properties (size, color, etc.), which will be taken into account when orders are created;
  • Payment Gateways — software that facilitates payment processing. These are either solutions developed by companies for their specific needs or ready-made systems, such as PayPal, Stripe, Braintree, and bank payment gateways.

Also, community members created useful modules for Drupal Commerce covering all possible retail needs: total delivery costs, inventory count, calculating fees and tax rates, and much more.

There are two versions of Drupal Commerce at the moment: Commerce 1 is compatible with projects on Drupal 7 and Commerce 2 is compatible with Drupal 8 and 9. Both can be downloaded from the official website of the Drupal platform.

How to build an ecommerce website with Drupal

Now we will show you how to create a simple phone store using Commerce. Let's call it Triline.

1. Download the latest Drupal core. This can be done in two ways:

  • using the Composer package manager. You need to send the command to its console: 

composer create-project drupal-composer/drupal-project:9.x-dev my_dir --no-interaction

The Drupal Commerce module would require setting external dependencies, so it is best to create your project using Composer. Alternatively, the required sets can be connected via the Ludwig module, but we recommend Composer anyway. Here are the alternative installation instructions of Composer for Ludwig users

2. Specify access to the database.

how to make a ecommerce website

Drupal offers you a choice between several website profiles that contain settings and content by default. If you don't need this, you may select the minimal profile. After the installation is finished, fill in the details on the Configure Site page.

3. Installing the Drupal Commerce module is only possible using the Composer package manager or using the Ludwig module. Check the documentation. The documentation is written for Drupal 8 but it is true for Drupal 9 as well.

4. You need to send the "composer require drupal / commerce" command to the console to download the Commerce module via Composer.

5. Go to the Advanced tab in the top admin menu and enable the required modules.

1-vklyuchenie-moduley

Optionally, you can enable the Commerce Tax module to add additional taxes.

Tex type

The Commerce Promotion module is used to create promotions, the Commerce Number Pattern is the tool for generating the identification numbers for your products, and the Commerce Store will be useful if you want to have several stores managed by a single system.

6. If you did everything correctly, the new "Commerce" menu item will appear in the administrator top menu.

7. To begin with, set up general store configurations, and only then you can create products. Go to "Commerce" > "Configuration".

Configuration

8. Add one or more currencies that users will use to pay for purchases. To do this, go to "Currencies".

Add currency

9. Go to "Commerce" > "Configuration" > "Stores" and create a new store. Fill in the required fields.

Edit Threeline

10. Add a new product type the same way. For a product type, you can set the minimum required set of fields that are common for all products and do not affect their price, for example a text description. The other characteristics appear in its variations.

Add product type

11. Add several attributes by clicking "Commerce" > "Product attributes". For example, for phones this might be a camera, screen size, memory amount, or color.

Edit  memory size

12. On the page "Commerce" > "Configuration" > "Types of product variations", edit your custom type and make sure you chose the attributes created in the previous step.

Add product  variation type

You can also add additional fields related to the entire variation, such as a product photo.

13. After we have prepared the structure, it's time to add some products. Go to "Commerce" > "Products" > "Add product".

Add Smartphone

14. Go to the "Variations" tab. Here you can set product variations with additional options (attributes) that we created in step 12.

Edit iPhone 12

15. Save your changes and go to the product page.

Product page

The module automatically displays a widget for switching attributes and loads the relevant variation.

Add view

16. Let's create a page that will display all products. To do this, go to "Structure" > "Views" and create a new view in the administrator menu. Select the "Show product" type (your custom type) and check the "Create the page" checkbox.

Product page 2

17. If you did everything correctly, when you go to the page that you created in the previous step you would see all products added to the website. This is the most basic use of Views and moving on to "Structure" > "Views" and choosing the one you want, you can customize this page, for example, set up the output of products or add search filters. The Search API and Facets modules for creating faceted searches can help you with this.

18. Orders we created can be seen on the page "Commerce" > "Orders".

Order information
Order  activity

We have reviewed the most basic functionality of the Drupal Commerce platform.

In the future, you will customize your website and choose a theme for it. On the official Drupal website, you can find many ready-made free themes or installation profiles that contain configuration settings and a theme. You can also consider paid builds on various platforms, such as ThemeForest.

Drupal Commerce supports many popular payment systems, such as Stripe or PayPal. You will learn about our experience with them in the next article.

Headless ecommerce

One backend to rule all sales channels

Before we conclude, let's talk about a trend in ecommerce development that is not going to go away. Headless (or Decoupled) ecommerce is the principle of developing not even a website but an entire ecosystem of products working for your business. This ecosystem can include a mobile application, an online checkout, a smart terminal, social networks, chatbots, and much more, in addition to a website. If you follow the Headless ecommerce principle, all data will be taken from the same server.

Let's try to explain the architecture of a Headless website in simple words. All invisible processes serving simple user operations like adding products to the shopping cart, paying, and applying gift cards and discounts are called business logic. It is processed on the server, which can also be built on the Drupal CMS.

The client side is responsible for the visible results of processing these operations. JavaScript frameworks such as React, Vue.js, or Angular are used for this development. Between the front end and back end, there is an interface that transfers data from server to client, for example, the Rest API or GraphQL.

The advantages of using this principle are:

  • reducing the load on the server due to only partial loading of Drupal,
  • reduction of time to develop the back end of the website,
  • using the JavaScript framework opportunities when developing the front end instead of Drupal themes and templates.

Conclusion

When they try to convince you again that an open-source CMS is very simple, remember that Drupal and all technologies compatible with it are built in PHP, and PHP is one of the most popular and seemingly simple programming languages. Connecting with payment systems, mapping out the page layout, integrating with analytics systems, setting up email newsletters, etc. is difficult, and therefore it isn’t worth your time. That way, each partner can do its part: you are looking for new sales and marketing channels, and the development company is creating and supporting the store and also improving its user interface

You might also like