Setup editor

Create a blade template that renders the block editor component, like so:

@livewire('dropblockeditor', [
    'title' => 'Your example campaign',
])

Setting a custom base template

@livewire('dropblockeditor', [
    'title' => 'Your example campaign',
   'base' => 'your-custom-template'
])

Setting editor content

Assuming your content is in JSON format, you'll first need to turn this into an array before passing it through the activeBlocks attribute.

@livewire('dropblockeditor', [
    'title' => 'Your example campaign',
   'activeBlocks' => json_decode($json, true)
])

Further configuration

In the configuration file, you may set some additional settings.

return [
    // Optionally include the needed JS
    'include_js' => true,

    // Optionally include the CSS
    'include_css' => true,

    // Some options to apply custom branding
    'brand' => [
        'logo' => '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">   <path stroke-linecap="round" stroke-linejoin="round" d="M21 7.5l-9-5.25L3 7.5m18 0l-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l9 5.25m0-9v9" /> </svg> ',
        'colors' => [
            'topbar_bg' => 'bg-white text-gray-800',
        ],
    ]
]