Video Tutorial - How to Setup Side Filtering For Products in VPCart 9

Video Tutorial - How to Setup Side Filtering For Products in VPCart 9

Product Side Filtering allow your customers to filter or narrow the list of products at product listing page, by price range (just switch the price scroll bar), or enter the wanted keyword and also to narrow them by product features e.g. colors.

Step 1. To configure Product Side Filtering, merchant can login to administration : Modules > Side Filter Manager.

There will be two tabs you can configure (View/Edit) and (Configuration):

Step 2. To change the configuration settings for Side Filter, click Configuration tab.

2a. xproductfiltering_componenttype: List of form field type of side filter. You probably no need to change this config value.

2b. xproductfiltering_page: Side Filter Manager URL. Default page is shopa_editdisplayfilter.asp

2c. xproductfiltering_pricerange_max: Take example, if you want to display a price range filter for your customers from $0 to $10,000. Then you should enter 10000 for this config

2d. xproductfiltering_pricerange_min: Minimum price on side filter price range. The price will be 0(zero) if we consider previous example.

2e. xproductfiltering_seemore_limit:This is only used if you have setup side filter for a product feature. If product features checkbox or radiobox type has more than this amount, it will display a button "See more". Default is 3.

2f. xproductfiltering_sidefilter_enable: Setting this to Yes to enable side filter on product listings page.

2g. xproductfiltering_sidefilter_position:Side filter to be placed either left or right on the site. Enter left to show side filter in left column. Enter right to show side filter in right column.

Step 3. Click continue

Step 4. Merchant can add how many sections to show in the Side Filter. Click the “View/Edit” tab. By default, there is will be three existing sample records for Side Filter.

Step 5. To add a new filter section to be displayed in the Side Filter, click “Add a Record”. Then enter each fields with value that suits your liking. Take example, we want to add a new filter for product features shirt size, and you want this filter section only apply for certain category eg. Garments

5a. Filter Caption : Enter the title of the filter section e.g. Size

5b. Filter Type : Select form fields type you want for this filter e.g. Checkbox

5c. Product Features To Be Retrieved : Select a product feature from the list. VPCart will automatically list all of your site products features records here. Let’s say we pick “Size”.

5d. Show on Search : Set Yes to apply on search result page. Set No if not to apply on search result page.

5e. Hide : Set Yes if you do not use this filter section and it will be hidden. Set No to display it.

5f. Sort Order in Number : Enter the sequence number for your current filter section. For example. 04

5g. Now go to Catergories section. Tick any of the categories from checkboxes that you want this new filter section to show. Eg. Garments

Step 6. Click Add a Record. You can see a message that the record is added

Step 7. Click 'Back to Filter_main' button and view the new record.

Step 8. Now go to your shop and access category 'Garments'. You can see the new filter on the left side

Step 9. Select the checkbox to diplay items accoring to the selection.

Step 10. Click 'Reset Filter' link to clear all the selections.

Thank you for watching and we hope you have found this tutorial useful.

User Manual Reference

For more information about how to use Design Manager to change the look of your site, you can also refer to our VPCart 9 User Guide at!Documents/productsidefiltering.htm

Times Viewed:
Added By:
Date Created:
Last Updated: