Đầu trang và chân trang của trang web là những yếu tố cần thiết. Trong hầu hết các trường hợp, Tiêu đề 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, phần chân trang 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 số amp .
Đầu trang và chân trang được cung cấp theo 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 cho phần lớn mục đích sử dụng của chúng. Tuy nhiên, nếu muốn tùy chỉnh chủ đề của mình, bạn sẽ phải thay đổi mã; Đây là lúc plugin 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 trang web mà không cần biết bất kỳ mã nào.
Hướng dẫn này sẽ hướng dẫn 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 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.
- Tiêu đề là gì và nó có tác dụng gì?
- Chính xác thì Footer là gì?
- Cách tạo tiêu đề
- Phát triển mẫu tiêu đề
- Thực hiện thay đổi cho menu tiêu đề
- Tiêu đề xuất bản
- 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.
- Đưa mọi thứ đến hồi kết
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-29.png)
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 ra các thiết kế và bố cục đẹp mắt. 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 kéo 'n' thả trong Elementor cho phép người dùng di chuyển các vật dụng và vật phẩm xung quanh.
Elementor là trình tạo trang trực quan cho phép người dùng xem trang của họ xuất hiện như thế nào mà không cần chuyển đổi chế độ.
Một lập luận thuyết phục khác khi sử dụng Elementor là hầu hết công việc có thể được hoàn thành mà không mất phí. 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ó tất cả hơn 90 vật dụng.
- Không cần mã hóa để được hỗ trợ đáp ứng.
- 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.
Sẽ rất hữu ích nếu bạn quyết định cách sắp xếp chung các phần đầu trang và chân trang mong muốn trước khi phát triển một đầu trang duy nhất. Nhìn vào bố cục phần tiêu đề được tạo sẵn có thể cung cấp cho bạn nhiều sự lựa chọn.
Bạn có thể chọn từ nhiều phần tiêu đề khác nhau; Tiêu đề phổ biến và hiện đại nhất có logo 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 số Không. 7 mẫu tiêu đề được tạo sẵn; Đâ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.
Tiêu đề là gì và nó có tác dụng gì?
Phần trên cùng của trang web của bạn được gọi là “tiêu đề trang web”. Tiêu đề 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 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.
Tiêu đề cũng có thể hỗ trợ quảng bá nhận diện 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 (dành cho 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 đề.
Chính xác thì Footer 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ư các tiêu đề.
Phần 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 các 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 web, thông tin liên hệ, bản đồ, điều hướng trang web và nhiều thông tin khác, 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, do nhóm thiết kế của Elementor thiết kế.
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.
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-30.png)
Một cửa sổ phương thức sẽ bật lên sau khi bạn được định tuyến. Chọn Tiêu đề từ menu thả xuống, đặt tên cho Tiêu đề và nhấp vào “ Tạo mẫu “:
Thao tác này sẽ khởi chạy trình soạn thảo Elementor. Sau đó, bạn sẽ thấy một danh sách các mẫu để chọn. Vì vậy, hãy chọn một điều hấp dẫn bạn:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-31.png)
Nó sẽ hiển thị ở đầu phần chỉnh sửa Elementor sau khi bạn chọn mẫu:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-32.png)
Tạo Logo: Bước đầu tiên là tạo logo. Đặt logo trong Live Editor của trang web để đặt nó vào Tiêu đề. Chọn một logo bằng cách nhấp vào Site Identity.
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-1300x725.gif)
Khi bạn đã quyết định xong biểu trưng, hãy nhấp vào Xuất bản .
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-33-1300x729.png)
Logo 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 Elementor:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-34.png)
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 cho 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ó:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-35.png)
Đâ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 đề:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-36.png)
Nếu bạn có nhiều menu, bạn có thể cập nhật nội dung nếu cần.
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-1.gif)
Bạn có thể chỉnh sửa các thuộc tính của nó giống như bất kỳ tiện ích nào khác.
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-2.gif)
Nếu 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 Tiêu đề của mình:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-3.gif)
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:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-4.gif)
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 diễn ra:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-37.png)
Tiêu đề xuất bản
Bây giờ bạn có thể xuất bản Tiêu đề sau khi thay đổi xong. Chúng tôi sẽ sử dụng Tiêu đề trên toàn bộ trang web của mình trong ví dụ amp 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:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-5-1300x695.gif)
Và đây là amp về một trang từ trang web trực tiếp của chúng tôi:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-38-1300x737.png)
Cách tạo chân trang
Phát triển mẫu chân trang
Quá trình tạo chân trang khá giống với quá trình tạo tiêu đề. Để tạo một cái, hãy tạo một mẫu chân trang mới như thế này:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-39-1300x713.png)
Sau đó quyết định về một mẫu. Footer 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 một số 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.
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-40-1300x714.png)
Mẫu chúng tôi chọn cho trang web của mình như sau:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-41-1300x715.png)
Sửa đổi chân trang
Bạn sẽ thấy Tiêu đề 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).
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-6-1300x717.gif)
Thay đổi chân trang khi cần thiết; Đây là cách bản sửa đổi của chúng tôi trông như thế nào:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-42-1300x515.png)
Xuất bản chân trang sau khi hoàn thành:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-7-1300x714.gif)
Sản phẩm hoàn thiện
Đây là kết quả hoàn thành. Cả Đầu trang và chân trang hiện đều được sử dụng trên trang web của chúng tôi:
![](https://www.holdersing.com/wp-content/uploads/2022/01/image-8-1300x731.gif)
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 phần đầu trang và chân trang của bạn phản hồi nhanh. Vì menu có chiều rộng đầy đủ thường không phù hợp với chế độ xem trên thiết bị di động nên 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 thiết bị di động. Các công tắc phản hồi ở 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 Đầu trang và chân trang theo nhiều cách khác nhau. Ví amp : bạn có thể sử dụng các công cụ như Browserstack, Kiểm tra CrossBrowser và Google Resizer để đảm bảo rằng các trang web của bạn phản hồi nhanh nhất có thể. Bạn cũng có thể thực hiện thủ công bằng cách thử nghiệm với các thiết bị khác nhau.
Đưa mọi thứ đến hồi kết
Tôi hy vọng hướng dẫn này đã hỗ trợ bạn nhanh chóng phát triển các phần đầu trang và chân trang độc đáo của mình bằ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 ở 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 thành phần trang web, giờ đây bạn có thể thể hiện rõ hơn tầm nhìn về 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 tiện ích bổ sung 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.