Moving breadcrumbs from navbar to page-head

Dear community members,

I want to move the breadcrumbs from navbar to page-head.

This is what I’ve done:

  • remove from navbar.html (the one in public/js/frappe/ui/toolbar/):
    <ul class="nav navbar-nav hidden-md hidden-lg" id="navbar-breadcrumbs">

  • insert it in the page.html in the targeted location.

  • but it doesn’t show up in the targeted location.

Please see the attached image for the location I meant. It is a sample of Sales Order doc (Rio is the customer name).
Please help and thank you.

ps: I’m not a developer so please explain in rather detail :smiley:

image