Thiết kế các danh mục sản phẩm WooCommerce của bạn với Elementor

Elementor là một trình tạo trang WordPress nổi bật để nâng cao chức năng của trình tạo WordPress mặc định bằng cách thêm các tính năng mới.

Nếu bạn nhớ lại, các phiên bản đầu tiên của WordPress không đặc biệt thân thiện với người dùng. Ngoài chức năng hạn chế, bạn phải dựa vào các chủ đề WordPress được tạo sẵn để tạo thiết kế cơ bản cho trang web của mình. Tuy nhiên, đối với nhiều người dùng, chức năng cơ bản của các chủ đề WordPress không đủ, cần phải cài đặt các plugin hoặc chỉnh sửa thủ công mã chủ đề.

• Kết hợp WooCommerce và Elementor
• Tạo trang danh mục trong Elementor
• Cài đặt Giao diện

Elementor là một trình xây dựng dựa trên khối tương tự như WordPress, nhưng nó cao cấp hơn nhiều so với trình tạo WordPress ở chỗ nó trực quan hơn, đáp ứng nhanh hơn và giàu tính năng hơn. Quan trọng nhất, bạn có thể tạo một trang web tuyệt vời mà không cần phải viết một dòng mã !!

Kết hợp WooCommerce và Elementor

WP-WooCommerce và Elementor là hai trong số các plugin WordPress được sử dụng rộng rãi nhất hiện nay. Mức độ linh hoạt và số lượng tính năng tuyệt đối mà mỗi tính năng cung cấp chỉ đơn giản là vô giá. Nếu bạn đang điều hành một cửa hàng Thương mại điện tử, WooCommerce là plugin tốt nhất cho hầu hết mọi nhu cầu mà bạn có thể có. Đây là plugin toàn diện nhất có sẵn cho mọi nhu cầu thực tế.

Ngoài ra, Elementor là một trong những trình xây dựng trang web kéo và thả hiệu quả nhất hiện có trên thị trường. Nó cung cấp cho bạn khả năng nhanh chóng thiết kế, tùy chỉnh và cung cấp gần như bất kỳ trang nào trên trang web của bạn. Thậm chí, nhiều tính năng có sẵn, chẳng hạn như tạo các menu lớn và truy cập một loạt các tiện ích bổ sung và mẫu rất tiện lợi. Với sự trợ giúp của cả WooCommerce và Elementor, bạn có thể thiết kế và xây dựng các trang Cửa hàng và Doanh nghiệp chất lượng chuyên nghiệp với ít chi phí và công sức nhất có thể. Với sự trợ giúp của Elementor, bạn hoàn toàn có thể tùy chỉnh bố cục Cửa hàng, lưới sản phẩm và băng chuyền, cũng như chọn từ nhiều bố cục đẹp mắt khác nhau. Cũng có sẵn khả năng thiết lập và cá nhân hóa các trang thanh toán và giỏ hàng của bạn, cũng như tích hợp chúng với nhiều tùy chọn và tính năng thanh toán để cung cấp cho khách hàng của bạn sự tiện lợi hơn.

Ngoài ra, bạn có thể tạo các trang và thiết kế tùy chỉnh cho hàng hóa kỹ thuật số, bao gồm các tùy chọn trang tùy chỉnh để vận chuyển và thanh toán cũng như các trang đăng và mua trước, trong số những thứ khác. Tất cả những điều này góp phần làm cho trang web của công ty bạn trở nên chuyên nghiệp và thân thiện với người dùng. Cùng với các nút kêu gọi hành động thân thiện với người dùng, thanh trượt sẵn sàng thị sai và một loạt các tính năng khác, bạn có thể tích hợp chức năng WooCommerce vào trang web của mình. Số lượng cơ hội tuyệt đối có sẵn là hầu như vô hạn. Bây giờ, nếu bạn đủ thuyết phục, hãy để chúng tôi hướng dẫn bạn quy trình đưa kế hoạch của bạn vào thực hiện. Bạn có thể làm nhiều việc khác nhau để làm cho trang Shop của bạn trở nên hấp dẫn hơn và mục tiêu của các bước này là để hỗ trợ bạn trong việc tạo một trang Shop thân thiện hơn cho cửa hàng WooCommerce của bạn.

Tạo trang danh mục WooCommerce trong Elementor

