Extending Bolt / Bolt Widgets

Note: You are currently reading the documentation for Bolt 4.0. Looking for the documentation for Bolt 5.2 instead?

Widgets allow you to provide an interface to the user for your extensions. For example, a widget can add a card element to the Bolt Dashboard, or an extra button to the frontend of the site.

To create a widget, simply create a new class in your extension that extends Bolt's BaseWidget class like so:

<?php

declare(strict_types=1);

namespace App;

use Bolt\Widget\BaseWidget;
use Bolt\Widget\Injector\RequestZone;
use Bolt\Widget\Injector\AdditionalTarget;
use Bolt\Widget\TwigAwareInterface;

class TimeWidget extends BaseWidget implements TwigAwareInterface
{
    protected $name = 'Edit This Page Widget';
    protected $target = ADDITIONALTARGET::WIDGET_BACK_DASHBOARD_ASIDE_TOP;
    protected $priority = 300;
    protected $template = '@time-extension/time.html.twig';
    protected $zone = RequestZone::FRONTEND;
    protected $cacheDuration = 0;

    public function run(array $params = []): ?string
    {
        $time = new \DateTime();
        return parent::run(['time' => $time]);
    }
}

The TimeWidget class above will run on the frontend of the site, all that is left for to do now is create a twig template to render the current time. Simply create a templates folder at the root level of your extension, with the time.html.twig file inside:

<p>Current time: {{ time|date }} </p>

Configuring the widget¶

The TimeWidget class above used several variables to configure how and where a widget is displayed, using the following options: