Dịch Vụ
Ưu Đãi
Thư ViệnUX Builder và những hướng dẫn chi tiết – Sử dụng UX Builder trong Theme Flatsome năm 2022
Nội dung
- 1 UX Builder là gì?
- 2 Những tính năng ưu việt của UX Builder
UX Builder là gì?
Không giống với một plugin WordPress, bạn không thể cài đặt UX Builder (ux builder plugin) vì nó Là một công cụ chỉnh sửa giao diện Website được tích hợp sẵn trong Theme Flatsome, UX Builder mang lại khả năng tùy biến giao diện website một cách mạnh mẽ chỉ bằng những thao tác kéo thả.
Chúng ta hãy cùng tìm hiểu xem UX Builder có những tính năng vượt trội nào nhé.
Những tính năng ưu việt của UX Builder
Tích hợp Woocommerce và các tính năng thương mại điện tử
Flatsome là một trong những Theme được sử dụng nhiều nhất và đáng tin cậy nhất cho tất cả các dự án thương mại điện tử tích hợp Woocommerce.
Với đầy đủ các tính năng như:
Hộp tìm kiếm: cho phép khách hàng dễ dàng tìm thấy sản phẩm mà mình mong muốn với trình đơn thả xuống
Xem nhanh sản phẩm: mở nhanh sản phẩm ngay từ danh mục mới tùy chọn xem nhanh
Tùy chọn bong bóng giảm giá: Cung cấp các tùy chọn hiển thị giảm giá cho người dùng, bạn cũng có thể chèn tùy chọn giảm giá vào trong hình ảnh sản phẩm.
Thêm vào giỏ hàng nhanh: Tùy chọn thêm vào giỏ hàng nhanh cung cấp cho khách hàng trải nghiệm nhanh chóng, bạn cũng có thể tùy chỉnh nút trong trang sản phẩm
Sử dụng bất kỳ định dạng hình ảnh nào: Sản phẩm của bạn có thể ở bất kỳ định dạng hình ảnh nào với Theme Flatsome. Lưới sản phẩm điều chỉnh theo định dạng hình ảnh trên sản phẩm của bạn.
Thiết kế tối ưu hóa cho thiết bị di động: Việc điều hướng danh mục sản phẩm siêu nhanh chóng và dễ dàng trên màn hình di động. Điều này sẽ làm cho khách hàng của bạn hài lòng và bán hàng nhiều hơn!
Tùy chỉnh Header
Thành phần
Menu: Thêm danh sách thả xuống nhiều cột đẹp mắt. Bạn có thể thay đổi màu đường viền.
Biểu tượng Tìm kiếm: Thêm biểu tượng tìm kiếm vào tiêu đề. Bạn cũng có thể thêm biểu tượng tìm kiếm này vào tiêu đề di động.
Giỏ hàng nhỏ: Thêm một giỏ hàng nhỏ xinh xắn vào tiêu đề. Chọn giữa nhiều biểu tượng khác nhau hoặc tải lên của riêng bạn. Bạn cũng có thể có một giỏ hàng ‘Off canvas’.
Bản tin: Thêm một hộp đăng ký bản tin đẹp vào tiêu đề. Bạn có thể tích hợp điều này vào hầu hết các biểu mẫu hoặc plugin biểu mẫu đăng ký.
Một số mẫu Header được chỉnh sửa bằng UX Builder trên thiết bị di động
Các mẫu Header trên định dạng máy tính, laptop của Theme Flatsome
- Căn chỉnh chân trang: Chọn cách bạn muốn căn chỉnh chân trang tuyệt đối
- Chân trang tối hoặc sáng: Chọn để có chân trang tối hoặc sáng
- Thay đổi màu nền: Thay đổi nền chân trang thành bất kỳ màu nào. Bạn cũng có thể thêm hình nền.
- Tiện ích bài viết trên blog: Thêm tiện ích bài đăng blog đẹp vào tiện ích chân trang
- Thay thế chân trang: Thay thế chân trang bằng một Khối có thể được chỉnh sửa bằng Trình tạo trang.
Sáng tạo với Flatsome studio có trong UX Builder
Flatsome studio có trong UX Builder là một thư viện sáng tạo trực tuyến lớn với các mẫu template được các nhà sáng tạo chia sẻ miễn phí hoặc có phí, bạn có thể dễ dàng tải về và cài đặt vào website của bạn
Tăng tốc hiệu suất của Website sử dụng Theme Flatsome
Theme Flatsome và trình chỉnh sửa UX Builder cung cấp cho website bạn một hiệu suất siêu cao với các yếu tố:
Chủ đề đa mục đích nhanh nhất trên Themeforest: Mọi yếu tố trong Flatsome đều được tối ưu hóa để có tốc độ trang tốt hơn.
Khung CSS và Javascript nhẹ: Cố gắng tạo CSS để có kích thước tệp nhỏ nhất. Điều này tốt cho tốc độ trang và SEO.
Tải thông minh Lazy Loading: Flatsome sử dụng Smart Lazy Loading trên tất cả các hình nền và hình ảnh, vì vậy hình ảnh chỉ được tải khi cần thiết. Điều đó làm cho trang web tải nhanh đáng kinh ngạc.
Hiệu ứng thị sai & hoạt ảnh hiệu quả cao: Giữ các hoạt ảnh CSS và hiệu ứng thị sai ở mức tối thiểu 60 khung hình / giây. Điều đó làm cho trang web cảm thấy thực sự trơn tru.
Các bài kiểm tra tốc độ đã được thực hiện như thế nào: Chúng tôi đã thử nghiệm Flatsome trên trang này (Classic Shop). Chúng tôi đã sử dụng plugin WP Rocket cho Bộ nhớ đệm. Trang web được lưu trữ trên WP Engine. Lazy Loading trong Advanced> Optimize
Trên đây là tổng quan về các tính năng tính và UX Builder có thể làm được khi kết hợp cùng Theme Flatsome. Sau đây sẽ là những hướng dẫn nếu bạn muốn tự chỉnh sửa với UX Builder để cá nhân hóa trang web của mình.
Thư viện đa dạng các Elements
Section Element
Được sử dụng để tạo hình nền có chiều rộng đầy đủ với nội dung bên trong nó
Ví dụ: Tạo một section đơn giản với 1 hàng 2 cột, một section tối với 1 hàng bên trong, một section với bên trong nền là video, một section có thể chứa hình ảnh hoặc màu,…
Row and Column
Tạo ra các bố cục tuyệt vời bằng cách tạo ra các bố cục cột và hàng bằng Flexbox
Banner
Banner là hệ thống chủ đạo của Flatsome. Hệ thống Banner của UX Builder cho phép bạn tạo các biểu ngữ đáp ứng đẹp mắt bằng cách kéo và thả.
Galleries
Tạo Thư viện bằng cách sử dụng ID hình ảnh và kéo và thả. Bạn có thể dễ dàng tạo phòng trưng bày từ Trình tạo trang.
Product Galleries
Tạo tổng quan đẹp về các danh mục Shop của bạn. Có hầu như không giới hạn các biến thể, nhưng đây là một số ví dụ.
TESTEMONIAL ELEMENT
Hiển thị những đánh giá tích cực của các khách hàng trước đây, hiển thị những chia sẻ và trải nghiệm của họ sau khi sử dụng sản phẩm của bạn. Điều này làm tăng tính trải nghiệm và lòng tin đối với những khách hàng mới đến với website.
__________________________________________________________________________________________________________
Trên đây là những tính năng hữu ích của trình chỉnh sửa trang web UX Builder được tích hợp trong theme Flatsome, bạn có thể tham khảo thêm các chủ đề khác xoay quanh thiết kế website WordPress tại video của Tùng Phát Official. Hoặc tham khảo thêm chuyên mục bài viết về Theme Flatsome.
Tôi là Nguyễn Tuấn Tài, nhân viên của công ty Tùng Phát, đồng hành cùng các bạn trong các chuyên mục bài viết về Thiết kế và quản trị website, hy vọng những nội dung trên sẽ hữu ích cho các bạn.
Dịch Vụ
Blog chia sẻ kiến thức
