How To Use TinyMCE Editor In Laravel

In this tutorial, we are going to share how to use TinyMCE editor in laravel application. TinyMCE is same as CKeditor different is layout and many features available in TinyMCE editor.

Laravel app support TinyMCE editor also provide free editor The WYSIWYG TinyMCE editor and It’s very easy to integrate tinymce in laravel.

Let’s follow the below steps for integrating TinyMCE in Laravel applicaiton. You can add Tinymce editor in laravel 5, laravel 6, laravel 7, laravel 8 or laravel 9.

Step 1: Install Laravel 9 App

First, we need to create one fresh laravel application help of the composer command. just run the following command in your terminal and create one laravel application.

composer create-project --prefer-dist laravel/laravel laravel-app

Step 2: Configure Database Credentials

Now, into the second step, we should configure the database settings in .env file just open your .env file and make the following changes. set youe database name, username, and password.


Step 3: Create Model & Table Migration

For generating model and migration you need to run the below command.

php artisan make:model Post -m

After running this command you will get one model file Post.php and one migration file. Now open database\migrations\2021_09_26_072241_create_posts_table.php file and put the following code inside it;


use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreatePostsTable extends Migration
     * Run the migrations.
     * @return void
    public function up()
        Schema::create('posts', function (Blueprint $table) {

     * Reverse the migrations.
     * @return void
    public function down()

Add fillable properties in your post model just like below.



namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class Post extends Model
    use HasFactory;
    protected $fillable = [
        'title', 'description', 'auther'


After that run the below command and generate database table using migration file.

php artisan migrate

Step 4: Create Route

In this step we will add two routes one for showing form and another is save the data in database.


use Illuminate\Support\Facades\Route;
use App\Http\Controllers\PostController;

Route::get('posts', [PostController::class, 'index']);
Route::post('posts', [PostController::class, 'store'])->name('');

Step 5: Create Controller

Now create new controller as PostController just running below command.

php artisan make:controller PostController

Next, open app\Http\Controllers\PostController.php file and put the below code on it.


namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Models\Post;

class PostController extends Controller
    public function index()
         return view('posts');

    public function store(Request $request){
            'title' => $request->title,
            'title' => $request->description,
            'auther' => Auth::id()

        return redirect()->back();

Step 6: Create Blade File

Here we need to create a blade file and put the code on it for use TinyMCE Editor in laravel easily.


<!DOCTYPE html>
    <title>How To Use TinyMCE Editor In Laravel ? -</title>
    <link rel="stylesheet" href="" integrity="sha256-aAr2Zpq8MZ+YA/D6JtRD3xtrwpEz2IqOS+pWD/7XKIw=" crossorigin="anonymous" />
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div id="showimages"></div>
            <div class="col-md-6 offset-3 mt-5">
                <div class="card">
                    <div class="card-header bg-info">
                        <h6 class="text-white">How To Use TinyMCE Editor In Laravel ? -</h6>
                    <div class="card-body">
                        <form class="image-upload" method="post" action="{{ route('') }}" enctype="multipart/form-data">
                            <div class="form-group">
                                <input type="text" name="name" class="form-control"/>
                            <div class="form-group">
                                <textarea name="description" rows="5" cols="40" class="form-control tinymce-editor"></textarea>
                            <div class="form-group text-center">
                                <button type="submit" class="btn btn-success btn-sm">Save</button>
    <script src="" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
    <script src="" type="text/javascript"></script>
    <script src="" referrerpolicy="origin"></script>
    <script type="text/javascript">
            selector: 'textarea.tinymce-editor',
            height: 100,
            menubar: false

Step 7: Run Development Server

Now the our requirements are added now run the dev server and check TinyMCE Editor showing in description section.

php artisan serve

I hope you like this article.

Leave a Comment