Vývojář Vlastní bloky

Vlastní bloky

Každý blok ve vizuálním builderu je PHP třída vracející BlockDefinition. Tento článek ukazuje, jak postavit a zaregistrovat vlastní blok — od jednoduché stylované sekce po blok s editovatelnými poli vykreslovaný šablonou.

Předpoklady

  • Místo, kde spustit registrační kód: AppServiceProvider vaší aplikace, nebo service provider pluginu (viz Vývoj pluginů).
  • Základy Blade pro variantu vykreslovanou šablonou.

Anatomie bloku

Definice bloku se staví fluent zápisem:

use Laravix\Cms\Support\BlockDefinition;

class HighlightBlock
{
    public static function definition(): BlockDefinition
    {
        return BlockDefinition::make('highlight')
            ->label('Zvýraznění')
            ->icon('fa-star')
            ->category('laravix::blocks.categories.content')
            ->canvasHtml(<<<'HTML'
<section style="padding:48px 24px;background:#fef3c7;text-align:center;">
    <h2 style="margin:0 0 8px;">Něco, co stojí za zvýraznění</h2>
    <p style="margin:0;color:#92400e;">Klikněte a text upravte.</p>
</section>
HTML);
    }
}

Metody:

Metoda Účel
make(string $key) Unikátní klíč bloku
label(string) Název v panelu bloků (prostý řetězec nebo překladový klíč)
icon(string) / gjsIcon(string) Třída Font Awesome ikony na dlaždici bloku (např. fa-star)
category(string) Kategorie panelu — použijte core kategorii (laravix::blocks.categories.*) nebo vlastní popisek
canvasHtml(string|Closure) HTML vložené na plátno builderu. Bloky bez něj se ve vizuálním builderu nezobrazí.
schema(array|Closure) Filament form komponenty popisující editovatelná pole (klasické bloky)
contentTypes(array) Omezení bloku na určité typy obsahu — např. core blok Výpis příspěvků je jen ['archive']
defaultData(array) Výchozí data pro bloky se schématem

Registrace

Zavolejte registr ze service provideru (boot() pluginu, nebo AppServiceProvider::boot() aplikace):

use Laravix\Cms\Support\BlockRegistry;

BlockRegistry::register(HighlightBlock::definition());

Blok se od té chvíle nabízí v panelu bloků builderu na každém webu instalace.

Builder bloky: canvas HTML je zdroj pravdy

U bloků pro vizuální builder je canvasHtml zároveň to, co dopadne na plátno, i to, co pak redaktor volně upravuje — texty, styly, strukturu. Uložená stránka je exportované HTML, takže blok nepotřebuje žádné serverové view. Tipy odkoukané z core bloků:

  • Inline styly nebo lx-* utility třídy jádra udrží blok přenositelný.
  • data-gjs-type="button-link" na <a> prvcích jim dá builderovské ovládání odkazu.
  • Držte markup sémantický (jeden kořenový <section>), aby se dal rozumně přestylovat.

Klasické bloky: schema + view šablony

Bloky se schema se editují jako strukturovaná data a vykresluje je šablona až při požadavku. Takhle fungují core bloky hero, text, cards atd. Schéma používá Filament form komponenty:

use Filament\Forms\Components\TextInput;
use Filament\Forms\Components\RichEditor;

->schema(fn () => [
    TextInput::make('heading'),
    RichEditor::make('content'),
])

Uložený obsah drží ['type' => 'highlight', 'data' => ['heading' => ..., 'content' => ...]] v Content::$blocks a šablona ho vykreslí přes views/blocks/highlight.blade.php, které dostane klíče dat jako proměnné plus $mediaMap:

<section class="py-12">
    <h2>{{ $heading ?? '' }}</h2>
    <div>{!! $content ?? '' !!}</div>
</section>

U obrázkových polí pojmenujte select neco_id a vyřešte ho přes mapu médií: $mediaMap[$image_id] ?? null. Hotový výběr médií vám dá Laravix\Cms\Support\FieldComponentFactory::mediaSelect('image_id', 'Obrázek').

Kontrola výsledku

  1. Zaregistrujte blok a znovu načtěte builder — dlaždice bloku se má objevit ve své kategorii.
  2. Přetáhněte ho na stránku, upravte, uložte.
  3. Otevřete stránku na frontendu a ověřte výstup (u schema bloků ověřte, že se vykresluje vaše view).

Související články

Laravix Documentation · 13.07.2026
Star on GitHub