Nova Unlayer Field

Adds a Laravel Nova field for Unlayer to compose emails and landing pages.

Installation

You can install the package in to a Laravel app that uses Nova via composer:

composer require interaction-design-foundation/nova-unlayer-field

⚠️ For PHP 7.1 - PHP 7.4 please use version 0.2.2 (it uses another namespace).

Usage

This package assumes that your Model has an attribute to store design config (it's better to use json or longtext SQL type to store it).

On submit, the package sends two fields:

• design (stringified json object)
• html code. If you want to store HTML to your model, please use savingCallback()

public function fields()
{
    return [ 
        Unlayer::make('Content', 'design')->config([
            'projectId' => config('unlayer.project_id'),

            // optional
            'templateId' => config('unlayer.newsletter_template_id'), // Used only if bound attribute ('design' in this case) is empty.
            'displayMode' => 'web', // "email" or "web". Default value: "email"
            'locale' => 'es', // Locale for Unlayer UI. Default value: application’s locale.
        ]),
     ];
}

Options

• ->config(array|callable $config): Specify Unlayer config.
• ->height(string $height): Set height of the editor (with units). E.g. '1000px' (800px by default).
• ->savingCallback(?callable $callback): Specify a callback to call on before Model saving. Useful to store generated HTML code (to a Model or as a file).

Example of using savingCallback:

Unlayer::make('Design')->config([
        'projectId' => config('unlayer.project_id'),
    ])
    ->savingCallback(function (NovaRequest $request, $attribute, Newsletter $newsletterModel, $htmlFieldName) {
        $newsletterModel->html = $request->input($htmlFieldName);
    }),

Changelog

Please see Releases for more information on what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Compiling Assets

# Compile and minify your assets:
npm run prod

# Compile your assets for local development:
npm run dev

# Run the NPM "watch" command to auto-compile your assets when they are changed:
npm run watch

License

The MIT License (MIT). Please see License File for more information.