Customize the Recommendation Section in WooCommerce

In the ever-evolving landscape of e-commerce, the recommendation section plays a crucial role in driving customer engagement and increasing sales. This article dives into the realm of customization options available for the recommendation section provided by WebToffee’s WooCommerce Product Recommendations plugin. The plugin allows the following:

• Customizing the recommendation display layouts.
• Customizing recommendation section title.
• Selecting the desired number of products to be showcased in the recommendation section.
• Hidings the out-of-stock products from the recommendation section.

To get started, from the WordPress dashboard navigate to WooCommerce > Product Recommendations > General settings

The initial step in customizing the product recommendation section is selecting a display layout. Choosing the layout is prioritized because the other customization options vary depending on the chosen layout. The Plugin has two inbuilt layouts, and they are:

• Slider
• Grid

Grid layout provides a structured and organized display, allowing users to view multiple products simultaneously. Once Grid is selected, The configuration options available are:

The following page showcases a product recommendation grid layout featuring eight products. The title is aligned to the left and displayed in red, while the out-of-stock products are hidden.

The slider layout offers a dynamic and visually appealing way to showcase products, with a scrolling effect that can draw attention and highlight key items. Once the Slider is selected, The configuration options available are:

Enable Loop Slider

• The Enable Loop Slider option’s visibility is contingent upon the slider option’s selection.
• Enabling the loop slider feature ensures a seamless browsing experience for customers. With loop sliders, users can continuously scroll through the products without reaching an endpoint. This feature eliminates any interruptions or dead ends, keeping customers engaged and encouraging further exploration.

The image below shows a product page with a product recommendation slider with 8 products, where the slider is set to loop continuously. The section’s title is aligned to the left and shown in red. Also, any out-of-stock products are hidden from view.

Customizing the number of products shown in the slider allows one to strike the right balance between providing sufficient options and avoiding overwhelming customers. This can be achieved by configuring the following features:

• The visibility of the Number of products to show per page is contingent upon the selection of the slider option within the Display Layout section. This feature is available only when the slider layout is selected.

• The number of products displayed can be configured and adjusted differently for different devices, such as desktops, tablets, and mobile devices.

• When customizing the product display layout, one crucial aspect to consider is the total number of products displayed inside the recommendation section. The plugin allows controlling the number of products displayed to customers at any given time with the help of the Total number of products to show section.
• For example, by setting a specific number, such as 10, it can create a focused product listing that showcases the most relevant and attractive items.

The plugin allows the title alignment and color adjustment when customizing the product recommendation display layout. This creates a visually appealing and cohesive design. This can be achieved by configuring the following features:

• Customizing the title alignment enables positioning of the product titles within the display layout according to the design preferences.
• Left alignment provides a classic and clean look, while right alignment can create a sense of visual interest. Center alignment, on the other hand, offers a balanced and symmetrical presentation.

• Customizing the title color can enhance brand consistency and improve the readability of product titles.
• Choosing a contrasting color for the titles can make them stand out against the background, improving visibility and drawing attention.

Enabling the Hide Out of Stock Products feature ensures that all out-of-stock products are automatically hidden from the recommendation section. This will help to improve the user experience by displaying only available items for purchase. It avoids frustrating users with false expectations and saves their time by eliminating irrelevant options.