Commerce

Webshops are very popular. We looked forward to the new Drupal 8 Commerce module and his extentions.

Wat do you get after installing the Commerce module, and only the commerce module.. Well there are many submodules. So it is not only Commerce.

Look what you need..

Drupal8_002165.png

In 25 seconds with composer...

Drupal8_002125.png

The  submodules ...

Drupal8_002168.png

There is a tab 'Commerce'. From there you make and configure the whole shop and his products. No content types needed any more. A commerce product has its own URL!


Drupal8_002156.png

To start with.. A special one. Currency needs a currency numeric value...

Drupal8_002166.png

You find it on the net.

Drupal8_002167.png

There still are product types and their variations. These variations are configured in variation types. So briefly, product types are for the commen properties. The variation types are for the specific properties.

If we want to sell TShirts. The tutorial to wash the shirts will be in the product type, the color and size will be in the variation type.

A product type example.
Drupal8_002157.png

A variation type example.... I have made an image field in order to change the picture according the chosen color.
Drupal8_002158.png

Variations are made in the shop configuration. No taxonomy!
Drupal8_002159.png

Each variation type can have its own fields too. I added chest and length to the size.


Drupal8_002160.png

When adding product you can see the 2 types. (product and variation)


Drupal8_002161.png

The variation part has default an inline form.


Drupal8_002162.png

Easy..
Drupal8_002163.png

Also included.. Promotions and coupons.


Drupal8_002164.png

To display the products you need a good allround knowledge of Drupal. Colorbox, DS,...

Drupal8_002152.png

And of course..views. Here an example of a view in combination with an other view showing the available variations. (views field view module)

Drupal8_002151.png

Add Some CSS..

Drupal8_002153.png

The shopping cart is waiting for you..
Drupal8_002154.png