Tiếp tục Series làm web bán hàng với Theme Flatsome bài này mình sẽ hướng dẫn bạn cách sử dụng UX Builder. Khi am hiểu bạn sẽ xây dựng nên bố cục trang web chuyên nghiệp và bắt mắt hơn.
Thêm Slider trong Flatsome
Bước 1: Nhấp vào Add Elements để thêm phần tử mới
Nhìn sang cột bên trái bạn sẽ thấy các Element cần thiết cho website.
Bước 2: Nhấp chọn một Element bất kỳ
Mình sẽ nhấp vào Slider chẳng hạn
Nhấp vào Add slides here để thêm một hình ảnh làm Slide
Cột bên trái là khu vực tùy chỉnh hiển thị.
Bước 3: Sau khi ấn vào Add slides here bạn chọn dạng banner hoặc image đều được
Bước 4: Ấn vào Apply
Bước 5: Nhấp vào Select media để tải một hình ảnh lên
Nhấp chuột trái vào văn bản để chỉnh sửa.
Ấn chuột phải chọn Delete nến muốn xóa đi
Bước 6: Thêm Class để tùy chỉnh CSS
Bạn có thể thêm Class tại khu vực Advanced
Sau khi xong xuôi ấn Apply để lưu lại.
Chia cột trong Flatsome
Để chia cột bạn lại thêm Add Element mới.
Đối với các phần tử khác bạn cũng làm tương tự bằng cách ấn vào Add elements
Tiếp theo chọn Row
Chọn số cột muốn hiển thị
Ấn add element để thêm ảnh hoặc bất cứ cái gì bạn muốn hiển thị
Thêm văn bản trong Flatsome
Tiếp tục ở trên sau khi ấn Add element bạn sẽ thêm văn bản vào chẳng hạn
Nhấp đúp chuột vào để thêm văn bản. Hoặc ấn click chuột trái vào khối văn bản rồi ấn Open Text Editor cũng được
Thêm Video trong Flatsome
Để thêm một Video bạn cũng ấn Add element rồi gõ Video lên ô tìm kiếm
Thêm sản phẩm trong Flatsome
Để thêm sản phẩm trước website cần phải cài đặt plugin Woocommerce và thêm sản phẩm vào đã nhé!
Tiếp tục ấn vào Apply => Cứ mỗi lần thực hiện hãy lưu lại bằng cách ấn vào Update.
Với UX Builder bạn cần phải làm việc với nó liên tục cho tới khi thành thạo. Bạn nên xem các mẫu giao diện website khác rồi sau đó học theo để làm. Thực hành liên tục rồi bạn sẽ quen dần. Thời gian đầu sẽ hơi bỡ ngỡ nhưng khi quen rồi bạn sẽ làm trôi chảy và nhanh hơn.