> ## Documentation Index > Fetch the complete documentation index at: https://docs.fusioncore.us/llms.txt > Use this file to discover all available pages before exploring further. # The Store and Product Pages > Place the storefront grid and the product detail page on your portal site, and what a shopper does on each — searching, filtering, sorting, choosing options, and adding to the cart. ## Overview The Store page is the grid a shopper browses. The Product page is one product in detail, and it is where a shopper makes any choice the product requires before it can be bought. Both read their configuration from a [Store Settings](https://docs.fusioncore.us/end-user-guides/portal/store/setting-up-store-settings.md) record. ## Prerequisites * A Store Settings record exists, with **Store Page URL** and **Product Page URL** set. * Your products meet the storefront requirements — see [Preparing Products for the Store](https://docs.fusioncore.us/end-user-guides/portal/store/preparing-products.md). ## Place the Pages **1. Create the Store page** In Experience Builder, create a page at the path you put in **Store Page URL** (for example `/store`) and drag **FS Portal - Store** onto it. | Property | Default | What it does | | - | - | - | | **Results Per Page** (`resultsPerPage`) | `8` | Product tiles per page before pagination | | **Product Tile Layout** (`productTileLayout`) | `Standard` | Tile density: standard, compact, or minimal | | **Max Visible Category Pills** (`maxVisibleCategories`) | `4` | Category pills shown inline on desktop before the rest collapse into **More**. Values above 8 fall back to 8; blank or invalid falls back to 4 | | **Store Settings** (`storeSettingsName`) | `Default` | The Store Settings record this page uses | **2. Create the Product page** Create a page at the path you put in **Product Page URL** (for example `/product`) and drag **FS Portal - Store Product Detail** onto it. The component reads which product to show from the `productId` URL parameter, which the Store adds for you. | Property | Default | What it does | | - | - | - | | **Hide Categories** (`hideCategories`) | `false` | Hides the categories line above the product name | | **Store Settings** (`storeSettingsName`) | `Default` | The Store Settings record this page uses | **3. Publish** Click **Publish**. > [!NOTE] > > Both pages work for guests as well as members, so long as your Experience Cloud guest user profile grants access. See [Enabling Guest Portal Users](https://docs.fusioncore.us/end-user-guides/portal/enabling-guest-portal-users.md). ## Browsing the Store | Control | Behavior | | - | - | | **Search** | Matches the product's name, short description, and description. Filters as the shopper types | | **Category pills** | Filter to one category at a time, or **All**. Only portal-visible categories appear | | **Sort** | By **Name** (alphabetical) or by **Price** (lowest first) | | **Currency picker** | Multi-currency orgs only, offering the codes in **Currency ISO Codes** | | **Result count** | The number of products matching the current search and filter | | **Pagination** | **Previous** / **Next**, sized by **Results Per Page** | Each tile shows the product image with its badge, the name, the short description, and the price. A shopper who qualifies for a better price sees **Your Price** with the list price struck through; a guest sees the list price alone. > [!TIP] > > Search and category filter work together — searching narrows within the selected category rather than replacing it. ## Adding to the Cart from a Tile Clicking **Add to Cart** on a tile does one of three things, depending on the product: | The product | What happens | | - | - | | Needs nothing from the shopper | Added to the cart immediately | | Needs a choice, and only one option exists | That option is applied silently and the product is added | | Needs a choice with several options | The shopper goes to the Product page to choose | Prices are recalculated as the shopper works. Crossing a quantity tier reprices the tile on the spot, so the figure they see is the figure they will be charged, before tax. > [!WARNING] > > Switching currency with items in the cart **clears the cart**. The shopper is warned and must confirm first, because prices and product availability both depend on currency. ## The Product Page The page shows the product's image, its categories (unless **Hide Categories** is on), its name, and its **Description** — the longer text, where the tile used **Short Description**. Below that sit whatever choices the product requires. For a subscription that is the **Subscription Plan**, defaulting to the product's default plan. The shopper sets a quantity and clicks **Add to Cart**. A quantity above the product's **Max Quantity Per Item** does not fail — it spills across multiple cart lines, each capped at that limit. > [!NOTE] > > Categories shown here are the portal-visible ones only, as a comma-separated list. A product in three categories where only one is portal-visible shows just that one. ## Product Availability Is Consistent A shopper who opens a product's URL directly sees exactly what the grid would have offered. Both surfaces apply the same eligibility test, so an inactive product, a tax product, one set to `Staff`, one without a UUID, and one with no standard price book entry are all unreachable by direct link too — the page reports the product is unavailable rather than showing something the shopper cannot buy. ## Limitations and Common Pitfalls with Store and Product Pages * **Sorting by price uses the displayed price.** A product whose price varies by subscription plan sorts on the price shown on its tile, which may not be the plan the shopper eventually picks. * **Search does not match category names.** A shopper searching for a category name finds nothing unless the words also appear in a product's name or description — use the category pills. * **Only one category filters at a time.** There is no multi-select. * **Max Visible Category Pills caps at 8.** A higher number silently falls back to 8. * **Results Per Page has no upper guard.** A large number puts the whole catalogue on one page and slows the first render. * **The Product page needs its `productId` parameter.** Linked without it, there is no product to show — always link through the Store, or use **Product Page URL** so the parameter is appended for you. * **Prices exclude tax everywhere in the Store.** Tax is calculated at checkout, so the final total can be higher than the cart's. This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.