Thiết Lập Header Cho Website – Tự Học Thiết Kế Web: Bài 24

Header chính là bộ nhận dạng thương hiệu của website, header là nơi chứa logo, menu và các tính năng chính của website như giỏ hàng, đăng ký, đăng nhập, quản lý tài khoản, thiết lập ngôn ngữ, thông tin công ty và nhiều thành phần khác. Hôm nay chúng ta sẽ thiết lập header cho website nhé.

Cách thiết lập header cho website

Có nhiều cách thiết lập header cho trang web, tùy thuộc vào nhu cầu sử dụng và ý tưởng của bạn. Thông thường 1 website chỉ cần 1 bố cục header cho tất cả các trang web trong website đó. Với một số website, đặc biệt là các website phong cách phương Tây thì header trang chủ riêng và các trang khác lại có bố cục header khác.

Chúng ta chú ý các vị trí để chọn header như là theme option, tùy biến, cài đặt trang đó là những vị trí thường xuất hiện các thiết lập của header nhất.

cách thiết lập header cho trang web

Một số vị trí thiết lập header: Trong cài đặt trang (click xem ảnh lớn)

cách thiết lập header cho trang web

Thiết lập header trong theme option (Click xem ảnh lớn)

Thiết lập header cho website

Thiết lập header và logo và favicon trong tùy biến (click xem ảnh lớn)

Thiết lập header cho website

Thiết lập bố cục toàn bộ header bằng plugin dành cho một số loại giao diện (click xem ảnh lớn)

Các bước thiết lập header cho trang web

Trước tiên các bạn cần vào thiết lập chung, chúng ta nên chọn bố cục header (version) phù hợp nhất. Sau đó chúng ta sẽ cài đặt khác như màu sắc, vị trí, kích thước header.

Thiết lập header cho website

Bố cục header của website (click xem ảnh lớn)

Tiếp theo chúng ta sẽ tiến hành thiết lập các chi tiết theo thứ tự từ trái sang phải, từ trên xuống dưới: top header left > top header right > middle header left > middle header center > middle header right > bottom header.

Tùy vào từng loại giao diện mà các thành phần trong menu có vị trí cài đặt khác nhau: Header top thường được cài trong menu hoặc widget. Cũng có loại giao diện sẽ có plugin bố cục header giống như bố cục nội dung trang. Logo và favicon thường sẽ được thiết lập trong tùy biến hoặc theme option. Thanh menu được thiết lập bên trong mục menu. Còn các thành phần khác nếu không có plugin bố trí, chúng ta sẽ dùng CSS để chỉnh sửa theo ý muốn.

cách thiết lập header cho trang web

Thiết lập một số nội dung của header trong menu (click xem ảnh lớn)

Tổng kết cách cài đặt header cho website

Phần này tùy vào từng giao diện mà có cách thiết lập khác nhau. Trên đây là một số gợi ý để bạn có thể tìm ra vị trí thiết lập header cho website của bạn. Hãy xem video để biết các thứ tự thiết lập giúp chúng ta nhanh chống chỉnh sửa hơn và nếu bạn dùng theme tokoo thì có thể làm theo mình.

Chúc bạn thành công!