ssossossosso
Documentation Home »User Guide »Web Catalogs »Edit Web Catalog Content Tree
current version

Edit Web Catalog Content Tree

To edit a web catalog content tree:

  1. Navigate to Marketing > Web Catalogs in the main menu.
  2. Click on the web catalog to open its details.
  1. Click the Edit Content Tree on the top right of the page.

  2. Create the root node of the web catalog as described in the Set Up a Root Content Node section. It is recommended to use Oro Frontend Root system page as a root node of your web catalog.

  3. Click Save on the top right of the page.

    Once the web catalog root node is saved, create the nested nodes on the second level that will be shown as main menu items on the OroCommerce Store Front:

    1. Ensure that the root node is selected in the content nodes structure to the left.

    2. Click Create Content Node on the top right of the page.

      The following page opens:

    3. Set up the node as described in the Set Up a Content Node for Menu or Sub-Menu Item section.

    4. Click Save on the top right of the page.

      Set up as many sub-menu nodes as you need.

      To enable sub-menu and populate it with links to the content variants:

      1. Select a second level node in the Content Nodes tree to the left.
      2. Click Create Content Node on the top right of the page and follow the process described in the Set Up a Content Node for Menu or Sub-Menu Item section.

      Set up as many sub-menu nodes as you need.

Set Up a Root Content Node

To map an entry point for the web catalog content tree:

  1. In the General section, fill in root content node title that serves as a container for the nodes added later in the Content Variants section.

    If necessary, translate the title into the languages supported in your OroCommerce configuration. To manage title translations, click next to the Titles box and follow the guidance here).

  2. Set Rewrite Variant Title to force override the native title of the content you are mapping to this catalog node.

  3. In the SEO section, fill in the meta description and meta keywords to help search engines show your web content to the relevant audience. similar to the title, you can translate the meta information.

  4. In the Restriction section, define the visibility of the web catalog.

    By default, the web catalog is displayed for any localization, on any website, and for any customer.

    To make OroCommerce apply a web catalog to the Store Front only for the particular combination of these facts, create a restriction by selecting all or some of the following: target localization, website, and customer or customer group.

  5. In the Content Variants section, model the desired Store Front menu structure:

    1. Select a type of content node from the list on the right.

    2. Configure the content node as described in the Content Variants Configuration for the Content Node section below.

    Note

    The first content variant that is added to the node is marked as default variant. When you add more content variants, please, specify the restrictions next to the content variant details, that limits the use of this content variant to just some particular cases.

Set Up a Content Node for Menu or Sub-Menu Item

To set up the mapping of the content to the web catalog content tree:

  1. In the General section, fill in content node title that will show as a caption in your OroCommerce Store Front menu or submenu (depending on the level in the content tree.

    If necessary, translate the title into the languages supported in your OroCommerce configuration. To manage title translations, click next to the Titles box and follow the content translation guidance here).

  2. Set Rewrite Variant Title to force override the native title of the content you are mapping to this catalog node.

  3. Click on the Slug Prototypes box. The default slug prototype will be autogenerated. Edit the value to customize the default.

    To ensure that slug prototype translation is localization-friendly, manage slug prototype translations: click next to the Slug Prototypes box and follow the guidance on content translation).

  4. In the SEO section, fill in the meta description and meta keywords to help search engines show your web content to the relevant audience. similar to the title, you can translate the meta information.

  5. In the Restriction section, define the visibility of the web catalog.

    By default, the web catalog node inherits the settings from the root node or its parent node. However, you can adjust it to be displayed for particular localization, on a specific website, and/or for the selected customer(s).

    To modify the inherited default settings, clear the Inherit Parent box, and specify the restrictions by selecting all or some of the following: target localization, website, and customer or customer group.

  6. In the Content Variants section, add the default content item that shows on OroCommerce store frontend when no restriction conditions are met:

    1. Select a type of content note from the list on the right.

    2. Configure the content node as described in the Content Variants Configuration for the Content Node section below.

  7. If necessary, create alternative content variants by selecting a content type from the list on the top right of the Content Variants section and providing the set of conditions (localization, website, customer or customer group) to restrict this variant just for those cases. To switch the default content variant to a different item, select it using an option to the left of the content variant name.

  8. Click Save once you have configured the content node.

Content Variants Configuration for the Content Node

This section provides an overview of the content node types and a brief guidance on their set up.

Note

The first content variant that is added to the node is marked as default variant. When you add more content variants, please, specify the restrictions next to the content variant details, that limits the use of this content variant to just some particular cases.

System Page

System page is one of the standard pre-designed pages of OroCommerce Store Front (e.g. Requests for Quotes, Open Orders).

To add a system page to the menu on the OroCommerce Store Front:

  1. Select the Add System Page in the Content Variants list.

    The following section shows:

  2. Select the system page from the list.

  3. Click Save when you are done filling in the web catalog content node or keep adding the content variants.

Product Page

Product page node is a direct link to the product details in OroCommerce Store Front.

To add a product page node to the menu on the OroCommerce Store Front:

  1. Select the Add Product Page in the Content Variants list.

    The following section shows:

  2. Select the product from the list. To use search, start typing the product name or SKU in the box. To use filtering, click on the bars, and select the filtering conditions in the Manage filters section.

  3. Click Save when you are done filling in the web catalog content node or keep adding the content variants.

Category

Category node is a direct link to the product category with the list of products in OroCommerce Store Front.

To add a category node to the menu on the OroCommerce Store Front:

  1. Select the Add Category in the Content Variants list.

    The following section shows:

  2. Select the category from the product catalog tree. To use search, start typing the category name in the box. Use > and v to expand/collapse the tree node.

  3. Click Save when you are done filling in the web catalog content node or keep adding the content variants.

Landing Page

Landing Page node is a link to the custom content page created in the Marketing > Landing Pages section.

To add a landing page node to the menu on the OroCommerce Store Front:

  1. Select the Add Landing Page in the Content Variants list.

    The following section shows:

  2. Select the existing landing page from the list. To use search, start typing the product name or SKU in the box. To use filtering, click on the bars, and select the filtering conditions in the Manage filters section. Alternatively, you can create a new landing page:

    1. Click + to the right from the Landing page list.

      The Create Landing Page pops up.

    2. Fill in the landing page details and contents as described here.

  3. Click Save when you are done filling in the web catalog content node or keep adding the content variants.

Product Collection

Product Collection is a filter-based segment that helps you display a custom and dynamic set of products in the web catalog similarly to the category contents.

To add a product collection node to the menu on the OroCommerce Store Front:

  1. Select the Add Product Collection in the Content Variants list.

    The following section shows:

  2. Set up a filter to limit the products list and include only the necessary products.

    Note

    Click Reset to clear the filter configuration.

    Click Apply Query to preview the filtered product collection.

    Warning

    If you save the web catalog node with the product collection without applying changed filters, you will be prompted to confirm the changes. It is recommended to preview and double-check the changes to ensure the results meet your expectations.

  3. Click Save when you are done filling in the web catalog content node or keep adding the content variants.