Configure content items to appear on the storefront

When configuring content items for your storefront, you must utilize the Design page layouts. The content items are listed on the storefront. Each of the individual items on that list can be selected and the item details viewed.

To configure content items to display on the storefront:

1. Open the Design page and choose any layout to clone. For further information, refer to Create a new layout instance (cloning).
2. Configure the Settings for the newly cloned layout, and click Save.
3. Open grid view and drag the Content Listing widget to the layout. For further information, refer to Customize your store layouts.
4. Open the Content Listing widget’s Settings and select the content type from the dropdown list. Note that you can only associate one content type with a Content Listing widget, and as such, you must repeat this step for each content type you wish to display on your storefront. For example, the content type ‘blog’ should be created separately from the content type ‘recipes’.
5. Click Save.
   You must now edit the widget’s code in order to ensure that the content item fields match those on your own content management system, and to tailor the look of the list as required.
6. Open the About tab and click Go to widget code, which enables you to go directly to the widget’s template. From here you can update the code references for the content item fields. Note: You must ensure the content identifier is up to date so it matches your own fields.
7. Click Save.
8. Publish the changes in order to see the content pages, containing a link to the content details, displayed on the storefront.
   The content details use a Content Item layout to render this information. The page URL of the content item corresponds to the mapped content table. If, at any point, you make updates to the content and then re-publish, this is automatically sent to Commerce.

   All content items are by default, rendered on the storefront using the Content Item layout. However, you can create another version of that layout for a selected content type by cloning the Content Item layout and associating one or more content types to that layout within the layout settings. As per Step 6 above, you can configure the Content Item layout code to ensure the content item is displayed on the storefront.