Nếu bạn đã quen thuộc với WooCommerce, bạn biết rằng danh mục sản phẩm rất quan trọng trong việc tổ chức sản phẩm của bạn để khách hàng hiển thị và tiếp cận phù hợp - họ có thể tìm thấy những gì họ đang tìm kiếm càng nhanh thì càng tốt. Nhưng chính xác thì các loại sản phẩm là gì?

Khách hàng dành một lượng thời gian đáng kể để duyệt các sản phẩm của bạn trên trang cửa hàng của bạn, vì vậy họ phải có trải nghiệm tích cực. Không có gì khó chịu hơn việc phải điều hướng qua hàng chục trang để xem các sản phẩm trên trang web của cửa hàng của bạn.

Do đó, việc phân loại là điều cần thiết để cung cấp cho khách hàng của bạn trải nghiệm mua sắm tốt hơn. Khách hàng sẽ dễ dàng phân loại và lọc ra sở thích của mình hơn nếu có một phần được sắp xếp và tổ chức hợp lý cho tất cả các loại mặt hàng như quần áo hoặc giày dép. Thêm các yếu tố tạo khách hàng tiềm năng như nút gọi hành động, phần sản phẩm nổi bật, cửa sổ bật lên để bán hàng hoặc ưu đãi và các thành phần tương tự khác vào phần này có thể làm cho phần này hấp dẫn hơn đối với khách truy cập.

Nếu bạn có một cửa hàng WooCommerce và muốn nâng cấp nó, hướng dẫn này chính xác là những gì bạn cần để bắt đầu.

Nhiều chủ đề WooCommerce bao gồm bố cục mặc định cho Danh mục sản phẩm, có thể phù hợp nhất hoặc không phù hợp nhất với nhu cầu kinh doanh của bạn. Mặc dù những giá trị mặc định này có thể bao gồm một số tính năng hữu ích, nhưng chúng không thể thường xuyên được tùy chỉnh.

Hãy bắt tay vào công việc.
Sau khi thiết lập sản phẩm của mình, bạn cần thực hiện những việc sau trước khi xuất bản để sản phẩm xuất hiện trong danh mục:

Bạn sẽ đặt các điều kiện sẽ xác định nơi mẫu sản phẩm của bạn sẽ xuất hiện trong giai đoạn này. Khi bạn sử dụng một mẫu, nó sẽ tự động áp dụng cho tất cả các trang sản phẩm trên trang web của bạn. Bạn cũng có thể thu hẹp tìm kiếm của mình vào một danh mục sản phẩm cụ thể.

Nhấp vào Xuất bản, và sản phẩm duy nhất của bạn hiện có sẵn để mua!

Chúng tôi vẫn chưa xong.
Những gì chúng tôi vừa làm là không đủ để đưa các danh mục trực tuyến trên trang web của chúng tôi; để hiển thị danh mục trên tất cả hoặc một số trang trên trang web của chúng tôi, chúng tôi vẫn cần thiết lập một số điều. Để hoàn thành nhiệm vụ, hãy tạo một trang danh mục sản phẩm sẽ ảnh hưởng đến tất cả các sản phẩm hoặc một trang danh mục sẽ ảnh hưởng đến một danh mục sản phẩm cụ thể.
Để thực hiện việc này, trước tiên, quay lại Elementor> My Templates và tạo một mẫu lưu trữ sản phẩm. Sau đó, chọn một mẫu hiện có hoặc tạo một mẫu mới. Tùy chỉnh giao diện của tiện ích Sản phẩm lưu trữ và tiện ích Tiêu đề lưu trữ bằng cách thêm chúng vào trang của bạn.

Sử dụng chức năng kiểu sao chép giữa các trang để tùy chỉnh nó cho phù hợp với thiết kế bạn đã tạo cho mẫu sản phẩm đơn lẻ của mình, sau đó lưu các thay đổi của bạn.
Quay lại trang sản phẩm và chọn Sao chép từ menu thả xuống. Bấm chuột phải vào Dán Kiểu khi bạn quay lại sản phẩm lưu trữ. Chọn Sản phẩm mới nhất từ ​​menu thả xuống Truy vấn> Nguồn trong cài đặt Sản phẩm lưu trữ.
Sau đó, chọn nhẫn từ menu thả xuống Danh mục sản phẩm. Chỉ loại nhẫn sẽ được hiển thị theo cách này. Nếu bạn có một danh sách dài các sản phẩm cho một danh mục cụ thể, bạn nên bật tính năng phân trang.
Bạn có thể tùy chỉnh khoảng cách giữa các cột và các hàng bằng cách chọn tab kiểu. Thay đổi màu sắc, phông chữ và các khía cạnh khác của thiết kế.

