Akash Rajput Technology over a cup of coffee

Part 14: Adding a breadcrumb to the catalog page

33 sec read

Featured Video Play Icon

Create Lookup Data broker to get the information about the Catalog item

  • Navigate to Catalog Page
  • Create a Data resource
  • Click + Add
  • Search for keyword lookup
  • From the Data resources section select Look Up Record
  • Click Add
  • In the configuration section, Fill out the fields below
    • Table – Catalog Item
    • Record – @context.props.sysId

Add a breadcrumb component

  • Goto Content Section and select Cat Item component
  • Click Add component before
  • In search, type breadcrumb and select
  • In the configuration section, modify items by selecting </> and add following snippet
 * @param {params} params
 * @param {api} params.api
 * @param {any} params.imports
function evaluateProperty({
}) {
    let _name = api.data.look_up_record_1.result.name.displayValue;
    let _breadcrumb = [{
            "label": "First Item",
            "href": "#",
            "icon": "home-outline",
            "hideLabel": true
            "label": _name,
            "href": "#"
    return _breadcrumb;
  • Click Save

Great!! We have successfully hooked Lookup data broker and breadcrumbs data broker to our page.

Akash Rajput Technology over a cup of coffee

Leave a Reply

Your email address will not be published. Required fields are marked *

Never miss a story from me, get updates directly in your inbox.