Chỉnh sửa Landing Page – Tùy chỉnh Menu, Header & Footer

 1 Tháng chín, 2021

Trong bài viết này, My Website sẽ chia sẻ với các bạn chi tiết cách để tùy chỉnh lại nội dung khu vực đầu trang (Header) và khu vực chân trang (Footer) cho mẫu Landing Page Bất động sản một dự án, bài viết thực hiện dựa trên mẫu Landing Page đã được chia sẻ trên trang, các bạn có thể tải về để cài đặt và sử dụng.

Share

Bài viết này, mình sẽ chia sẻ với các bạn cách thay đổi lại nội dung khu vực Header & Foooter. Các bạn có thể tham khảo thêm các bài viết khác trong chủ đề về mẫu Landing Page Bất động sản một dự án mà mình đã chia sẻ trên Blog My Website tại đây:

Video hướng dẫn chi tiết:

Tùy chỉnh Header & Menu Landing Page

Để bắt đầu chỉnh sửa phần Header, các bạn vào mục “Tùy Biến” -> Chọn “Header” -> “Logo & Site Identity“. Tại đây, các bạn cập nhật lại các thông tin sau:

  • Tiêu đề Website/Dự án.
  • Khẩu hiệu/Slogan cho dự án của bạn.
  • Tải logo dự án bạn đang chạy lên thay thế.
  • Tải logo Light Version, hoặc “Remove” nếu không cần thiết.
  • Thay đổi lại biểu tượng cho site.

Chỉnh sửa Menu hiển thị

Đối với mẫu Landing Page này, các mục menu mình đã bắt link với “Scroll To” trong Flatsome. Để thực hiện thay đổi các menu này cho phù hợp với nội dung dự án các bạn đang chạy, các bạn có thể điều chỉnh lại vị trí các “Scroll To” tương ứng với các section, hoặc các mục nội dung trên trang chủ, và gán lại link cho menu là được.

Chi tiết về “Scroll To“, các bạn có thể tham khảo tại đây:

Hiện tại, mẫu Demo Landing Page này, mình đã custom lại menu 1 chút, nên trong trường hợp các bạn muốn thay đổi lại màu cho Menu hiển thị, các bạn có thể coppy đoạn mã dưới đây và dán vào phần “CSS bổ sung” trong “Tùy biến“, thay đổi đoạn #006157 thành mã màu mà các bạn cần điều chỉnh và “Xuất bản” để cập nhật lại nhé!

.nav>li>a{
	color:#006157!important;
}

Tùy chỉnh Footer Landing Page

Để chỉnh sửa Absolute Footer, các bạn tiếp tục vào mục “Tùy biến” -> rê chuột đến phần cuối trang trên màn hình xem trước -> Chọn “Absolute Footer” để cập nhật lại màu nền background chân trang, nội dung text tại đây.

Đối với phần nội dung chân trang, mình đã dùng “UX Blocks” để tạo, và chèn “Shortcode” của Block đó vào phần HTML sau Footer. Để chỉnh sửa phần này các bạn có thể vào trang quản trị website -> Chọn mục “UX Blocks” để chỉnh sửa phần block này.

Hoặc tại trang chủ, các bạn cuộn đến cuối trang, rê chuột vào mục nội dung chân trang và chọn “UX Builder” để chỉnh sửa Block chân trang.

Trong quá trình thực hiện, nếu có bất kỳ thắc mắc nào, các bạn có thể để lại bình luận cho mình phía dưới bài viết nhé!

Cảm ơn các bạn đã ghé qua Blog My Website!
Chúc các bạn một ngày vui vẻ!

4.3/5 - (7 bình chọn)
Theo dõi
Thông báo của
guest

2 Góp ý
Cũ nhất
Mới nhất Được bỏ phiếu nhiều nhất
Phản hồi nội tuyến
Xem tất cả bình luận
ngoc thach
ngoc thach
2 năm trước

chào Ad mình tải mẫu lading page lên web không được phải làm sao ạ ? mình tải lên bằng all-in-one đạt 100% dữ liệu và chỉ đứng yên đó không thấy có bảo gì thêm ngoài nút ngừng nhập ! mình đợi khá lâu mà không có thong báo gì khác !
ad hổ trợ mình với ?

2
0
Rất thích suy nghĩ của bạn, hãy bình luận.x
0935 355 881 Zalo Chat Mẫu Website