Updating the breadcrumbs in Help Center to match a custom Community name Follow

I've seen the occasional request where instead of using 'Community' to describe the area where end-users can contribute and discuss information, someone will want to use something like 'Discussion Board' or 'Forums'. In most places of the Help Center, this is easy to switch out by simply typing new name in place of the {{t 'community}} in your Help Center templates, or even by using dynamic content for those on our Professional and Enterprise plans.

There is one spot you might find where this is mostly off limits: if you have a theme using the {{breadcrumbs}} helper. The aim of this article is to help accomplish the replacement of the breadcrumbs by utilizing some HTML and our built in Help Center templating language .

The breadcrumbs are found at the top of many Help Center pages like this:

The first requirement to implement this solution is upgrading to the new Community . If you have not upgraded, you will not have the Community templates available in your Help Center for editing.

Once you have upgraded, you will have these five templates in your Help Center:

  • Community topic list page
  • Community topic page
  • Community post list page
  • Community post page
  • New community post page

In my testing, I used the Wiry Merchant theme. You may have to adjust the code slightly if you try to implement it on other themes. These are meant to be exact replacements for the {{breadcrumbs}} advanced helper. You will find the applicable code for each template page below.

Note: Be sure to create dynamic content items and variants for each of the dynamic content placeholders used below (or feel free to create and replace with your own placeholders). If you decide not to use dynamic content, you will want to replace the {{dc 'community_name'}} and {{dc 'new_post'}} with your own text string such as Discussions or Forums .

Community topic list page

<ol class="breadcrumbs">
    <li>{{#link 'help_center'}}{{help_center.name}}{{/link}}</li>
    <li>{{#link 'community'}}{{dc 'community_name'}}{{/link}}</li>
</ol>

Community topic page

<ol class="breadcrumbs">
    <li>{{#link 'help_center'}}{{help_center.name}}{{/link}}</li>
    <li>{{#link 'community'}}{{dc 'community_name'}}{{/link}}</li>
    <li>{{topic.name}}</li>
</ol>

Community post list page

<ol class="breadcrumbs">
    <li>{{#link 'help_center'}}{{help_center.name}}{{/link}}</li>
    <li>{{#link 'community'}}{{dc 'community_name'}}{{/link}}</li>
</ol>

Community post page

<ol class="breadcrumbs">
    <li>{{#link 'help_center'}}{{help_center.name}}{{/link}}</li>
    <li>{{#link 'community'}}{{dc 'community_name'}}{{/link}}</li>
    <li><a href="{{topic.url}}">{{topic.name}}</a></li>
</ol>

New community post page

<ol class="breadcrumbs">
    <li>{{#link 'help_center'}}{{help_center.name}}{{/link}}</li>
    <li>{{#link 'community'}}{{dc 'community_name'}}{{/link}}</li>
    <li><a href="{{help_center.url}}/community/posts/new">{{t 'new_post'}}</a></li>
</ol>

I hope this quick tip helps you fine tune your Help Center, so you can give your users just the right experience.

Have more questions? Submit a request

Comments

  • 0

    Cool! How about just simply changing the name on the main Help Center page?

  • 0

    Hi Eric!

    The main Help Center title is controlled from the Help Center settings under General Help Center settings. At the bottom of that setting page, you can set the title of your Help Center. There are even multiple options available if your Help Center is available in more than one language.

    Does that help with what you were looking to update?

  • 0

    I want to set the title of my community. Way too hard to do.

  • 0

    Hey Eric!

    Jake mentions this briefly in his article, but I can provide you with some additional detail.

    Provided that you're not on the Starter or Essential plan, you have access to customize the code in your Help Center. This is where you'll go to customize your Community name.

    In your Help Center, go to General > Customize design, and then click Edit theme. This will take you to the theme editor.

    From there, you'll select the Community topic list page from the drop down menu above the code window. The following screenshot will show you where the Community title is:

    Remove the aqua-colored t and the spaces that follow it. Then change community inside the brackets and apostrophes to whatever you want your Community name to be:

    Remember to leave the brackets and apostrophes, or it won't work! Click Preview and you'll see what it'll look like in real life before you save the change.

    Depending on what theme you're using you may see a slight variation in the code and which line the title appears on, but the general idea will be the same.

    We always recommend that you proceed with caution when making any alterations to your Help Center code. Once you start making changes, your Help Center is considered custom and our Support team might not be able to help you if something breaks. When in doubt, ask for help! We have several Help Center gurus here in the Community who can help you out.

  • 0

    Thanks. I did in fact get this working. What about the word Community in the header however?

  • 0

    Hi Eric,

    Which Header? Do you have a screenshot? All of the themes are pretty different, so it would be very helpful to know the context.

    I'd be happy to have a look.

Please sign in to leave a comment.

Powered by Zendesk