Forum Discussion

CarolineS's avatar
7 years ago

How can I make the Private Messages : Inbox breadcrumb clickable?

Hello!

I've noticed that when I'm reading a specific private message, I'm not able to easily navigate back to the full inbox via the breadcrumb - see screenshot. 

 

 

Is there a way I can make the end of the breadcrumb clickable?

 

Thanks, ya'll!

4 Replies

  • CarolineS - Simple create a custom breadcrumb and replace it on private message page only. Where you can make this link clickable. 

     

    Will this solution work for you? Or are you looking OOTB solution ?

  • CarolineS's avatar
    CarolineS
    Boss
    7 years ago

    I'm happy to make a minor customization if needed. How do I create a custom breadcrumb?

  • TariqHussain's avatar
    TariqHussain
    Boss
    7 years ago

    CarolineS - This is just a basic example for PrivateNote page breadcrumb- 

     

    Create a custom component  e.g pvt-msg-breadcrumb

     

    <ul role="list" id="list" class="lia-list-standard-inline custom-bradcrumb">
       <li class="lia-breadcrumb-node crumb">
          <a class="lia-link-navigation crumb-community lia-breadcrumb-community lia-breadcrumb-forum" id="link" href="/">Community</a>
       </li>
       <li aria-hidden="true" class="lia-breadcrumb-seperator crumb-community lia-breadcrumb-community lia-breadcrumb-forum">
          <span class="separator">:</span>
       </li>
       <li class="lia-breadcrumb-node crumb final-crumb">
          <a class="lia-link-navigation crumb-community lia-breadcrumb-community lia-breadcrumb-forum" id="link" href="/t5/notes/privatenotespage">Private Message: Inbox</a>
       </li>
    </ul>

    Add this component to the same place where OOTB breadcrumbs component is added(Might be inside header quilt). 

     

    Using the CSS hide the default breadcrumb and show this one on PrivateNote page. 

     

    The second solution, you can also replace the OOTB private message link using jQuery for that you do not need to create any custom component. 

    e.g 

    Add this script on the page and check if this is working. 

    $(document).ready(function(){
      jQuery(".PrivateNotesPage .final-crumb").html('<a class="lia-link-navigation crumb-community lia-breadcrumb-community lia-breadcrumb-forum" id="link" href="/t5/notes/privatenotespage">Private Message: Inbox</a>');
    })