Phần này mình sẽ hướng dẫn các bạn cách thiết kế trang chủ trong WordPress. Với công cụ Elementor, bạn có thể chỉnh sửa và thiết kế bất kì trang nào cực kì dễ dàng. Chỉ mất thời gian ngắn để làm quen và thiết kế mà thôi.
Mục lục
Trang chủ Website nên thiết kế như thế nào?
Ban đầu giao diện Demo cũng đã có trang chủ thiết kế sẵn, bao gồm tất cả những gì nên xuất hiện đầu tiên. Như câu chào, giới thiệu về website, những lợi ích, ai là người đầu não của Website …
Trang Website của bạn cũng nên có một phần cơ bản hoặc tất cả các mục như thế. Có bạn thắc mắc, mình muốn thiết kế kiểu khác có được không. Câu trả lời là được! Tuy theo chủ đề Website của bạn là gì.
Nếu như dạng tin tức, trang bán hàng thì sẽ không cần thiết kế trang chủ như thế này mà đi thằng vào bài viết, những sản phẩm của cửa hàng luôn cũng được. Bạn nên tham khảo những Website lớn để biết cách thiết kế cho riêng mình.
Cách thiết kế trang chủ bằng Elementor
Quay trở lại với Sydney, để bắt đầu thiết kế trang chủ, bạn vào phần chỉnh sửa bằng cách nhập tên website vào Tab kế bên – hoặc từ trang quản trị wp-admin [icon name=”arrow-right” class=”” unprefixed_class=””] chọn xem trang:
Ban chọn mục sửa với Elementor
Bạn được giao diện chỉnh sửa như sau:
Cột bên trái là công cụ Elementor. Bạn kéo xuống để sửa từng mục như mình nhé
Giới thiệu Our Services: Dịch vụ của chúng tôi
Mục này bạn nên có những thông tin chung hoặc giới thiệu về Website của bạn. Như trang Website của bạn có chuyên mục hướng dẫn cách chụp hình – những thủ thuật chụp hình đẳng cấp chẳng hạn.
Để chính sửa thì cực kì đơn giản, bạn nhấp vào chữ Our Services sẽ hiện ô chỉnh sửa ở cột bên cạnh. Bạn chỉnh sửa trực tiếp hoặc thay đổi ở đó. (Bạn nhớ vừa đọc vừa thực hành sẽ dễ hiểu hơn)
Tiếp tục nhấp vào ô Photography:
Trong đó bao gồm:
- Icon: Hình ảnh icon của khung bài viết.
- Xem: Đổi dạng đóng khung hoặc xếp chồng. (Bạn thay đổi icon sẽ thay đổi bên cạnh nên dễ nhận biết)
- Hình dạng: chọn hình tròn, vuông tùy bạn
- Tiêu đề và mô tả: tên tiêu đề và nội dung kèm theo.
Tham khảo:
Để thiết kế ô thêm đẹp bạn hãy chọn Kiểu
Để tạo hiệu ứng, bạn chọn mục di chuột
Ở mục nâng cao, các bạn chỉ quan tâm tới phần hiệu ứng thôi nhé. Có khá nhiều hiệu ứng để bạn chọn giống như trình diễn Powerpoint.
Trong đây có 1 nút bấm là See Some more Services. Bạn sửa thành theo ý bạn. Ví dụ: “Xem thêm”
Trong mục nút sẽ có mục Liên kết URL đang để là #. Để tạo hiệu ứng bấm vào nút xem thêm sẽ tới bài viết của bạn. Hãy copy đường link bài viết để vào đây. Ví dụ như: tenmiencuaban.com/nhat-ky
Tùy chọn màu, hiệu ứng, chữ để làm website của bạn thêm lung linh. Đây là ví dụ bạn có thể tham khảo
Nhìn khá là chuyên nghiệp. Bạn có thể thấy cách chỉnh sửa từng ô như vậy đơn giản phải không nào. Thiết kế Website ngày nay rất dễ, đặc biệt khi bạn có mẫu Demo dựng sẵn. Không cần hiểu về Code, đến bà già trẻ nhỏ chỉ cần làm theo các bước trên cũng có thể dễ dàng tạo Website.
Tiếp tục kéo xuống dưới:
Mục này cơ bản thì cũng không cần thiết lắm. Giới thiệu thêm một số tiện ích mà trang Website hoặc Blog của bạn mang lại. Bạn có thể tùy chỉnh hoặc bỏ đi.
Cách xóa: bạn di chuột vào khung bài viết này, hiện lên thanh như hình [icon name=”arrow-right” class=”” unprefixed_class=””] bấm nút X là được:
Vì cách chỉnh sửa tương tự nhau nên mình chỉ giới thiệu các bạn các mẫu để tham khảo:
Giới thiệu thành viên hoặc người truyền cảm hứng
Bấm vào từng mục Items để chỉnh sửa thành đối tác, bạn bè của bạn hay đồng nghiệp …
Những con số biết nói
Tạo hiệu ứng thống kê cho trang website của bạn
Khách hàng nói gì về bạn
Ở đây bạn có thể chỉnh sửa dòng chữ, thay đổi font, tên khách hàng, avatar…
Các mục tiếp theo Our work, Who are we và Want to know… bạn không cần sử dụng cũng được. Hãy xóa nó đi.
Mục About Us. Đôi dòng giới thiệu về bạn hoặc website của bạn. nếu bạn đã làm hẳn 1 trang giới thiệu thì cũng không cần mục này
Những mục còn lại
Nếu bạn mới thì cũng chưa cần, xóa đi để nhẹ trang chủ. Mình sẽ chỉ bạn cách tạo những mục này sau
Mục bài viết mới bạn sửa lại tên là được
Icon mạng xã hội: bạn muốn kết nối tới trang facebook của bạn thì nhấp vào facebook và thêm địa chỉ facebook của bạn vào. Cái nào thiếu thì bạn thêm và đổi icon. Không cần thì xóa nó đi
Bấm vào cập nhật và hoàn tất quá trình chỉnh sửa trang chủ. Bạn xem lại thành quả bằng tab kế bên nhé
Cơ bản bạn đã chỉnh sửa xong phần trang chủ. Đây là cách để mình chỉnh sửa một giao diện có sẵn, còn nếu mình muốn tạo một trang riêng thì sao. Bạn sẽ cần học một chút về cách sử dụng chức năng thả và kéo của công cụ elementor.
Vậy là bạn đã hoàn thành thiết kế trang chủ trong WordPress với công cụ Elementor.
Trước khi đến với phần thực hành tiếp theo, bạn có thắc mắc về trang, bài viết, chuyên mục và thẻ là gì không? Khi nào thì sử dụng chúng?
Mình sẽ hướng dẫn bạn cụ thể ở phần tiếp theo