Search code examples
tooltipzendesk

adding tooltip to zendesk home_page.hbs


I want to add tooltips for some "Categories" box in Zendesk, so when the user hang over one box then I can show a tooltip with more information about the "Category".

Problem is that I'm trying to use IF statement like this:

{{#if href == '/hc/en-us/categories/360001117812-Cow-Traffic' }}

{{#each categories}}
      {{#if ../has_multiple_categories}}
        <li class="blocks-item">
          <a href='{{url}}' class="blocks-item-link">
            {{#if href == 'url_to_compare' }}
            <a class="tooltiptext">tooltip_text</a>
            {{/if}}
            <span class="blocks-item-title">{{name}}</span>
            <span class="blocks-item-description">{{excerpt description}}</span>

As this IF is inside of a {{#if}} of the categories I want to select in this example only one link using the href to see if the mouse is over or not the box.

I already tried to add a helper in the script.js file but looks like it's not working, I remember that there was a way to use this IF and IS to be able to solve it. Thanks!


Solution

  • I get a lot of help on this, at the end I found that the better way to solve this is using a {{#is}} statement, So it's possible to use {{#is name "Category Name"}} {{/is}}

    And this option will do a comparation between the name of the Category and the name you are looking for, if the value it's equal then you can do something inside, if not then you can use an {{else}} between and do another thing over there.

    {{#is name "Category Name"}}
                <div class="tooltip1">{{name}}<span class="tooltiptext">{{excerpt description}}</span></div>
                {{else}}
            <span class="blocks-item-title">{{name}}</span>
                  {{/is}}
    

    I used the "Excerpt description" to add the value of the tooltip inside Zendesk, and no need to add it manually in the home_page.hbs code.

    I added 3 different tooltips and working fine now. Thank you all!