Magento 2 Widgets

Magento 2 Widgets are reusable components that allow you to display dynamic or static content on CMS pages, blocks, or sidebars—without writing code.

—

📦 What is a Magento 2 Widget?

A widget is a small block of code that allows admins to add and configure dynamic content visually from the Magento backend.

Common Use Cases:

• Product slider on homepage
• Promotional banners
• Dynamic product listing by category or attribute

—

🛠️ Add a Widget via Admin Panel

1. Go to Content → Elements → Widgets
2. Click “Add Widget”
3. Select a Type (e.g., Catalog Products List)
4. Choose Design Theme
5. Click Continue
6. Fill in the required widget options (like Title, Display On, Layout updates)
7. Save and clear cache

—

📌 Example: Add a Product List Widget

1. Widget Type

Catalog Products List

2. Options

• Display Type: All products or filtered
• Conditions: Category = Electronics

3. Layout Updates

• Display on: CMS Homepage
• Container: Main Content Area

—

📁 Create a Custom Widget Programmatically

Step 1: Define widget.xml

  
    Custom Static Text
    Displays static text
    
      
        Title
      
    
  

  

—

Step 2: Create Widget Block

<?php
namespace Vendor\Widget\Block\Widget;

use Magento\Framework\View\Element\Template;
use Magento\Widget\Block\BlockInterface;

class StaticText extends Template implements BlockInterface
{
    protected $_template = "widget/static_text.phtml";
}
  

—

Step 3: Create Template File

  
<?php echo $block->getData('title'); ?>

  

—

🧠 Summary

• Widgets allow non-developers to manage dynamic content visually.
• You can add widgets via the admin panel or code.
• Custom widgets are ideal when built-in types aren’t enough.