Hướng dẫn tạo thanh menu cố định (sticky menu) khi cuộn trang

Cố định menu khi cuộn trang trong WordPress. quý khách ý muốn người tiêu dùng lúc vào website đang thấy tkhô giòn thực đơn cố định nhằm cuốn hút bọn họ ngơi nghỉ lại trang thọ hơn? Đã có nhiều website sử dụng biện pháp này. Cùng dautri.mobi giới tò mò phương pháp làm nhé:

Menu sẽ cố định và thắt chặt lúc khách hàng gạnh thăm site cuộn xuống phía dưới screen. Hình thức này giúp cho khách dễ dàng di chuyển website của người tiêu dùng. Họ không còn mất thời gian để cuộn lên đầu trang để nhìn thấy thực đơn và dịch chuyển sang trọng phần không giống của site.

Bạn đang xem: Hướng dẫn tạo thanh menu cố định (sticky menu) khi cuộn trang

Quý khách hàng vẫn muốn cố định và thắt chặt menu trên trang web của bạn?

quý khách hàng vẫn học tập được nghệ thuật này vào nội dung bài viết hôm nay

Hướng dẫn thắt chặt và cố định menu Khi cuộn trang trong WordPress

Bây giờ đồng hồ bạn cần thiết đặt và kích hoạt plugin Sticky Menu (or Anything!) on Scroll. Tên plugin dài ngùng ngoằng nhưng lại nó thao tác làm việc tốt nhất. Mình không chạm mặt lỗi gì Lúc thắt chặt và cố định menu.

Ngay Khi plugin được kích hoạt, các bạn sẽ tiếp cận Settings -> Sticky Menu (or Anything!) để thông số kỹ thuật plugin.


*

Cấu hình plugin


Tùy chọn đặc biệt tốt nhất bạn phải thông số kỹ thuật là Sticky Element. Tại phía trên bạn phải nhtràn lên CSS ID của thực đơn bạn cần thắt chặt và cố định nlỗi hình ảnh chụp của chính mình.

Vậy CSS ID đem ở đâu ra?​

Để tìm kiếm được ID này bạn áp dụng kỹ năng Inspect trong trình phê duyệt của khách hàng.

Đây là phương pháp làm:

Duyệt bất kỳ website nào cùng bấm vào đề nghị. Chọn tùy lựa chọn Inspect từ menu ngữ cảnh.

Xem thêm: Cách Tải Ch Play Về Máy Tính Đơn Giản, Dễ Dàng, Cách Download Và Cài Phần Mềm Trên Taimienphi

Click vào mũi thương hiệu để bắt đầu đưa ra dòng đoạn code HTML của thực đơn bên trên trang web:

Rê chuột lên menu. Bây giờ đồng hồ bạn sẽ bắt gặp code HTML của menu buộc phải thắt chặt và cố định. quý khách lưu ý tới ở trong tính mang tên là Id. quý khách hàng mang quý hiếm của chính nó cùng nhập lệ phần cấu hình của plugin. Chú ý các bạn cần có ký trường đoản cú # trước tên của trực thuộc tính.


*

Lấy giá trị của chính nó và nhập lệ phần cấu hình của plugin


Vậy nên phần tùy lựa chọn Sticky Element họ đã giải quyết và xử lý kết thúc. Đến đây là thực đơn của công ty đã làm được cố định Khi cuộn xuống rồi đó.

Ngoài ra chúng ta lưu ý thấy có một vài ba tùy chọn khác của plugin. Các tùy lựa chọn này số đông được phân tích và lý giải ví dụ do vậy các bạn sẽ ko gặp những trở ngại nhằm gọi bọn chúng.

Nếu chúng ta ko ưa thích sử dụng plugin có thể bổ sung cập nhật đoạn code CSS sau:

#site-navigation background:#fff;height:60px;z-index:170;margin:0 auto;border-bottom:1px solid #dadada;width:100%;position:fixed;top:0;left:0;right:0;text-align: center;

Txuất xắc quý hiếm #site-navigation bởi CSS ID của khách hàng. CSS ID là quý giá các bạn khẳng định làm việc bước bên trên.

Xem thêm: Ảo Thuật Bài Bay: Cách Thực Hiện Ảo Thuật Bài Bay Siêu Đỉnh, Dạy Học Làm Ảo Thuật Combo Bài Bay Chi Tiết Nhất

Nếu menu cố định tất cả hiện tượng đè lên trên phần title cùng header thì bổ sung thêm không gian đối với phần top của trang bằng bởi đoạn code sau:

.site-branding margin-top:60px;

Với nội dung bài viết này, bạn đã hiểu cách thức cố định và thắt chặt thực đơn Khi cuộn trang.

Quý Khách hy vọng cài đặt hiệu ứng này đến website của bạn? Mong rằng chỉ dẫn thắt chặt và cố định thực đơn Khi cuộn trang vào WordPress trên sẽ giúp được các bạn. Có gì thắc mắc hãy comment bên dưới nhằm chúng ta cùng nhau giải quyết nhé. Chúc các bạn thành công!


Chuyên mục: Hướng Dẫn - Hỏi Đáp