Product Slider Element | Shopper App


You can add the Product Silder element when editing the app homepage, and swipe right to view more products. This not only allows you to have a tidy and neat layout, but also allows customers to browse products and increase the sense of interaction.


Step 1

Go to [Mobile App Management] > [App Design], and click Setting to enter Current Template to edit the Product Silder element.



Step 2

Click Add an element and select Product Slider element. Drag it to the preview area at the center to the location where you can insert the element.




Step 3

Enter the element title in the right editing area.


Step 4

Set the font alignment and color.



Step 5

If you switch on the "Show Button" toggle switch, you need to fill in the button text which will appear at the top right of the Product Slider. No jump link is required. Customers will be directed to the native product list page to browse products when tapping on the button.



Step 6

You can link the element to the product list page or the custom URL.


*Note: A "More" button appears after sliding the element to the the far right, as shown below:



Step 7

Next, select to show products or a product category.


*Note: No matter how many products are added, the Slider element can display a maximum of 10 products. You need to click "More" to enter the product list to view the rest of the products.


A. When you select products

Check the box for the product(s) you want to display (at most 500 products), click Confirm to save the selection.



B. When you select a product category

Check the box of the category you want to add, and click Confirm to add.

Click the arrow icon to add the sub-category from the drop-down list.

*Note: You can only add one product category.



Step 8

Select the display style.

A. Style settings

Check the box for the product information you want to show.



B. Product display rule

You can decide whether to show sold-out or hidden products. Once you switch on the toggle and update, customers will see the hidden products in the app. 



  1. Unpublished products will be automatically filtered.
  2. The display rules set here will be synchronized to the product list page that the "More" button jumps to.
  3. If you select not to display sold-out items, items with unlimited inventory will also be filtered out.


Step 9

Set the release schedule if necessary.



Step 10

Click Save and Update to update the settings to the app.




Read more






Have more questions? Submit a request