PHPackages                             swatty007/laravel-inline-editor - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. swatty007/laravel-inline-editor

ActiveLibrary

swatty007/laravel-inline-editor
===============================

Laravel package, which allows inline editing of model specific content blocks.

v0.3.1(5y ago)42587MITPHPPHP &gt;=5.6CI failing

Since May 17Pushed 5y ago1 watchersCompare

[ Source](https://github.com/swatty007/laravel-inline-editor)[ Packagist](https://packagist.org/packages/swatty007/laravel-inline-editor)[ RSS](/packages/swatty007-laravel-inline-editor/feed)WikiDiscussions master Synced today

READMEChangelog (6)Dependencies (3)Versions (6)Used By (0)

Inline Editor for Laravel based projects
========================================

[](#inline-editor-for-laravel-based-projects)

[![Latest Stable Version](https://camo.githubusercontent.com/c6433bf10e6cb9bfaeb85e51500fd7a01d0913df2b618122e97a4c7210487cee/68747470733a2f2f706f7365722e707567782e6f72672f7377617474793030372f6c61726176656c2d696e6c696e652d656469746f722f762f737461626c65)](https://packagist.org/packages/swatty007/laravel-inline-editor)[![Latest Unstable Version](https://camo.githubusercontent.com/d4cfb2d3028ac0843488e1501be5b502ead8a57cb621fb236cd156e648e0fb6f/68747470733a2f2f706f7365722e707567782e6f72672f7377617474793030372f6c61726176656c2d696e6c696e652d656469746f722f762f756e737461626c65)](https://packagist.org/packages/swatty007/laravel-inline-editor)[![Total Downloads](https://camo.githubusercontent.com/d8546860bc853814f29a15322269fde437f3da4db533854da3e4247a01b2c818/68747470733a2f2f706f7365722e707567782e6f72672f7377617474793030372f6c61726176656c2d696e6c696e652d656469746f722f646f776e6c6f616473)](https://packagist.org/packages/swatty007/laravel-inline-editor)[![License](https://camo.githubusercontent.com/2c847769ce5827535789541499f4f426f0b0cfd2db5854d5f7bfddf5da09e86a/68747470733a2f2f706f7365722e707567782e6f72672f7377617474793030372f6c61726176656c2d696e6c696e652d656469746f722f6c6963656e7365)](https://packagist.org/packages/swatty007/laravel-inline-editor)

Simple inline editor toolbar, to update the content of any HTML block, or specific DB table.

This package is an updated version of [dyusha/laravel-html-editor](https://github.com/dyusha/laravel-html-editor)with some additional functionality and updated dependencies.

Installation
------------

[](#installation)

Download this git repo, or install it via composer:

`composer require swatty007/laravel-inline-editor`

Also make sure to get our npm dependencies:

`npm install vue vue-resource medium-editor vue-sweetalert2 --save`

Configuration
-------------

[](#configuration)

> Note, Optional in `Laravel 5.5 or +`

Add the following to your config file:

```
// config/app.php
'providers' => [
    ...
    swatty007\LaravelInlineEditor\InlineEditorServiceProvider::class,
],
```

### Initial Setup

[](#initial-setup)

Run: `php artisan vendor:publish`

- Include the following code snippet into your applications layout file, ***eg: "view/layouts/app.blade.php"***. This will render the required controls on your page.

```
{{-- Start Laravel Inline Editor Components --}}
    @include('laravel-inline-editor::html-manager')
{{-- End Laravel Inline Editor Components --}}`
```

- Afterwards apply our default table with:

`php artisan migrate`

- By default editing is allowed only for users who have `laravel-inline-editor` ability, so you should add it in your `AuthServiceProvider`

    ```
    // app/Providers/AuthServiceProvider.php
    use Illuminate\Contracts\Auth\Access\Gate as GateContract;

    public function boot(GateContract $gate)
    {
       //...
        $gate->define('laravel-inline-editor', function ($user) {
            // Add your logic here
            return true;
        });
    }
    ```
- Include provided .scss and .js files on the page using your preferred build tools. For laravel mix:

```
// resources/assets/js/app.js
Vue.component('inlineManager', require('./components/laravel-inline-editor/manager'));
Vue.component('inlineContentBlock', require('./components/laravel-inline-editor/contentBlock.vue'));
```

```
// resources/assets/sass/app.scss
// Inline Editor
@import "./plugins/_medium-editor.scss";
```

### Customization

[](#customization)

You can publish the configuration files of the package, to tweak its behaviour or appearance:

`php artisan vendor:publish`

To change the default behaviour of the medium editor simply override the options setting in the config file:

```
// config/laravel-inline-editor.php
'options' => '{ \'anchor\': { \'targetCheckbox\': true }, \'toolbar\': { \'buttons\': [\'bold\', \'italic\', \'underline\'] } }',
```

By default js and sass assets will be published to `/resources/assets/js/components` and `/resources/assets/sass/plugins` directories respectively. To change this, just update the following paths in your config file:

```
// config/laravel-inline-editor.php
'paths' => [
    'js' => base_path('/resources/assets/js/components'),
    'sass' => base_path('/resources/assets/sass/plugins'),
],
```

Usage
-----

[](#usage)

This package provides custom Blade directives `@inlineEditor` and `@endInlineEditor` which can be used to wrap blocks of HTML that should be editable. For example if somewhere in your template you will have the following code:

**Simple**
Saves the containing HTML content in the `laravel-inline-editor` table under the key `item01`.

```
{{-- Simple Content Block --}}
@inlineEditor( 'item01' )
    Lorem text for our text block
@endInlineEditor
```

**Custom Table**
To save the containing HTML in a custom table, just specify, the table name, source &amp; target keys. If no source, or target keys are defined the defaults `key` and `content` will be used.

```
{{-- Custom Database Content Block --}}
{{-- $source_value, $table, $source_key, $target_key, $options --}}
@inlineEditor('example_item', 'example_objects', 'title', 'content' )
    {{ \Illuminate\Support\Facades\DB::table('example_objects')->where('title', 'example_item')->first() }}
@endInlineEditor
```

**Custom Options**

You can override the default options for the medium editor by overriding the default options:

```
{{-- Shows the usage of the options property --}}
@inlineEditor( 'item01', null, null, null, "{ 'anchor': { 'targetCheckbox': true }, 'toolbar': { 'buttons': ['bold', 'italic', 'underline'] } }" )
    Lorem text for our text block
@endInlineEditor
```

For details check the medium js documentation:

> Note Look at the configuration settings to override the default options

**Properties**

1. **Source Value** - DB row, where we are looking for our source key.
2. **Table** - will override at which table we are looking for the above defined value.
3. **Source Key** - allow overwriting the DB row at which we are looking for our source value.
4. **Target Key** - allow overwriting the DB row at which will be updated.
5. **Editor Options** - allows you to specify additional options for the medium editor.
6. **Validation Rules** - Allows you to define a set of custom validation rules.
7. **Strip HTML** - Strips all HTML elements from the given input string, before saving it into the DB.

The first time it's being rendered directive will try to find the content of your element by its defined key in the default database, if not specified otherwise. If it is present then its content will be rendered on the page.

Otherwise new HTML block will be created with the given parameters. You can put any HTML markup between `@inlineEditor` and `@endInlineEditor` directives.

### Workflow

[](#workflow)

When you press `Accept changes` button `` component will send `POST` request to `/inline-content-block` with `blocks` param that will contain all changed HTML blocks.

#### License

[](#license)

This library is licensed under the MIT license. Please see [LICENSE](LICENSE.md) for more details.

###  Health Score

28

—

LowBetter than 54% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity19

Limited adoption so far

Community10

Small or concentrated contributor base

Maturity52

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~252 days

Total

5

Last Release

1909d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/77f0b9661afdeab758f22b28bd1967aed025aa0e6a68fd6497b2195253ba1d4d?d=identicon)[swatty](/maintainers/swatty)

---

Top Contributors

[![swatty007](https://avatars.githubusercontent.com/u/38767638?v=4)](https://github.com/swatty007 "swatty007 (13 commits)")

---

Tags

inline-editinglaravellaravel-5-packagelaravel5mediummedium-editorvuejs2

###  Code Quality

TestsPHPUnit

### Embed Badge

![Health badge](/badges/swatty007-laravel-inline-editor/health.svg)

```
[![Health](https://phpackages.com/badges/swatty007-laravel-inline-editor/health.svg)](https://phpackages.com/packages/swatty007-laravel-inline-editor)
```

###  Alternatives

[barryvdh/laravel-ide-helper

Laravel IDE Helper, generates correct PHPDocs for all Facade classes, to improve auto-completion.

14.9k123.0M686](/packages/barryvdh-laravel-ide-helper)[fumeapp/modeltyper

Generate TypeScript interfaces from Laravel Models

196277.9k](/packages/fumeapp-modeltyper)[pressbooks/pressbooks

Pressbooks is an open source book publishing tool built on a WordPress multisite platform. Pressbooks outputs books in multiple formats, including PDF, EPUB, web, and a variety of XML flavours, using a theming/templating system, driven by CSS.

44643.1k1](/packages/pressbooks-pressbooks)[api-platform/laravel

API Platform support for Laravel

59126.4k6](/packages/api-platform-laravel)[dragon-code/migrate-db

Easy data transfer from one database to another

15717.4k](/packages/dragon-code-migrate-db)[aedart/athenaeum

Athenaeum is a mono repository; a collection of various PHP packages

255.2k](/packages/aedart-athenaeum)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
