Recent searches


No recent searches

Adding tool tips on hover in knowledge base articles

Answered


Posted Oct 10, 2018

Is there a way to add a tool tip when a customer hovers over a particular word, phrase or image in a knowledge base article? 

Something like this...

Thanks!


0

12

12 comments

image avatar

Nicole Saunders

Zendesk Community Manager

Hey Jolshock -

I hear it can be done, but requires some custom coding. You can check out the Zendesk Garden for the elements - I found this for Tooltips.

0


Bumping this thread as I have need of this functionality. Any news? That article for tooltips has been deprecated.

0


image avatar

Nicole Saunders

Zendesk Community Manager

Hi Sean - 

Here's the updated tooltips stuff:  https://garden.zendesk.com/react-components/tooltips/

0


@ Nicole Community Manager. your link

https://garden.zendesk.com/react-components/tooltips/

 

404 PAGE NOT FOUND

Nothing to see here

You won’t find anything growing on this page. Head back to the homepage to see more of Garden.
 

0


image avatar

Nicole Saunders

Zendesk Community Manager

Hi Miriam -

Apologies, some things have moved around. Here's the correct link: https://zendeskgarden.github.io/react-components/tooltips/

0


Sorry but links are not working anymore.

do you have any other to explain this?

Right now my problem is that I can't use IF statement to select which link should have which tooltip.

thanks!

Br

/Carlos

0


Carlos and everyone, 

We had to do this through simple HTML but it's easy enough to do. Here's how:

<span class='tooltip'><span class='tooltip-content'>tooltip_content_here</span>keyword_for_tool_tip</span>

Example: <span class="tooltip"><span class="tooltip-content">Sets the size of the font, in pixels, for the text overlaying the video.</span>48px</span>

0


Hello Sean!

I have tested your code but this makes to appear a tooltip on each box of the Home_page a tooltip, I mean on each category, meanwhile I want to to add only for Category 1 the tooltip1, and 2 with 2...

I did this before with some help but now can't remember how to use the "if" to show only on one box Category.

Thanks!

0


Ah, you're trying to do this within a table, I think? If so your table will have <div> elements and you'll need to nest the tooltip code properly within the table, if that makes sense?

0


Yes Sean! I'm trying to add a tooltip in the Zendesk like this one:

I did in the easy way, because just add it in the html code on the live code webpage.

But the code of Home_page.hbs is like this:

 

So as {{#if}} statement does not allow me to compare two values like:

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

<span class="tooltip">Tooltip_text</span>

 

to make it happen, so I do not know how to compare this two values to point when the user pass over the name or box I want to add the tooltip.

Thanks!

0


Is it possible to add tool tip for  Ticket Fields  ?   if possible please share the coding

 

Thanks,

Anita

0


Sean Huck the code you shared - does it go directly into the guide code or into the style.CSS? I tried to add the example you shared to a guide just to see how it worked and when I preview/publish I don't see anything at all (it just looks like an extra space in the guide) and in the edit version it looks like the picture below. Apologies I don't have any HTML experience so I might just be missing something obvious…. Trapta Singh perhaps you can weigh in here?

0


Please sign in to leave a comment.

Didn't find what you're looking for?

New post