Thu. Jul 4th, 2024

1. Magento 2.x. How to add CMS block and Widget to the page

2 min read

The Content Management System (CMS) of your Magento 2 Store is used for creating new pages, blocks and widgets.

You can combine those 3 elements to create custom static pages that display parts of your catalog or other information, useful for customers.

In order to add CMS block and Widget to the page, perform the following steps:

  1. Login to your Magento Admin Panel. Firstly, we will learn how to add CMS blocks.
  2. Navigate to Content -> Blocks section.

    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page1

  3. Click Add block button on the right.
    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page2
  4. Enter the name, identifier to the block, choose needed Store view and put something to the content field. After that, save the block.
    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page3
  5. Now, lets create a widget. Navigate to Content -> Widgets

    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page4

  6. Click on the Add widget button.
    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page4

  7. Now you will need to select the type of widget and theme for it. Click on the Continue button to proceed to the storefront settings.

    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page6

  8. After that, you can set a Title and Store View for the widget.

    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page7

  9. You can also select a layout for the widget as shown on the storefront. After that, click on a Save button.

    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page9

  10. Navigate to Content -> Pages section. There you can open any of the already existing pages or create a new one. We will create a new page.

    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page12

  11. Click on the Add New Page button.

    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page8

  12. Now you can name the page and set a custom URL for it. You can also choose on which store it can be viewed and set its status to enabled or disabled (hidden).

    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page9

  13. In the content tab you can add the heading for the page and the content plus any widget you wish to show up on this page.
    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page12
  14. We will add a widget with the Static block type.
    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page13
  15. There we can see the block that we created previously.
    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page14
  16. Click Insert widget and do not forget to save the page and clear cache if needed.
    Magento2x.How_to_add_new_CMS_block_and_widget_to_the_page15

Congratulations! Now you know how to add CMS block and Widget to the page in your Magento 2x Store.

July 2024
M T W T F S S
« Jun    
1234567
891011121314
15161718192021
22232425262728
293031