Đầu trang và chân trang của một trang web là những yếu tố cần thiết. Trong hầu hết các trường hợp, Header cung cấp các liên kết điều hướng giúp đơn giản hóa việc điều hướng đến các phần khác nhau của trang web. Mặt khác, footer có chứa thông tin quan trọng mà khách truy cập trang web có thể yêu cầu, chẳng hạn như địa chỉ doanh nghiệp hoặc thông tin liên hệ, đề cập đến một vài ex amp les.
Đầu trang và chân trang được cung cấp bởi chủ đề hiện tại của người dùng trên WordPress. Chúng thường được thiết kế tốt và phù hợp với phần lớn các mục đích sử dụng của chúng. Tuy nhiên, nếu bạn muốn tùy chỉnh các chủ đề của mình, bạn sẽ phải thay đổi mã; Đây là lúc plugin của Trình tạo trang trở nên hữu ích. Bạn có thể sử dụng chúng để tạo và thay đổi các thành phần của trang web mà không cần biết bất kỳ mã nào.
Hướng dẫn này sẽ dạy chúng ta cách tạo đầu trang và chân trang cho trang web. Elementor Pro sẽ được sử dụng (vì phiên bản cơ bản của Elementor không bao gồm các tính năng quan trọng nhất để tạo các thành phần này). Vì vậy, hãy tải xuống Elementor Pro và đảm bảo rằng nó đã được bật.
- Tại sao bạn nên chọn Elementor làm trình tạo trang của mình?
- Elementor cho phép bạn chọn bố cục chính của đầu trang và chân trang tùy chỉnh của bạn.
- Header là gì và nó làm gì?
- Footer là gì, chính xác là gì?
- Cách tạo tiêu đề
- Phát triển mẫu tiêu đề
- Thực hiện thay đổi đối với menu tiêu đề
- Xuất bản Tiêu đề
- Cách tạo chân trang
- Phát triển mẫu chân trang
- Sửa đổi chân trang
- Sản phẩm hoàn thiện
- Kiểm tra phần đầu trang và chân trang của bạn để biết khả năng phản hồi.
- Kết thúc mọi thứ
Tại sao bạn nên chọn Elementor làm trình tạo trang của mình?
Elementor là trình tạo trang tiên tiến nhất, cho phép người dùng sử dụng các phần tử cao cấp để tạo các thiết kế và bố cục tuyệt đẹp. Nó rất có lợi cho những người mới chưa có kiến thức về mã hóa. Trình chỉnh sửa thả 'n' trong Elementor cho phép người dùng di chuyển các widget và mục xung quanh.
Elementor là một trình tạo trang trực quan cho phép người dùng xem các trang của họ xuất hiện như thế nào mà không cần chuyển đổi chế độ.
Một lý lẽ thuyết phục khác để sử dụng Elementor là hầu hết công việc có thể được hoàn thành mà không tốn kém. Phiên bản miễn phí của họ có nhiều khả năng cung cấp khả năng chỉnh sửa trang web đầy đủ. Tuy nhiên, chúng tôi sẽ xem xét cả phiên bản miễn phí và trả phí để bạn có thể chọn phiên bản phù hợp nhất với nhu cầu của mình.
Sau đây là một số khía cạnh quan trọng của Elementor khiến nó trở nên đáng giá:
- Chức năng kéo và thả được hỗ trợ.
- Nó có một số lượng lớn các mẫu.
- Có hơn 90 vật dụng trong tất cả.
- Không cần mã hóa để hỗ trợ đáp ứng.
- Các tùy chọn làm lại và hoàn tác có sẵn.
- Tự động lưu có sẵn.
Elementor cho phép bạn chọn bố cục chính của đầu trang và chân trang tùy chỉnh của bạn.
Sẽ hữu ích nếu bạn quyết định bố trí chung các phần đầu trang và chân trang mong muốn trước khi phát triển một tiêu đề duy nhất. Nhìn vào bố cục phần tiêu đề được tạo trước có thể cung cấp cho bạn nhiều lựa chọn.
Bạn có thể chọn từ các phần tiêu đề khác nhau; Header thông dụng và hiện đại nhất có biểu tượng trang web ở góc ngoài cùng bên trái, thanh điều hướng ở giữa và phần thanh tìm kiếm ở bên phải.
Có vô số khả năng và bạn có thể xây dựng bất kỳ bố cục nào bạn muốn.
Tôi đã chọn mẫu tiêu đề làm sẵn số 7; Đây là cách tiếp cận phổ biến và đơn giản nhất để sử dụng tiêu đề trên trang web WordPress. Sao chép và dán tên mẫu tiêu đề vào Mẫu> Tiêu đề> mẫu tìm kiếm> dán tên tiêu đề đã sao chép .
Khi bạn đã tìm thấy mẫu tiêu đề mình muốn, hãy chọn “Chỉnh sửa bằng Elementor” và bạn sẽ được đưa đến phần trình tạo tiêu đề Elementor Pro.
Hãy bắt đầu bữa tiệc nào.
Header là gì và nó làm gì?
Phần trên cùng của trang web của bạn được gọi là “tiêu đề trang web”. Header thường giống nhau trên toàn bộ trang web của bạn. Tuy nhiên, một số trang web sử dụng các tiêu đề khác nhau cho các phần khác nhau của trang web.
Thiết kế tiêu đề của bạn sẽ mang lại cho người dùng ấn tượng đầu tiên của họ về trang web của bạn, cho dù họ đã đến trang chủ, trang giới thiệu hay nội dung riêng lẻ khác. Và, nếu nó được thiết kế tốt, nó sẽ thu hút sự chú ý của người dùng và lôi kéo họ tiếp tục cuộn và đọc.
Header cũng có thể hỗ trợ trong việc quảng bá bản sắc thương hiệu của công ty bạn.
Tôi đang sử dụng các tính năng như logo, phông chữ, màu sắc và ngôn ngữ thương hiệu tổng thể của công ty.
Điều hướng trang web, tìm kiếm trang web, giỏ hàng (cho các trang web bán hàng), nút kêu gọi hành động (CTA) và các tính năng khác giúp cải thiện trải nghiệm người dùng và tăng tỷ lệ chuyển đổi đều được tìm thấy trong tiêu đề.
Footer là gì, chính xác là gì?
Chân trang là một phần của trang web xuất hiện ở cuối trang. Chúng thường được hiển thị liên tục trên toàn bộ trang web, trên tất cả các trang và bài đăng, tương tự như tiêu đề.
Chân trang thường bị bỏ qua, điều này gây lãng phí tiềm năng, vì chúng xuất hiện trên mọi trang của trang web. Chúng đều quan trọng như nhau đối với tiêu đề.
Thiết kế chân trang của bạn có thể hiển thị thông tin hữu ích và quan trọng như đăng ký bản tin, thông tin bản quyền, điều khoản sử dụng và quyền riêng tư, sơ đồ trang, thông tin liên hệ, bản đồ, điều hướng trang web, v.v., tùy thuộc vào cài đặt bạn chọn.
Cách tạo tiêu đề
Chúng tôi sẽ tạo một tiêu đề tùy chỉnh trong phần này. Đừng lo lắng nếu điều đó có vẻ đáng sợ; chúng ta sẽ không bắt đầu lại từ đầu. Thay vào đó, chúng tôi sẽ sử dụng các mẫu của Elementór Pro, được thiết kế bởi nhóm thiết kế của Elementor.
Phát triển mẫu tiêu đề
Trên bảng quản trị WordPress, di chuột qua Mẫu và nhấp vào Thêm mới để tạo Tiêu đề của chúng tôi.
Một cửa sổ phương thức sẽ bật lên khi bạn đã được định tuyến. Chọn Tiêu đề từ trình đơn thả xuống, đặt tên Tiêu đề và nhấp vào “ Tạo Mẫu ”:
Thao tác này sẽ khởi chạy trình chỉnh sửa Elementor. Sau đó, bạn sẽ thấy một danh sách các mẫu để lựa chọn. Vì vậy, hãy chọn một trong số đó hấp dẫn bạn:
Nó sẽ hiển thị trên đầu phần chỉnh sửa Elementor sau khi bạn chọn một mẫu:
Tạo Logo: Bước đầu tiên là tạo một logo. Đặt biểu trưng trong Trình chỉnh sửa trực tiếp của trang web để đưa biểu trưng đó vào Tiêu đề. Chọn một biểu trưng bằng cách nhấp vào Nhận dạng Trang web.
Khi bạn đã quyết định về một biểu trưng, hãy nhấp vào Xuất bản .
Biểu trưng trang web của bạn bây giờ sẽ nằm trong Tiêu đề nếu bạn làm mới giao diện Phần tử:
Sau đó, bạn có thể thực hiện bất kỳ thay đổi nào bạn muốn.
Thực hiện thay đổi đối với menu tiêu đề
Điều tiếp theo chúng ta nên làm là thay đổi menu. Nếu bạn đã tạo một menu, mẫu sẽ tự động kết hợp nó:
Đây là cấu trúc menu của chúng tôi, mà bạn có thể thấy được phản ánh trong mẫu tiêu đề:
Nếu bạn có nhiều menu, bạn có thể cập nhật nội dung nếu cần.
Bạn có thể chỉnh sửa các thuộc tính của nó giống như bất kỳ widget nào khác.
Nếu chúng ta cần thêm nhiều mục hơn, chúng ta có thể thêm nhiều phần hơn vào Header của mình:
Hãy bắt đầu bằng cách thêm tiêu đề và một số biểu tượng mạng xã hội:
Sau đó, bạn có thể thực hiện bất kỳ thay đổi nào bạn muốn. Đây là cách chỉnh sửa của chúng tôi thành ra:
Xuất bản Tiêu đề
Bây giờ bạn có thể xuất bản Tiêu đề sau khi bạn đã hoàn thành việc sửa đổi nó. Chúng tôi sẽ sử dụng Header trên toàn bộ trang web của chúng tôi trong ex amp le bên dưới, vì vậy chúng tôi sẽ chọn lựa chọn đó sau khi chọn Thêm điều kiện:
Và đây là một cựu amp le của một trang từ trang web hoạt động của chúng tôi:
Cách tạo chân trang
Phát triển mẫu chân trang
Quá trình tạo footer tương tự như quá trình tạo header. Để tạo một mẫu, hãy tạo một mẫu chân trang mới như sau:
Sau đó, quyết định về một mẫu. Chân trang có nhiều hình dạng và kích cỡ khác nhau. Một số bao gồm thông tin công ty, trong khi những người khác có biểu mẫu liên hệ. Chọn một mẫu phù hợp với yêu cầu của bạn.
Mẫu chúng tôi chọn cho trang web của mình như sau:
Sửa đổi chân trang
Bạn sẽ thấy Header ngay khi bắt đầu chỉnh sửa (nếu bạn đặt điều kiện để nó xuất hiện trên tất cả các trang).
Thay đổi chân trang nếu cần; Đây là cách bản sửa đổi của chúng tôi trông:
Xuất bản chân trang sau khi hoàn tất:
Sản phẩm hoàn thiện
Đây là kết quả đã hoàn thành trông như thế nào. Cả Header và footer hiện đều được sử dụng trên trang web của chúng tôi:
Kiểm tra phần đầu trang và chân trang của bạn để biết khả năng phản hồi.
Đây là giai đoạn quan trọng nhất và bạn phải đảm bảo rằng các phần đầu trang và chân trang của bạn đáp ứng. Bởi vì menu toàn chiều rộng thường không phù hợp với chế độ xem trên thiết bị di động, bạn phải biết thiết kế của mình sẽ xuất hiện như thế nào trên màn hình di động. Các công tắc đáp ứng ở cuối phần thanh bên Elementor có thể thay đổi phiên bản tab và thiết bị di động.
Bạn có thể kiểm tra khả năng phản hồi của Header và footer theo nhiều cách khác nhau. Đối với ex amp le, bạn có thể sử dụng các công cụ như Browserstack, CrossBrowser Testing và Google Resizer để đảm bảo rằng các trang web của bạn luôn phản hồi nhanh nhất có thể. Bạn cũng có thể làm điều đó theo cách thủ công bằng cách thử nghiệm với các thiết bị khác nhau.
Kết thúc mọi thứ
Tôi hy vọng hướng dẫn này đã hỗ trợ bạn trong việc phát triển nhanh chóng các phần đầu trang và chân trang độc đáo của mình bằng cách sử dụng Elementor Pro. WordPress có nhiều tính năng, nhưng nó chỉ cho phép sửa đổi một số phần trong phần đầu trang và chân trang, cuối cùng đã được sửa bằng trình tạo trang Elementor Pro. Với khả năng kiểm soát tốt hơn nhiều đối với các phần tử trang web của bạn, giờ đây bạn có thể thể hiện tốt hơn tầm nhìn của trang web của mình. Hơn nữa, chức năng của Elementor đã được cải thiện bằng cách sử dụng các addon miễn phí, cho phép người dùng tùy chỉnh trang web của họ với các khả năng nâng cao hơn.
