Giter Club home page Giter Club logo

nova-unlayer-field's Introduction

Nova Unlayer Field

image

Latest Stable Version Total Downloads License

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

image

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).

Optional: publish the configuration

Run this on the command line from the root of your project:

php artisan vendor:publish --provider="InteractionDesignFoundation\NovaUnlayerField\ServiceProvider" --tag=config

Usage

This package assumes that your Model has an attribute to store Unlayer design config JSON string (itā€™s better to use json or jsonb or longtext SQL type to store it).

On submit, the package automatically stores Unlayer design config only (JSON string). Most likely, you also want to do something with the output HTML code, generated by Unlayer. To access it, please use savingCallback() method (see an extended example below).

Basic field config:

use InteractionDesignFoundation\NovaUnlayerField\Unlayer;

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

            // optional
            'templateId' => config('unlayer.default_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, $outputHtmlFieldName) {
        // set output HTML to your model (Newsletter in this case)
        // No need to call $model->save() ā€” Nova will do it down the road.
        $newsletterModel->html = $request->input($outputHtmlFieldName);
    }),

Changelog

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

Contributing

Please see CONTRIBUTING for details.

License

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

nova-unlayer-field's People

Contributors

alies-dev avatar keko-94 avatar lptn avatar hasan-wajahat avatar dependabot[bot] avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    šŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. šŸ“ŠšŸ“ˆšŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ā¤ļø Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.