Store Fronts allow for a branded shopping experience in B2B Marketplace. Use Store Fronts to manage the look-and-feel of your overall store, and set default display options.

Store Fronts can be configured for a branded shopping experience. A single Store Front can be used to display the same look-and-feel for all users, or multiple Store Fronts can be configured to display different layouts to different audiences.

Store Fronts focus on layout (colours, fonts, logos, etc), or “how” the web layout is displayed. This is separate from product collections, or “what” is displayed. Different customers may see the same Store Front layout but be presented with different product collections, or (vice versa), customers may see different Store Fronts but be presented with the same product collections.

Creating/Editing a Store Front

To Create or Edit a Store Front:

  • In SAP Business One, go to: zedSuite Manager > Customer Portal B2B > Manage Store Fronts to open the Store Front Management window.

  • Press the Add button (+) to add a new Store Front, or use the golden arrow to open an existing Store Front.

  • Set the Store Front Name to an admin-friendly name, for example: “Default”.

  • Select a Design Preset. Design Presets define color and font settings for this Store Front. If a Design Preset does not exist, select Add New and configure desired settings.

  • Select a Search Results Collection. A Search Results Collection defines settings for the search results page. If one does not exist, Create a new Search Collection (see Collections Management).

  • Configure each tab as described below.

Product Filters tab

Filters may optionally be applied to a Store Front’s collections using the Product Filters tab. Store Front filters are used to tailor collections to a target audience without having to create distinct collections.

Add a filter (1); Set the filter options (3/4/5); Set whether any or all conditions apply (2).
Add a filter (1); Set the filter options (3/4/5); Set whether any or all conditions apply (2).
  • Add a new filter (+) (see marker 1 above).

  • Configure filter details:

    • Field: The Web Product Field that will be filtered (see marker 3 above).

    • Condition (see marker 4 above).

    • Value (see marker 5 above).

  • Set whether any or all conditions apply for this filter.

  • When a customer is assigned to this Store Front, these filters will be applied to each Collection’s products. Only Collections that have results will be displayed to the customer.

Product Templates tab

Product Templates are used to define how products are displayed on the web. Out-of-the-box versions of these templates are accessible to each Store Front. To create customized versions, copy the default templates and use the copies to create new customizations. Properties can then be set on the Store Front for either the default or customized versions.

To configure template properties, select the template in the left column, and use the golden arrow link to edit that template’s settings on the right.

Select the template (left) and edit its settings (right).
Select the template (left) and edit its settings (right). Shown here: product-details.liquid template properties.
Shown here: products.liquid template properties.
Shown here: search.liquid template properties.

Cart Options tab

Cart Options are used to configure the cart widget that appears when items are added to a user’s order. It may be disabled by selecting “Redirect to Order Pad details”.

Set Cart Preview option (1); Display optional details (2); Set Image preference (3); Display optional details (4).
Set Cart Preview option (1); Display optional details (2); Set Image preference (3); Display optional details (4).

If “Enable Cart Preview Template” is set (see marker 1 above), then the details below will apply:

  • Configure basic display settings (marker 2 above)

  • Configure which image (if any) will appear in the cart preview (marker 3 above).

  • Configure quantity and sub-total display preferences (marker 4 above).

Inventory Available tab

Enable inventory display (1); Configure backorder preferences (2/3/4); Configure Inventory Lookup Query details (5/6).
Enable inventory display (1); Configure backorder preferences (2/3/4); Configure Inventory Lookup Query details (5/6).

Inventory Availability may optionally be configured to allow customers to see an “in stock” or “out of stock” message. Enable or disable this feature, as needed (see marker 1 above).

Configure Default Backorder Settings:

  • Allow Backorders: Yes|No. If “No” is selected, the customer will not be able to purchase out-of-stock products (see marker 2 above).

  • Availability Multiplier: Typically, this is set to “1”. See the description in the add-on to determine if another value is needed (see marker 3 above).

  • Default Warehouse: This sets the default warehouse for inventory quantity calculations (see marker 4 above).

Configure Inventory Lookup Query Settings:

  • Query Category: Out-of-the-box, select “B1WebAPI_CP”. A custom category may optionally be selected.

  • Query: Out-of-the-box, select “InventoryLookup”. A custom query may optionally be selected.

Welcome tab

The Welcome tab is used to configure the customer landing page settings for this Store Front. When a customer logs in, this Store Front’s Welcome screen will be displayed.

Select the desired welcome template. One is included out-of-the-box, however additional templates may be created to provide custom landing pages.

Configure the template’s properties using the golden arrow drill-downs for those properties.

Select the desired welcome template and set its properties using the golden arrow drill-down.
Select the desired welcome template and set its properties using the golden arrow drill-down.

Labels tab

Labels tab is used to configure text strings that are used across the site. This may be used to translate or simply to replace default text for a template.

Select the desired Locale (1); Select the desired template (2); Configure labels using the golden-arrow drill-down.
Select the desired Locale (1); Select the desired template (2); Configure labels using the golden-arrow drill-down.
  • Select the desired Locale (marker 1 above).

  • Select the template whose strings need to be edited (marker 2 above).

  • Set each string using the golden-arrow drill-down.

Setting a Store Front as the default

A default Store Front is what users are presented with when they don’t have a specific Store Front assigned to them. It may be overridden at the Business Partner level.

To set a Store Front as the system default:

  • In SAP Business One, go to: zedSuite Manager > Customer Portal B2B > Setup > Global Config.

  • Select the desired Store Front from the drop-down.

    Set the Store Front default (1).
    Set the Store Front default (1).
  • Press OK to apply the default.

Deleting a Store Front

When a Store Front is no longer needed, it may be removed as follows:

Verify that this is not the default Store Front (1/2); Verify that no customers use this Store Front (3); Select the Store Front to be deleted (4); Delete the Store Front (5).
Verify that this is not the default Store Front (1/2); Verify that no customers use this Store Front (3); Select the Store Front to be deleted (4); Delete the Store Front (5).
  • Ensure that the Store Front is not set as the default (see marker 1 above). If it is the default, assign a different default to B2B Marketplace (see marker 2 above).

  • Ensure that no customers are assigned to this Store Front (see marker 3 above). If one or more customers are assigned to this Store Front, edit each customer to use a different Store Front.

  • Select the Store Front (see marker 4 above).

  • Press the delete button (-) to delete the unused Store Front (see marker 5 above).

  • Press Yes to confirm the Store Front should be deleted.