Extending Bolt / Bolt Widgets

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: