Cách tạo Header cố định trên Elementor

Elementor hiện đang là một trong những plugin xây dựng trang phổ biến nhất trong WordPress hiện nay. Việc tạo một header dính trong Elementor rất dễ dàng. Sử dụng Elementor, bạn có thể tạo và tùy chỉnh trang web của mình từng pixel. Elementor cung cấp các phần tử kéo và thả thú vị để tạo một phần header hấp dẫn và thông tin.

Phần header trở nên quan trọng hơn khi nó luôn hiển thị trên trang web khi người dùng cuộn lên hoặc cuộn xuống, gọi là header dính. Hướng dẫn này sẽ minh họa cách chúng ta có thể dễ dàng và linh hoạt tạo và tùy chỉnh một header dính để thu hút khách truy cập hơn trên trang web WordPress của bạn.

Lợi ích của việc sử dụng Header Dính?

Một phần header thông thường thường được đặt ở đầu trang web của bạn. Khi người dùng cuộn xuống, phần header biến mất vì nó được cố định ở đầu trang. Sự khác biệt duy nhất giữa một header dính và header thông thường là header dính luôn hiển thị trên trang web bất kể người dùng cuộn di chuyển như thế nào.

Một header dính tăng tính linh hoạt cho việc điều hướng vì phần header chứa tất cả các liên kết cho các trang và bài viết. Nếu không có header dính, người dùng của bạn có thể cảm thấy khó khăn khi duyệt qua trang web của bạn; đó là lý do tại sao header dính quan trọng. Và nếu bạn có thanh bên trên trang web của mình, Thanh bên dính trong WordPress cũng rất hữu ích.

Tạo Header Dính trong Elementor Bước Theo Bước

Chúng ta sẽ xem cách tạo một header dính trong Elementor từng bước. Để làm điều này, hãy cài đặt phiên bản mới nhất của WordPress và phiên bản miễn phí của trình xây dựng trang Elementor.

Header Dính Elementor: Tạo Menu Chính

Bước 1:

Từ bảng điều khiển WordPress, đi đến Hiển thị > Menu. Từ bảng chọn menu, nhấp vào ‘Tạo menu mới’ trong tab Chỉnh sửa Menu. Bạn sẽ thấy trang để tạo menu mới. Đặt tên cho menu của bạn; tạo nhãn menu cá nhân của riêng bạn và nhấn ‘Lưu Menu.’

Sau khi trang tải lại, thêm các trang từ phần Trang ở bên trái và nhấp ‘thêm vào menu.’ Bây giờ từ Cài đặt Menu ở dưới, chọn ‘Menu chính’‘Menu chính – Di động.’ để hiển thị chúng ở các vị trí đó. Cuối cùng, nhấp ‘Lưu Menu’ để hoàn tất việc tạo menu header của bạn. Quy trình này tương tự cho tất cả các chủ đề Elementor tốt nhất cho WooCommerce để tạo một cửa hàng trực tuyến tuyệt vời.  Header dính Elementor  

Bước 2:

Sau khi tạo menu điều hướng, đến lúc cài đặt plugin trình xây dựng trang Elementor. Lưu ý rằng bạn cần cài đặt phiên bản cao cấp của Elementor để tạo và tùy chỉnh các phần cơ bản như header, footer, phần widget, v.v. Chúng ta sẽ sử dụng phiên bản cao cấp để tạo một header dính trong Elementor từ đầu vì nó dễ hơn so với Gutenberg; bạn cũng có thể so sánh Elementor vs. Gutenberg để có trải nghiệm tốt nhất.  các chủ đề WordPress WooCommerce tốt nhất

Header Dính Elementor: Tạo và Tùy chỉnh Header với Elementor

Bước 3:

Đến lúc bắt đầu tạo thiết kế header dính trong Elementor. Từ bảng điều khiển WordPress, di chuột qua ‘Mẫu’ và nhấp vào ‘Trình xây dựng Chủ đề.’  Header dính Elementor

Bước 4:

Trong trang trình xây dựng chủ đề, nhấp vào phần ‘Header’ và chọn ‘Thêm Header mới.’ các chủ đề WooCommerce cho WordPress

Bước 5:

Một cửa sổ mới sẽ xuất hiện để tạo một header mới. Chọn mẫu ‘Header’ từ hộp chọn và đặt tên cho header mới. Nhấn ‘Tạo mẫu.’ Header dính Elementor

Bước 6:

Bạn sẽ được chuyển đến trang chỉnh sửa Elementor, nơi bạn có thể tùy chỉnh header dính của mình với các phần tử động và hiệu ứng khác nhau như cột dính và nhiều hơn nữa. Elementor cung cấp 7+ tiện ích giúp tạo một header đẹp và thông tin dễ dàng. Nếu bạn đã sử dụng Gutenberg trước đó, bạn có thể dễ dàng vô hiệu hóa trình biên tập khối tiện ích Gutenberg bằng cách làm theo một số bước. các chủ đề WordPress WooCommerce

Bước 7:

Đầu tiên, chọn cấu trúc cột cho phần header. Chúng ta sẽ sử dụng bố cục hai cột, một cho logo và một cho menu điều hướng. Header dính Elementor

Bước 8:

Bây giờ nhấp vào phần cột mà chúng ta vừa tạo, và một hộp cài đặt phần sẽ xuất hiện. Dưới tab Bố cục, chọn ‘Hộp’ chiều rộng nội dung. Các tính năng khác có sẵn trong cài đặt, như khoảng cách cột, cột dính, chiều cao, căn chỉnh dọc, v.v., mà bạn có thể sử dụng cho phần header.  các chủ đề WooCommerce tốt nhất

Bước 9:

Bây giờ kéo và thả tiện ích logo sang bên trái và tiện ích menu sang bên phải. Nhấp vào

Bài viết này sẽ giúp bạn tạo thành công một tiêu đề cố định, thông tin cơ bản và dính trên trang web WordPress của bạn. Hãy xem xét bài viết của chúng tôi về 5 dịch vụ lưu trữ tốt nhất cho website WordPress để chọn lựa đúng cho trang web WordPress quý giá của bạn.

Để lại một bình luận

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *