Ckeditor - Hướng dẫn cài đặt plugin upload ảnh lên dịch vụ chia sẽ ảnh imgur

Thứ năm - 14/02/2019 09:51
Plugin này tích hợp công cụ upload ảnh lên dịch vụ chia sẽ ảnh imgur thay cho việc upload ảnh lên máy chủ
Imgur là dịch vụ chia sẽ ảnh khá phổ biến trong thời điểm hiện tại. Bạn có thể tải hình ảnh từ máy tính lên đây để chia sẽ cho bạn bè, hay sử dụng để dán vào diễn đàn, bài viết,.... Sử dụng Imgur bạn sẽ tiết kiệm được nhiều tài nguyên cho máy chủ web của bạn, hoàn toàn miễn phí!
Ckeditor - Hướng dẫn cài đặt plugin upload ảnh lên dịch vụ chia sẽ ảnh imgur

1. Đăng ký tài khoản Imgur

- Truy cập https://imgur.com/, nhấn nút Sign up ở góc phải để tiến hành đăng ký (hoặc link này https://imgur.com/register)
- Bạn sẽ được chuyển đến giao diện đăng ký thông tin. Tại đây, Imgur cung cấp khá nhiều hình thức đăng nhâp, bạn có thể đăng nhập nhanh bằng tài khoản Facebook, Tweeter, Google hoặc Yahoo. Ngoài ra, bạn cũng có thể nhập mới thông tin đăng ký.

image 1
Giao diện đăng ký Imgur

- Ngay sau khi đăng ký, đăng nhập thành công, bạn đã có thể upload và chia sẽ ảnh miễn phí.

2. Đăng ký ứng dụng với Imgur

- Để sử dụng Imgur của bạn cho một ứng dụng khác (trường hợp này là plugin của ckeditor) bạn cần đăng ký ứng dụng, việc này sẽ tạo ra một chuỗi ký tự ngẫu nhiên giúp ứng dụng có thể hiểu được sự kết nối với tài khoản Imgur của bạn.
- Truy cập https://api.imgur.com/oauth2/addclient, sau đó điền các thông tin bắt buộc:
  • Application name: tên ứng dụng, đặt tên gợi nhớ
  • Authorization type: loại xác thực, OAuth 2 authorization with a callback URL (nên chọn)
  • Authorization callback URL: nhập domain của bạn
  • Email: nhập email nhận thông báo
Nhấn Submit cuối trang để hoàn tất.

- Sau khi đăng ký thành công, ở giao diện tiếp, bạn cần ghi nhớ 2 giá trị Client IDClient Secrectimage 3

3. Cài đặt addon Imgur cho Ckeditor

  • Download phiên bản mới nhất tại https://ckeditor.com/cke4/addon/imgur
  • Giải nén file vừa download được vào thư mục ckeditor/plugins (lúc này sẽ tồn tại ckeditor/plugins/imgur)
  • Mở file cấu hình, thêm dòng này vào cấu hình để kích hoạt addon Imgur. Thay xxxxxxxxxxxx bằng giá trị Client ID đã nhận được ở phần 2
config.extraPlugins = 'imgur';
config.imgurClientId = 'xxxxxxxxxxxx';
  • Bây giờ, editor của bạn đã có thêm icon của Imgur.  Khi click icon này, hộp thoại chọn file xuất hiện, bạn có thể chọn nhiều ảnh để upload cùng lúc.
image 4
Biểu tượng upload imgur
Chúc các bạn thành công!

Tổng số điểm của bài viết là: 0 trong 0 đánh giá

Click để đánh giá bài viết

  Ý kiến bạn đọc

Bạn đã không sử dụng Site, Bấm vào đây để duy trì trạng thái đăng nhập. Thời gian chờ: 60 giây