How To Add Summernote Editor In Laravel

Websolutionstuff | Jun-17-2020 | Categories : Laravel PHP jQuery

In this tutorial, I will let you know how to use summernote editor in laravel, In laravel or PHP many editors are available but today I will give you an example of summernote.

Summernote editor is a rich textbox editor, using summernote editor you can take many actions like, insert an image, add tables, changes font style, add links, add snippet code and many more feature provides.

For summernote editor you need to add summernote js and CSS CDN.

<html>
<head>
  <title>How to add summernote editor in laravel - websolutionstuff.com</title>
  <link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
  <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/summernote.min.css" rel="stylesheet">
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/summernote.min.js"></script>
</head>
<body>
<div class="row">
    <div class="col-md-12">
        <h1 class="text-center">How to add summernote editor in laravel - websolutionstuff.com</h1>
        <div class="col-md-12">        
            <textarea name="summernote" id="summernote"></textarea>
        </div>
    </div>
</div>    

  <script>
    $(document).ready(function() {
        $('#summernote').summernote({
            height: 400, 
            placeholder: 'websolutionstuff.com',
        });
    });
  </script>
</body>
</html>

 

 

After this, you will get output like the below screenshot.

summernote editor


You might also like:

Recommended Post
Featured Post
How To Upload And Preview Image In React JS
How To Upload And Preview Imag...

In this article, we will see how to upload and preview images in react js. You can learn how to show an i...

Read More

Sep-06-2022

How To Convert PHP Array To JSON Object
How To Convert PHP Array To JS...

In this article, we will explore the process of converting a PHP array into a JSON object. We'll achieve this transf...

Read More

Jul-08-2020

Laravel whereDate and whereDay Example
Laravel whereDate and whereDay...

In this article, we will see laravel whereDate and whereDay examples. As you all know laravel provides many in...

Read More

Jan-21-2021

How To Use Google Recaptcha V2 In Laravel 9
How To Use Google Recaptcha V2...

In this article, we will see how to use google ReCaptcha v2 in laravel 9. Google ReCaptcha is used for advance...

Read More

Jun-14-2022