CMS blocks have one or more slots. The slots (often columns) are each filled with one CMS element.
Click on the plus icon to select a CMS block
Select the desired CMS block in the "Block category" dropdown
Drag'n'drop the CMS block into your Shopping Experience
The CMS blocks in Shopware 6 have different configuration fields. In the section "Layout", for example, you will find the option to add "CSS classes" and to define the margins of the block.
You can give each block a name and add CSS classes. You can also define margins (technically it is the padding) of the block and assign a background colour and a background image. In the "Visibility" section you can also define on which device the block should be displayed.
In the block settings you also have the option of defining CSS classes for the corresponding CMS block. ThemeWare® offers you a number of CSS classes that you can use in your Shopping Experiences.
For all CMS blocks the following CSS classes are interesting:
You can find more classes in the following section "Tutorials" > "Shopping Experiences":
In addition, you can also use CSS classes: from , since the storefront in Shopware 6 is based on Bootstrap 5.
You can replace the CMS elements in most CMS blocks. You can learn more about this in the article .
You can find more information about ThemeWare® CMS blocks in the ThemeWare® Manual:
You can find more information about the Shopping Experience in Shopware 6 in the Shopware documentation:
