Hero Carousel Setup
Current homepage hero behavior
Mỗi slide dùng ảnh riêng làm nền full-width. Title, description và 2 button chỉ là lớp overlay.
Trường video hiện không còn được hiển thị ở frontend.
Tùy chọn dự phòng. Khung hero desktop hiện hiển thị khoảng 1512x544px, nên nên upload ảnh ngang ít nhất 1920x700px.
<% if (data.hero?.backgroundImage) { %>
<% } %>
Recommended content structure
- Dùng ảnh slide tỉ lệ ngang, ưu tiên ảnh lớn để fit container.
- Title ngắn 2-4 dòng để không tràn trên mobile.
- Description giữ ở mức 1-3 câu ngắn.
- Hai nút nên dùng link nội bộ như
/contact.
Hero Slides
<% const existingSlides=(data.hero && Array.isArray(data.hero.slides) && data.hero.slides.length> 0)
? data.hero.slides
: [{
title: data.hero?.title || '',
subtitle: data.hero?.subtitle || '',
description: data.hero?.description || '',
heroImage: data.hero?.heroImage || '',
videoUrl: data.hero?.videoUrl || '',
primaryButton: data.hero?.primaryButton || {},
secondaryButton: data.hero?.secondaryButton || {},
}];
%>
<% existingSlides.forEach(function(slide, index) { %>
<% }); %>
Slide
Hiện không render ngoài frontend, chỉ giữ để tương thích dữ liệu cũ.
Ảnh này phủ toàn bộ hero. Khung desktop hiện khoảng 1512x544px, khuyến nghị upload 1920x700px hoặc lớn hơn.
<% if (slide.heroImage) { %>
<% } %>
Frontend hiện không render video trong hero. Giữ lại chỉ để tránh mất dữ liệu cũ.