Hướng dẫn gắn liên kết bài viết cụ thể vào một khối hoặc một cột

Tạo khối bài viết trong GrapesJS

Mở trang cần chỉnh sửa bằng Trình thiết kế giao diện (GrapesJS).

Kéo 1 khối (row) hoặc cột (column) vào nơi muốn hiển thị.

Trong khối đó, kéo và thêm các thành phần:

• Ảnh (Image) → đại diện bài viết.
• Tiêu đề (Text) → tên bài viết.
• Đoạn văn ngắn (Text) → mô tả sơ về nội dung bài.

Thêm một lớp liên kết bao phủ toàn bộ khối

Từ thanh bên trái, kéo thành phần “Link” vào trong khối chứa bài viết.

Trong thanh “Cấu hình” (Settings) của thành phần Link:

Chọn “Position” là absolute.

Set các thông số sau:

• Top: 0
• Left: 0
• Width: 100%
• Height: 100%

📌 Việc này giúp lớp Link bao phủ toàn bộ khối bài viết – người dùng có thể click bất kỳ đâu trên khối để mở bài viết.

Gắn liên kết bài viết cụ thể

Kiểm tra lại hiển thị

Nhấn Lưu → Xuất bản trang.

Truy cập website thật → rê chuột vào khối → click thử → phải mở đúng bài viết tương ứng.