Updated : 20/10/2021. Designed by : thietkewebgiarehcm.com
Tính năng bộ lọc sản phẩm ajax, Pagination ajax , Onepage checkout, ... sử dụng duy nhất 1 plugin woocommerce

Giao diện web Thegioididong là giao diện được thiết kế hiện đại mang màu sắc tươi mới dành cho các website dạng cửa hàng to và nhỏ mua bán kinh doanh các mặt hàng công nghệ…

Với nhiều tính năng nổi bật của 1 website bán hàng chuyên nghiệp, tăng trust trong lòng khách hàng là ưu điểm giúp bạn bán được nhiều hàng hơn.

Mô tả bố cục giao diện website

Với giao diện này thì mình xin phép không nói quá nhiều về layout vì cũng chỉ là sản phẩm nhái lại nơi khác. Mình chỉ nói kỹ về tính năng trên trang thôi nhé! Đây là fullpage home.

 

Homepage trang demo thế giới di động
Homepage trang demo thế giới di động

Tính năng bộ lọc sản phẩm ajax.

Đầu tiên không thể bỏ qua một tính năng không thể thiếu khi bán đa dạng sản phẩm, đa dạng thương hiệu và sản phẩm có nhiều thuộc tính.

Trước thì mình vẫn không quá chú trọng vào trang danh mục sản phẩm. Cho đến một lần mình cần tìm mua điện thoại iphone, thì thấy bộ lọc này phát huy sức mạnh khủng khiếp.

Filter Product Ajax Advance
Filter Product Ajax Advance

Nó giúp mình tìm được đúng nhu cầu đang cần mua một cách nhanh chóng và trả về kết quả như mong muốn.

Đó là ở quan điểm người dùng. Bây giờ mình mô tả, mổ sẻ tính năng này sử dụng ở backend có gì nổi bật nhé.!

Đầu tiên là bật tắt bộ lọc cho từng danh mục sản phẩm.

Danh mục nào muốn hiển thị bộ lọc thì đơn giản bạn chỉ cần bật tắt nó ở phần quản trị website.

Bật tắt bộ lọc ở từng danh mục sản phẩm
Bật tắt bộ lọc ở từng danh mục sản phẩm

Những từ khoá có trong bộ lọc như thương hiệu(hình ảnh) , “Ram, Mức giá , CPU, Ổ cứng , Màn Hình….” thì gọi nó là thuộc tính nhé!

Bây giờ làm sao để setup bộ lọc đúng theo ý.! Thật đơn giản khi mình đã code phần lựa chọn loại hiện thị

Setup loại hiển thị cho thuộc tính của bộ lọc.

Setup loại hiển thị cho thuộc tính trong bộ lọc ajax
Setup loại hiển thị cho thuộc tính trong bộ lọc ajax

Mỗi lựa chọn ở đây sẽ quyết định vị trí và cách hiển thị được sắp xếp trước đó.

Đơn cử về options image, khi setup định dạng là image, trong từng chủng loại của thuộc tính sẽ có mục image để bạn lựa chọn hình ảnh đại diện (ví dụ rõ ràng ở đây là thương hiệu).

Tuỳ chỉnh hình ảnh cho chủng loại thuộc tính
Tuỳ chỉnh hình ảnh cho chủng loại thuộc tính

Thật đơn giản để quản lý đúng không ạ? Bây giờ ta qua tới tính năng tiếp theo mà mình muốn nói tới là slider giống thế giới di động.

Tính năng phân trang ajax tại trang danh mục có bộ lọc

Ở trang danh mục sử dụng bộ lọc sản phẩm nâng cao, chúng tôi đã bổ sung phần phân trang ajax, tải sản phẩm không cần tải lại trang.

Điều này giúp trải nghiệm người dùng tốt hơn.

Tính năng Onepage Checkout – thanh toán trên một trang

Thiết kế web giống trang thế giới di động
Thiết kế web giống trang thế giới di động

 

Tính năng yêu cầu thêm miễn phí

Tính năng yêu cầu thêm miễn phí
Tính năng yêu cầu thêm miễn phí

Tính năng thông số kỹ thuật

Tính năng thông số kỹ thuật
Tính năng thông số kỹ thuật

Ở giao diện người dùng sẽ hiển thị thống số kỹ thuật dạng popup. Mình sẽ mô tả bên trong giao diện quản trị phần này sẽ ra sao!

Quản trị phần thông số kỹ thuật
Quản trị phần thông số kỹ thuật

Mình đã code phần thông số kỹ thuật này với 2 cột, một bên là hình ảnh mô phỏng, một bên là bảng thông số kỹ thuật chi tiết!

Tính năng Slider giống thegioididong

Slider giống thế giới di động
Slider giống thế giới di động

Sương sương như vậy thôi. Bạn muốn một giao diện không đụng hàng ở đâu, hãy chọn chúng tôi. Thiết kế web giá rẻ tại TP HCM

4.7/5 - (3 bình chọn)