+1

Tìm hiểu mã nguồn mở PHP CMS Drupal hướng dẫn tìm hiểu tạo slideshow trong Node

Tiếp theo loạt bài viết về Drupal:

Loạt bài đều nói về Drupal 8 nhé các bạn.

Tổng quan

Đối với website, trang chi tiết bài viết (node) rất quan trọng, đây là trang hiển thị nội dung chính mà người lướt website cần. Vì vậy, việc làm gọn gàng và bắt mắt là rất quan trọng. Trường hợp website của bạn cho phép upload nhiều hình ảnh trong 1 node thì sẽ hiển thị thế nào? Bài này hướng dẫn chúng ta cách sử dụng Field slideshow để làm gọn và bắt mắt các hình ảnh mà ta upload vào 1 node để hiển thị tối ưu.

Modules sử dụng

Bản thân mình hay sử dụng module Colorbox. Hoặc bạn có thể sử dụng 2 module Imagefield Slideshow với Views slideshow, vì 2 modules này dùng chung 1 thư viện cycle. Ở đây mình giới thiệu với các bạn cách dùng module Colorbox

Cài đặt

Các bạn download và giải nén module tại root/modules/ sau đó bạn download thư viện Colorbox rồi giải nén vào thư mục root/libraries/ với tên là colorbox

Thực tế bạn còn phải cài modules views và module libraries. Nếu chưa biết cách cài modules hay vì lý do nào đó mà không install được modules views slideshow, bạn vui lòng xem lại bài modules trong drupal nhé Cuối cùng là chỉ việc install modules Colorbox thôi.

Tích hợp

Sau khi cài đặt hoàn chỉnh, chúng ta đã có thể sử dụng Colorbox. Như đã nói ở trên, Colorbox hỗ trợ hiển thị nhiều hình ảnh trong Node. Để làm việc với Node, ta cần vào Manage display của Content type cần chỉnh. Nếu bạn không nhớ thì vui lòng xem lại bài Content type - phần quản lý hiển thị những bài đăng.

Tại Manage display tab (ảnh hưởng đến chi tiết của bài viết, hay còn gọi là Node), field hình ảnh ta sẽ phải chọn format là Colorbox như hình bên dưới. Đương nhiên bạn muốn cấu hình field hình ảnh chạy Slideshow này thế nào tùy ý bạn nhé. như Image style, Gallery,...

Sau đó chỉnh hiệu ứng thì ta vào thêm phần config của module Colorbox

Sau đó vào node khi tạo vào upload các hình ảnh lên, ta có kết quả như sau:

Tổng kết

Một modules tuyệt vời khi sử dụng library colorbox miễn phí của cộng đồng mạng. Modules Colorbox cũng cực kỳ dễ sử dụng phải không bạn? Các bạn có thể sử dụng các module tương tự như jcarousel mình sẽ hướng dẫn trong bài sau.

Tham khảo


All Rights Reserved

Viblo
Let's register a Viblo Account to get more interesting posts.