Top header — màu, căn lề, ghim và bật/tắt từng cụm

Trang này tra cứu từng ô giao diện chung của khối Top header. Cách thêm Top header, logo, tên shop, ô tìm kiếm, mạng xã hội, tài khoản và nút bấm nằm ở bài Khối top header.

Để mở các ô này: trong bước Build Menu, bấm vào mục Top header trên cây menu để mở bảng Edit item. Phần đầu tiên của bảng (không có tiêu đề) chứa các ô bên dưới. Các ô này có trên cả Mobile Menu và Desktop Mega Menu, ở mọi gói, giống nhau trên Shopify, Wix và website khác.

Màu, căn lề và ghim

Bộ màu (Palette)

Nằm ở nút Choose a palette, ngay đầu bảng Edit item của Top header. Bấm vào để đổi nhanh cả bộ màu của khối chỉ bằng một lần bấm.

• Nhóm Basic: chọn Dark (nền tối, chữ trắng) hoặc Light (nền sáng, chữ đen).
• Nhóm Your primary color: nhập màu chủ đạo của shop, rồi chọn Dark hoặc Light dựng trên màu đó.
• Mặc định: theo mẫu header bạn đã chọn khi thêm. Nếu chưa có màu nào được đặt, khối dùng tông Dark (nền #111111, chữ #FFFFFF).
• Đây chỉ là lối tắt phối màu. Sau khi bấm, bạn vẫn chỉnh tiếp được ở ô Background và Text color; app không nhớ tên bộ màu bạn đã chọn.
• Trên cửa hàng: nền và chữ của khối Top header đổi theo bộ màu.

Căn lề (Alignment)

Ô chọn Left · Center · Right, nằm cạnh ô Palette.

• Mặc định: theo mẫu header đã chọn (khi chưa đặt thì là Left).
• Center: logo nhảy lên phía trên tên shop. Right: logo nằm bên phải tên shop và slogan. Left: logo bên trái.
• Trên cửa hàng: phần logo, tên shop và slogan dịch theo hướng bạn chọn.

Giữ khi cuộn (Keep visible while scrolling)

Ô chọn thả xuống ngay dưới Palette. Quyết định khối header có dính ở đầu menu khi khách cuộn danh sách hay không.

Lựa chọn	Kết quả
No — scrolls away with the menu	Header trôi đi cùng danh sách khi cuộn
Yes — keep the whole header	Cả khối header dính cố định ở đầu menu

• Mặc định: theo mẫu header đã chọn.
• Header thường cao khoảng 200–300 px. Ghim cố định thì chiếm nhiều chỗ trên màn hình nhỏ, nên tắt bớt các cụm không cần hoặc bật thêm Auto-hide while scrolling.
• Muốn ghim cả chân menu hoặc nhiều mục khác thì xem bài Cột, đường kẻ và mục ghim.

Tự ẩn khi cuộn (Auto-hide while scrolling)

Ô tích hiện ra ngay dưới ô trên, chỉ hiện khi bạn chọn Yes — keep the whole header.

• Mặc định: theo mẫu header đã chọn (thường là tắt).
• Trên cửa hàng: khi khách cuộn xuống, header đã ghim trượt ẩn đi cho đỡ chật; khách cuộn ngược lên là nó hiện lại ngay.

Ảnh nền (Background image)

Ô chọn ảnh, nằm dưới ô tự ẩn. Bạn tải ảnh từ máy lên hoặc chọn từ ảnh sản phẩm, thư viện có sẵn.

• Mặc định: tuỳ mẫu header; mẫu không có ảnh thì để trống.
• Ảnh nền phủ kín khối header, và màu nền (ô bên dưới) được phủ lên trên ảnh. Màu càng trong suốt thì ảnh càng rõ, màu càng đặc thì ảnh càng chìm.
• Ảnh nền không phụ thuộc công tắc Logo: tắt cụm Logo thì ảnh nền vẫn hiện.

Màu nền (Background)

Ô màu bên trái ở hàng cuối của phần giao diện chung.

• Mặc định: theo mẫu header đã chọn. Để trống thì lấy màu theo bộ màu: #111111 với tông Dark, #F5F6F7 với tông Light.
• Trên cửa hàng: màu nền toàn khối header. Nếu đã có ảnh nền thì màu này là lớp phủ lên ảnh.

Màu chữ (Text color)

Ô màu bên phải, cạnh ô Background.

• Mặc định: theo mẫu header đã chọn. Để trống thì lấy theo bộ màu: #FFFFFF với Dark, #18181B với Light.
• Trên cửa hàng: đổi màu chữ của tên shop, slogan, từ khoá hot, chữ trong ô tìm kiếm và icon mạng xã hội.
• Chọn màu chữ tương phản với màu nền (và ảnh nền nếu có) để khách đọc rõ.

Bật/tắt từng cụm

Công tắc các cụm (Logo / Content / Search box / Social links / Account / Buttons)

Mỗi cụm bên dưới phần giao diện chung có tiêu đề riêng kèm một công tắc. Khi thêm Top header từ màn chọn mẫu, dòng Show in header cũng có sáu công tắc tương ứng: Logo, Name & slogan, Search bar, Account, Buttons, Social.

Cụm	Công tắc	Mặc định khi thêm
Logo	Có	Bật
Content (tên shop, slogan)	Có	Bật
Search box	Có	Bật
Social links	Có	Bật
Account	Có	Tắt
Buttons	Có	Bật

• Trên cửa hàng: cụm nào tắt thì không vẽ. Cụm nào bật nhưng không có nội dung (chưa chọn logo, chưa nhập tên, chưa thêm icon hay nút) cũng tự ẩn, không để lại khung trống.
• Riêng ô tìm kiếm chính luôn có chữ gợi ý mặc định, nên cụm Search box bật là vẫn hiện dù bạn chưa gõ gì.
• Ảnh nền và màu nền không nằm trong cụm nào, nên tắt cụm không làm mất chúng.
• Chi tiết các ô bên trong mỗi cụm có ở bài Khối top header.

Tóm tắt các ô

Ô trong app	Giá trị	Mặc định
Choose a palette	Dark · Light · theo màu chủ đạo	Theo mẫu header
Alignment	Left · Center · Right	Theo mẫu header
Keep visible while scrolling	No · Yes (whole header)	Theo mẫu header
Auto-hide while scrolling	bật hoặc tắt (chỉ khi ghim)	Theo mẫu header
Background image	ảnh	Theo mẫu header
Background	mã màu	Theo mẫu header
Text color	mã màu	Theo mẫu header
Công tắc sáu cụm	bật hoặc tắt từng cụm	Account tắt, còn lại bật

Nền tảng khác

Shopify Wix Website khác

Các bước ở trên dành cho Shopify — đây là cách mặc định.