Cách làm header trong HTML
Nội dung bài viết Show
Hướng dẫn thiết lập giao diện trang chủ website: Header, Body và FooterĐây là học phần thiết kế giao diện trang chủ, Bài hôm nay sẽ hướng dẫn Bạn thiết lập trang chủ của website gồm 3 phần chính là:
1. Để tùy chỉnh HeaderVào quản trị web, Chọn mục giao diện -> Tùy biến -> Header Kết quả như hình sau: Bạn để ý vùng làm việc bên phải như sau, Phần header có 3 dòng là 3 vùng hiển thị của phần đầu trang
Tham khảo website: https://daotaobinhduong.com/ mình đang sử dụng cả 3 dòng trên header https://lml.vn/mình đang sử dụng cả 2 dòng trên header VD: dòng 1 VD: dòng 2 VD: dòng 3 Cách sử dụng; Khi bạn muốn sử dụng chức năng gì chỉ cần nắm kéo và thả vào vùng muốn hiển thị là được. Nào hãy thực hành các quản lý header khoảng 5 phút nhé! Tiếp tục.. Logo & Site Identity: Vùng thiết lập Tên website, vị trí đặt logo và thay đổi logo. Top Bar,Header Main,Header Bottom:
Chức năng HTML: Thay đổi nội dung trên header hiển thị Chức năng Contact: Thay đổi hiển thị thông tin liên lạc => Sau khi tùy chỉnh xong nhớ bấm nút Đăng để lưu thay đổi ở góc trên bên trái. Xem video:BỔ SUNG HEADER VÀ HIỂN THỊ MOBILEXEM VIDEO2. Tùy chỉnh Body (thân website)Chọn Mục Trang -> Tất cả các trang -> Trang chủ -> Edit with UXBuilder Bắt đầu chỉnh từng phần nhé: Slider: Thay đổi ảnh trượtChọn Image -> Option -> Change Media -> Chọn ảnh mới Bạn lưu ý các ảnh phải cùng kích thước và hình có thiết kế thì website mới trượt đều và đẹp nhé Hiện tại website đang dùng là dữ liệu mẫu nhé, nếu bạn không có nhiều thời gian để thực hàng web Bạn chỉ cần chỉnh lại nội dung là có thể sử dụng được Nếu Bạn muốn tùy chỉnh nhiều hơn có khả năng thực hành nhiều hơn chúng ta sẽ thay đổi lại bố cục trang web lại, một số các chức năng thông dụng Bạn cần nắm sau: Nhấp vào nút add to nội dung để chèn các chức năng cần thiết vào Trang web.
Sau khi thiết lập xong nhớ nhấp nút Update để cập nhật thay đổi. :D Xem video hướng dẫn:3. Tùy chỉnh chân trang FooterChọn mục Giao diện -> Tùy chỉnh -> Footer Tại phần Footer 2: Background color: Chọn màu nền Tại phần Absolute Footer: Background color: Chọn màu nền Bottom Text Primary: Ghi lại tên thương hiệu hoặc cty bạn ở đây. Bấm Đăng để lưu nhé! .tiếp tục..còn nữa Bây giờ thay đổi nội dung ở đâu? Chọn mục Giao diện -> Widget Bạn nhìn cột bên phải chổ Footer 2 bấm mũi tên sổ xuống nhé Bạn bấm vào từng mục và thay đổi nội dung ở đây nhé! Nhớ xong lưu lại. Xem video hướng dẫnĐến đây Bạn đã xong bài học hôm nay, Xin chúc mừng nếu bạn hoàn thành và thấu hiểu nội dung đã học! :D |