![Lorem Ipsum](/_next/image?url=https%3A%2F%2Fd24rsy7fvs79n4.cloudfront.net%2Facademy.eraweb.net%2F1000x1000%2F20230426091048_29_1682475048.3112.webp&w=2048&q=75)
![Lorem Ipsum](/_next/image?url=https%3A%2F%2Fd24rsy7fvs79n4.cloudfront.net%2Facademy.eraweb.net%2F1000x1000%2F20230426135513_29_1682492113.6726.webp&w=2048&q=75)
Add-on Article Category
![Lorem Ipsum](/_next/image?url=https%3A%2F%2Fd24rsy7fvs79n4.cloudfront.net%2Facademy.eraweb.net%2F1000x1000%2F20230426134727_29_1682491647.5894.webp&w=2048&q=75)
![Lorem Ipsum](/_next/image?url=https%3A%2F%2Fd24rsy7fvs79n4.cloudfront.net%2Facademy.eraweb.net%2F1000x1000%2F20230426134509_29_1682491509.3933.webp&w=2048&q=75)
Add-on Nhóm Bài Viết tập hợp các nhóm bài viết như: blog, tin tức,... Để Add-on này hoạt động, bạn cần làm theo các bước sau:
Trong Manage:
Nhấn nút Add màu xanh để tạo nhóm bài viết
![](https://d24rsy7fvs79n4.cloudfront.net/academy.eraweb.net/20230515105935_29_1684123175.0628.webp)
Nhập tên bài viết vào mục Name, bật / tắt tính năng Published để hiện / ẩn nhóm bài viết, thêm ảnh vào Category Image như “ảnh đại diện” của nhóm bài viết, chọn Article List ở mục Page, cuối cùng bạn cần nhấn nút Save & Close để hoàn tất.
![](https://d24rsy7fvs79n4.cloudfront.net/academy.eraweb.net/20230515105955_29_1684123195.3453.webp)
Bên trong Visual: sau khi đã kéo thả Add-on, bạn cần nhấn vào Add-on Config (biểu tượng bánh xe bên cạnh addon)
![](https://d24rsy7fvs79n4.cloudfront.net/academy.eraweb.net/20230515110030_29_1684123230.8875.webp)
Data Feed:
All: hiển thị tất cả nhóm bài viết
Category: chỉ hiển thị các nhóm bài viết được chọn, bạn cần phải nhập tên nhóm bài viết vào mục Category bên dưới
Menu: lấy từ Category setting trong module Menu
Url: lấy hình theo link Url sẽ = alias của Category
Categories: Điền tên Category muốn hiển thị (dùng khi chọn Data Feed là Category)
Include Subcategories: bật khi muốn hiển thị cả các Category con của Category đã chọn
Exclude Parent: bật nếu không muốn hiện Category cha của category đã chọn
![](https://d24rsy7fvs79n4.cloudfront.net/academy.eraweb.net/20230515110206_29_1684123326.3868.webp)
Display:
Order By và Order Direction sử dụng giống các Add-on trước
Style:
Default: nếu chọn mục này thì add-on sẽ hiển thị ở dạng giống như danh sách bài viết.
Metro UI: nếu chọn mục này thì add-on sẽ hiển thị ở dạng bố cục đã được mặc định sẵn.
Collapse: hiển thị theo dạng Dropdown, mục này hoạt động khi Category được chọn có danh mục con
Slider: hiển thị theo dạng trượt chọn cái này và setting thêm bên tab Slider
Addon Title / Addon Description: bật/tắt tùy mục đích sử dụng
Item Image: bật tính năng này để hình ảnh của từng nhóm bài viết được hiển thị
Item Title / Item Description: tiêu đề / mô tả của từng Category
Page Limit: số category xuất hiện trong 1 trang
Items per Line: số lượng nhóm bài viết trên 1 hàng
Horizontal Spacing: khoảng cách giữa các nhóm bài viết trên 1 hàng
Vertical Spacing: khoảng cách giữa các nhóm bài viết ở 1 cột
![](https://d24rsy7fvs79n4.cloudfront.net/academy.eraweb.net/20230515110355_29_1684123435.7115.webp)
Image: nhập thông số vào 2 mục Image Width và Image Height bên dưới để hình ảnh của nhóm bài viết tự động hiển thị đúng kích thước.
![](https://d24rsy7fvs79n4.cloudfront.net/academy.eraweb.net/20230515110418_29_1684123458.4629.webp)
Slider:
Rows Number: Số hàng
Auto Play: bật nếu muốn hình ảnh tự trượt với thời gian Play Timeout càng nhỏ thì trượt càng nhanh. Ví dụ: 4000 = 4s
Margin Image: khoảng cách của hình với các phần tử xung quanh
Sliders Per View: số category hiển thị trên 1 hàng
Space Between: khoảng cách giữa các category
Bài học liên quan
Chúng ta sử dụng phần add-on Job Detail để show ra thông chi tiết khi click chọn 1 Job trên...
Phần này sử dụng addon Custom List để show ra danh sách theo dạng bài viết ngắn giới thiệu về...
Chúng ta sử dụng phần add-on Button tạo những nút chuyển hướng cho trang web. Thường tạo cho các giao...
Phần add-on này sử dụng cho việc show ra danh sách những sản phẩm trong category hoặc những sản phẩm...
Chủ đề liên quan