Adding a new tab to the navigation bar

We have recently refreshed our branding across our offerings and changed the names of our pricing plans. If you have signed up before Aug 9, 2021, please click Previous plans to view your applicable plans.
We assure you that this change will not impact your product experience, and no action is required on your part.

To your customers, your support portal comes with three tabs by default - Home, Solutions and Forums. In addition to removing any of them from view  you can come up with ideas to display more information to the users. One of the simplest ways to do this is to add an additional tab on the navigation bar. 

Setting it up is pretty easy. Before you proceed, please note that this tweak requires you to be on the Estate plan that comes with layout and page-level customization. You can go ahead try this out if you are on the Freshdesk trial. 

1. Login to your support portal as an administrator.
2. Go to the Admin tab, and click on Portals under Support Channels.
3. Click on the Customize portal button on the right corner of the portal you are interested in customizing.
4. Open up the Layout and Pages tab.
5. Make sure you are inside the Portal Layouts section.
6. Replace the code in the Header with the following (remove it completely and copy-paste from below)
   
   <header class="banner">
   

     <div class="banner-wrapper">

       <div class="banner-title">

         {{ portal | logo }}

         <h1 class="ellipsis heading">{{ portal.name }}</h1>

       </div>

       <nav class="banner-nav">

         {{ portal | welcome_navigation }}

       </nav>

     </div>

   </header>

            

   <nav class="page-tabs" >

     {% if portal.tabs.size > 0 %}

       <a data-toggle-dom="#header-tabs" href="#" data-animated="true" class="mobile-icon-nav-menu show-in-mobile"></a>

       <div class="nav-link" id="header-tabs">

         {% for tab in portal.tabs %}

         {% if tab.url %}

           <a href="{{tab.url}}" class="{% if tab.tab_type == portal.current_tab %}{% if  topic.id != forum topic id goes here %}active{% endif %}{% endif %}">

             {{ tab.label }}

           </a>

         {% endif %}

         {% endfor %}

         <a href="forum link goes here" class="{% if  topic.id == forum topic id goes here %}active{% endif %}">name of the tab goes here</a>

   
   

   <!-- more tabs go here -->

    

      </div>

     {% endif %}

   </nav>

   
   
   
   
7. If you want to link the tab to an internal page in your portal, please make necessary changes to the highlighted sections. In this example, you will have to create a forum topic. You can paste the entire link of the topic into the href attribute. 
   
8. Similarly, the topic id is found at the end of the URL, just before the title. Please refer to the following example. 
   https://support.freshdesk.com/solution/categories/71599/folders/142309/articles/83289-adding-a-new-tab
   
9. Instead, if you are linking to an external page, you can remove the following code from the anchor tags:
   {% if  topic.id == forum topic id goes here %}active{% endif %}
   
10. Similarly, you can add multiple tabs by adding more anchor tags to the code where it says <!-- more tabs go here -->.
11. Save changes to your settings and click Preview. If there are any errors, please go through your code once again. 
    
12. If everything looks okay, hit the Save and Publish button to finalize the changes.