How to Display CMS Blocks Using Widgets in Magento 2?

CMS blocks in Magento 2 allow you to display static or dynamic content on your website. Using widgets, you can place these blocks in specific locations, enhancing your store’s design and functionality. Follow this step-by-step guide to learn how to display CMS blocks using widgets in Magento 2.

Step 1: Access the Magento Admin Panel

Log in to your Magento 2 Admin Panel and navigate to Content > Blocks.

Step 2: Create a New CMS Block

Click the Add New Block button in the upper-right corner.

Step 3: Fill in the Block Information

1. Block Title: Enter the title for the block (e.g., “Static Banner”).
2. Identifier: Enter a unique identifier for the block. This will be used to call the block in your layout or code (e.g., static_banner).
3. Store View: Select the store views where the block should be visible.
4. Status: Set the status to Enabled if you want the block to be active.
5. Content: Use the Pagebuilder editor to add your content. You can include HTML, images, and other elements here.

Step 4: Save the Block

Once you’ve filled in the necessary details, click the Save Block button.

Create a widget in the Admin Panel:-

Step 5: Access the Magento Admin Panel

Log in to your Magento 2 Admin Panel and Navigate to Content > Widgets.

Step 6: Add a New Widget

Click the Add Widget button in the upper-right corner.

Step 7: Configure Widget Settings

1. Type: In the Type dropdown, select CMS Static Block.
2. Design Theme: Choose the appropriate theme from the Design Theme dropdown (usually, it’s the theme you’re currently using).
3. Click Continue.

Step 8: Fill out the Storefront Properties.

1. Give your widgets a Title.
2. Assign it to Store Views it should be active on.
3. Set the Sort Order.

4. Set the exact page and place where you want to display the CMS block in the Layout Updates.

• Choose any Category, Product or Generic Pages to place the CMS block.
• Select a Container, the exact place on the page where you want to display your CMS block.

Step 9: Go to Widgets Options and select the CMS block to assign to this widgets.

• Save the widgets.

Step 10: Clear the Magento cache

Run this command in your terminal:-

php bin/magento cache:flush

By following these steps, you can effectively display CMS blocks using widgets in Magento 2, ensuring a seamless user experience and better content management.

Need Help Optimizing Your Magento Store?

If you want to enhance your Magento store further and make it stand out, let us assist you!

💡 What We Offer:

• Expert Magento Development: From CMS block setup to custom themes and extensions.
• Performance Optimization: Ensure your store loads faster and delivers a superior user experience.
• E-commerce Strategy: Tailored solutions to grow your business and increase conversions.
• Continuous Support: Reliable maintenance and updates to keep your store running smoothly.

Contact our Magento experts for a free consultation or to learn more about how we can help you optimize your store.