Trước khi xuất bản, chọn các điều kiện xác định nơi lưu trữ sẽ xuất hiện, giống như bạn đã làm đối với mẫu sản phẩm đơn lẻ, rồi xuất bản.

Sau khi bạn nhấn “xuất bản”, trang lưu trữ của bạn sẽ hoạt động.

Elementor pro cung cấp cho bạn khả năng thiết kế các danh mục sản phẩm sạch sẽ với hàng loạt các tùy chọn;

Bạn có thể thực hiện những việc sau với các tùy chọn có sẵn trên Elementor Pro:

Cài đặt bố cục cho các danh mục sản phẩm WooCommerce

• Cột: Đặt số cột chính xác để hiển thị, từ 1 đến 12
• Đếm danh mục: Chọn số lượng danh mục để hiển thị

Cài đặt truy vấn

• Nguồn: Chọn nguồn để hiển thị các danh mục, chọn từ Tất cả, Lựa chọn thủ công, Theo Danh mục chính hoặc Hiện tại. Nếu Lựa chọn Thủ công được chọn, hãy chọn theo cách thủ công các danh mục sẽ hiển thị. Nếu “Theo cha mẹ” được chọn, hãy chọn từ Chỉ Cấp cao nhất hoặc chọn một danh mục riêng lẻ từ danh sách thả xuống.
• Ẩn trống: Đặt thành Có cho các danh mục không có sản phẩm nào bên trong chúng
• Đặt hàng theo: Đặt thứ tự các danh mục sẽ được hiển thị. Các tùy chọn bao gồm Tên, Sên, Mô tả hoặc Đếm
• Thứ tự: Chọn để hiển thị các danh mục theo thứ tự ASC hoặc DESC (Tăng dần hoặc Giảm dần)

Cài đặt kiểu

• Khoảng cách cột: Đặt khoảng cách chính xác giữa các cột
• Khoảng cách hàng: Đặt khoảng cách chính xác giữa các hàng
• Căn chỉnh: Căn chỉnh dữ liệu sản phẩm sang trái, phải hoặc chính giữa

Cài đặt hình ảnh

• Loại đường viền: Chọn loại đường viền, chọn từ không đường viền, liền khối, kép, chấm, đứt nét hoặc có rãnh
• Bán kính đường viền: Đặt bán kính để kiểm soát độ tròn góc của đường viền
• Khoảng cách: Điều chỉnh lượng không gian giữa các hình ảnh và dữ liệu của chúng

Cài đặt tiêu đề

• Màu sắc: Chọn màu Tiêu đề
• Kiểu chữ: Đặt các tùy chọn kiểu chữ cho văn bản Tiêu đề

Đếm cài đặt

• Màu sắc: Chọn màu cho Đếm
• Kiểu chữ: Đặt các tùy chọn kiểu chữ cho Count

Phần kết luận

WooCommerce Builder trong Elementor cung cấp cho bạn sự linh hoạt trong thiết kế mà bạn cần để tạo và tinh chỉnh các trang sản phẩm của mình một cách trực quan. Thời gian cần thiết để đi từ ý tưởng thành hiện thực , và đầy đủ Cửa hàng WooCommerce trực tuyến chức năng được giảm đáng kể do điều này giúp bạn tiết kiệm thời gian. Nhìn chung, việc tùy chỉnh trang cửa hàng WooCommerce của bạn với Elementor có khả năng tác động đáng kể đến hiệu suất tổng thể của trang web của bạn. Bạn có thể giúp đỡ hoặc cản trở việc bán hàng bằng cách tổ chức và trưng bày sản phẩm của mình theo cách tốt nhất có thể để khách hàng nhìn thấy và mua chúng. Việc thiết lập và tùy chỉnh Trang cửa hàng WooCommerce của bạn trong Elementor sẽ được trình bày thông qua các bước trong hướng dẫn này. Tuy nhiên, hãy nhớ rằng đây chỉ là phần nổi của tảng băng nếu xét về phạm vi của vấn đề. Phần giới thiệu về cách sử dụng Elementor để tạo trang Shop lý tưởng cho cửa hàng của bạn được trình bày trong phần trình diễn cơ bản này. Sử dụng điều này làm điểm bắt đầu và thử nghiệm với nó để tận dụng tối đa trình tạo trang tuyệt vời này