Tích hợp CKFinder và CKEditor vào Laravel.

Posted on by adminChuyên mục:Kiến thức Internet
Khi tất cả chúng ta định dạng ví dụ như font chữ hay sắc tố thì tất cả chúng ta không cần phải chỉnh sửa viết mã nguồn và việc đó là của CKEditor nó làm khi tất cả chúng ta định dạng và nhập tài liệu vào cơ sở tài liệu .

Giới thiệu về ckeditor

  • ckeditor là bộ soạn thảo dữ liệu cực kì mạnh mẽ và được sử dụng rất phổ biến hiện nay với số lượt download hơn 17 triệu lượt từ thời điểm ra mắt.
  • Đây là mã nguồn mở cho phép bạn download miễn phí và việc cài đặt ckeditor và việc tích hợp ckeditor cũng rất dễ dàng nhanh chóng.

Cài đặt ckeditor

Để tích hợp ckeditor vào Laravel, việc tiên phong tất cả chúng ta cần phải tải về gói thư viện ckeditor về máy tính. Các bước thực thi như sau :

1. Truy cập vào địa chỉ download ckeditor sẽ thấy như hình dưới

2. Tại đây có nhiều gói thiết lập ckeditor gồm có :

  • Basic Package : Chứa 17 plugin, thanh công cụ đơn giản
  • Standard Package : Chứa 48 plugin, chứa những thanh công cụ phổ biến và cần thiết cho soạn thảo
  • Full Package : Gói đầy đủ, chứa 73 plugin, thêm những công cụ khác
  • Customize : Gói này bạn sẽ tự điều chỉnh những thanh công cụ nào cần cho website của bạn

Trong phạm vi bài viết này, mình sẽ chọn gói Standard Package, rồi ấn nút Download.

Sau khi download file zip về máy, chúng ta sẽ được file ckeditor_4.6.2_standard.zip, bạn giải nén file này ra sẽ được thư mục ckeditor, sau đó copy toàn bộ thư mục này và bỏ vào đường dẫn website của chúng ta .Ví dụ /public/ckeditor

Sau đó link đến file ckeditor.js. Tạo thẻ textarea và replace nó bằng Ckeditor

1234567891011121314151617181920212223242526272829303132333435363738394041

How to Install And Use CKEditor In Laravel

rel=” stylesheet “href=” https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css “>

class=” container “>

class=” row “>

class=” col-md-8 offset-2 mt-5 “>

class=” card “>

class=” card-header bg-info “>

class=” text-white “>How to Install And Use CKEditor In Laravel ? vuvanlong.com

class=” card-body “>

method=” post “action=” “enctype=” multipart / form-data “>

@ csrf

class=” form-group “>

Name

type=” text “name=” name “class=” form-control “/ >

class=” form-group “>

Description :

class=” form-group text-center “

>

Kết quả mà tất cả chúng ta sẽ có được như sau

Display Content 

để hiển thị nội dung bạn đã lựu trong CSDL thì ta dùng cú pháp

1

{!!USDpost->description!!}

 Tích hợp CKFinder và CKEditor vào Laravel.

Chúng ta sẽ tích hợp trực tiếp vào tập tin mẫu ở trên như sau đây .

12345678910111213141516171819202122

Ckeditorandckfinder

Tiếp theo hãy mở tập tin trong thư mục CKFinder / config.php và chèn hoặc sửa lại đoạn mã như sau đây .

123

USDconfig[‘ authentication ‘]=function(){

returntrue;

}

;

Đây là hiệu quả sau khi đã tích hợp .

admin