[wps_storefront]
The ShopWP Storefront shortcode displays a grid of products with filtering and sorting options.
This feature is only available in ShopWP Pro.
Example Usage​
// Render the storefront without tag filters
[wps_storefront show_tags="false"]
// Force two products per row and sort by price
[wps_storefront items_per_row="2" sort_by="price"]
// Show products without the description present
[wps_storefront excludes="description"]
Available Attributes​
dropzone_payload​
Specifies where the actual filter results should render. Takes any valid CSS selector.
Example
[wps_storefront dropzone_payload="#dropzone-payload"]
dropzone_options​
Specifies where the selectable filter options should render. Takes any valid CSS selector.
Example
[wps_storefront dropzone_options="#dropzone-options"]
dropzone_selections​
Specifies where the selected user choices should render. Takes any valid CSS selector. Omitting will hide user selections all together.
Example
[wps_storefront dropzone_selections="#dropzone-selections"]
sort_by​
Determines the products sort order. Corresponds to the Shopify API values. Will be overwritten if user uses the provided sorting dropdown.
| Possible values |
|---|
| title (default) |
| vendor |
| id |
| price |
| best_selling |
| product_type |
| created_at |
| updated_at |
Example
[wps_storefront sort_by="price"]
reverse​
Reverses the order of products. Useful when used in combination with sort_by. Will be overwritten if user uses the provided sorting dropdown.
| Possible values |
|---|
| true |
| false |
Example
// Smallest to largest (A to Z) (old to new)
[wps_storefront sort_by="title" reverse="true"]
page_size​
Determines the number of products to show per page. Only applicable when pagination is turned on. Will default to the plugin's global "products per page" setting.
Will be overwritten if user uses the provided page size dropdown.
| Possible values |
|---|
| Any number |
Example
// Shows 4 products per page
[wps_storefront page_size="4"]
limit​
Limits the overall number of products that show. Max limit is 250.
| Possible values |
|---|
| Any number |
Example
// Show two products per page, up to 10
[wps_storefront page_size="2" limit="10"]
// Only show one product
[wps_storefront limit="1"]
excludes​
Allows for excluding certain product components like the title, description, etc. Takes a comma separated string of values.
| Possible values |
|---|
| images |
| title |
| pricing |
| description |
| buy-button |
Example
// Don't show the title or pricing
[wps_storefront excludes="title, pricing"]
items_per_row​
Determines how many products will appear in each row.
| Possible values |
|---|
| Any text string |
Example
[wps_storefront items_per_row="5"]
pagination​
Determines whether to hide or show pagination.
| Possible values |
|---|
| true |
| false |
Example
[wps_storefront pagination="false"]
no_results_text​
Specifies the text to use when no filter results are found. Default: No results found.
[wps_storefront no_results_text="Custom no results text with emojis 🚨"]
infinite_scroll​
When turned on, the next page of items will automatically append to the container. Only works when pagination is used.
| Possible values |
|---|
| true |
| false |
Example
[wps_storefront infinite_scroll="true"]
infinite_scroll_offset​
Determines the offset from the edge of the items container. For example, a value of -100 will begin loading additional items 100px before the end of the items container. Offset can be a positive or negative value.
| Possible values |
|---|
| Any positive or negative number |
Example
[wps_storefront infinite_scroll_offset="-100"]
dropzone_sorting​
Specifies where the sorting component should render. Takes any valid CSS selector. Omitting will hide sorting all together.
Example
[wps_storefront dropzone_sorting="#dropzone-sorting"]
dropzone_load_more​
Specifies where the pagination should render. Takes any valid CSS selector. Omitting will hide pagination all together.
Example
[wps_storefront dropzone_load_more="#dropzone-load-more"]
show_tags​
Specifies whether to allow the user to filer by product tags. Setting to false will hide the ability to filter by tags.
Example
[wps_storefront show_tags="false"]
show_vendors​
Specifies whether to allow the user to filer by product vendors. Setting to false will hide the ability to filter by vendors.
Example
[wps_storefront show_vendors="false"]
show_types​
Specifies whether to allow the user to filer by product types. Setting to false will hide the ability to filter by types.
Example
[wps_storefront show_types="false"]
show_price​
Determines whether to hide the filer by price section. Setting to false will hide the ability to filter by price.
Example
[wps_storefront show_price="false"]
show_collections​
Determines whether to hide the filer by collections section. Setting to false will hide the ability to filter by collections.
Example
[wps_storefront show_collections="false"]
show_options_heading​
Specifies whether to show the default "Filter by" options heading.
Example
[wps_storefront show_options_heading="false"]
available_for_sale​
Display products based on their availability. Setting to true will only show products that are in stock.
| Possible values |
|---|
| true |
| any (default) |
Example
[wps_storefront available_for_sale="true"]
price_heading​
Allows for customizing the heading of the "Pricing" filter group. Default: Price.
| Possible values |
|---|
| Any valid string |
Example
[wps_storefront price_heading="Custom price heading"]
collections_heading​
Allows for customizing the heading of the "Collections" filter group. Default: Price.
| Possible values |
|---|
| Any valid string |
Example
[wps_storefront collections_heading="Custom collections heading"]
types_heading​
Allows for customizing the heading of the "Types" filter group. Default: Price.
| Possible values |
|---|
| Any valid string |
Example
[wps_storefront types_heading="Custom types heading"]
tags_heading​
Allows for customizing the heading of the "Tags" filter group. Default: Price.
| Possible values |
|---|
| Any valid string |
Example
[wps_storefront tags_heading="Custom tags heading"]
vendors_heading​
Allows for customizing the heading of the "Vendors" filter group. Default: Price.
| Possible values |
|---|
| Any valid string |
Example
[wps_storefront vendors_heading="Custom vendors heading"]
filter_by_label_text​
Allows for customizing the "Filter by" label. Default: Filter by:.
| Possible values |
|---|
| Any valid string |
Example
[wps_storefront filter_by_label_text="Custom filter by text"]
page_size_label_text​
Allows for customizing the "Page size" label. Default: Page size:.
| Possible values |
|---|
| Any valid string |
Example
[wps_storefront page_size_label_text="Custom page size text"]
clear_filter_selections_text​
Allows for customizing the "Clear selections" text that shows after selecting a filter. Default: Clear selections.
| Possible values |
|---|
| Any valid string |
Example
[wps_storefront clear_filter_selections_text="Custom clear selections"]
selections_available_for_sale_text​
Allows for customizing the "Available for sale" text. Default: Available for sale.
| Possible values |
|---|
| Any valid string |
Example
[wps_storefront selections_available_for_sale_text="Custom available for sale"]
sort_by_label_text​
Allows for customizing the "Sort by" text. Default: Sort by:.
| Possible values |
|---|
| Any valid string |
Example
[wps_storefront sort_by_label_text="Custom sort by text"]
no_filter_group_found_text​
Allows for customizing the text shown when no filter group is found. Default: No %s found.
| Possible values |
|---|
| Any valid string. Use the %s character to dynamically show filter group type |
Example
[wps_storefront no_filter_group_found_text="Custom text"]
filterable_price_values​
This has been moved to the storefront.availablePricing JavaScript filter.
with_search​
Allows for showing the search component with the Storefront component
Example
[wps_storefront with_search="true"]
filter_option_open_on_load​
Allows for determining which filter group to open on page load. Defaults to tags.
| Possible values |
|---|
| tags |
| collections |
| vendors |
| types |
| price |
Example
[wps_storefront filter_option_open_on_load="collections"]