# Bootstrap tooltips

**URL:** https://forum.bootstrapstudio.io/t/bootstrap-tooltips/10048
**Category:** Bootstrap Studio Help
**Created:** [March 4, 2023, 12:50pm UTC](https://forum.bootstrapstudio.io/t/bootstrap-tooltips/10048 "2023-03-04T12:50:58Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![Prime0147](https://forum.bootstrapstudio.io/user_avatar/forum.bootstrapstudio.io/prime0147/32/4153_2.png) [@Prime0147](https://forum.bootstrapstudio.io/u/Prime0147)
#### Post date: [March 4, 2023, 12:50pm UTC](https://forum.bootstrapstudio.io/t/bootstrap-tooltips/10048/1 "2023-03-04T12:50:59Z")

</div>

Hi I would like to add Bootstrap tooltips, I can’t find the tool in the BBS

---

<div class="post-metadata">

### Author: ![richards](https://forum.bootstrapstudio.io/user_avatar/forum.bootstrapstudio.io/richards/32/3163_2.png) [@richards](https://forum.bootstrapstudio.io/u/richards)
#### Post date: [March 4, 2023, 2:41pm UTC](https://forum.bootstrapstudio.io/t/bootstrap-tooltips/10048/2 "2023-03-04T14:41:38Z")

</div>

Tooltips are not a element, more an add on that can be used on element (link, div, image etc)

To use add a data-bs-toggle of tooltip to the required element and data-bs-title for the wording of the tooltip:

 ![image](https://forum.bootstrapstudio.io/uploads/default/original/2X/8/8be0bd582d702722bc80533e92dfb9b22294106a.png)

You will also need a couple of js lines to activate it:

```auto
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))

```

You can find out more on the boostrap site:

> **[Tooltips](https://getbootstrap.com/docs/5.2/components/tooltips/)**
>
> Documentation and examples for adding custom Bootstrap tooltips with CSS and JavaScript using CSS3 for animations and data-bs-attributes for local title storage.

---

<div class="post-metadata">

### Author: ![kuligaposten](https://forum.bootstrapstudio.io/user_avatar/forum.bootstrapstudio.io/kuligaposten/32/1190_2.png) [@kuligaposten](https://forum.bootstrapstudio.io/u/kuligaposten)
#### Post date: [March 4, 2023, 3:00pm UTC](https://forum.bootstrapstudio.io/t/bootstrap-tooltips/10048/3 "2023-03-04T15:00:27Z")

</div>

The easiest way to add tooltips is in the options panel. like this

 ![tooltip](https://forum.bootstrapstudio.io/uploads/default/original/2X/5/58c1be4cd3055a4432a3c6fdd4db8a52bd627bd4.jpeg)  
no need for you to write javascript

---

<div class="post-metadata">

### Author: ![Prime0147](https://forum.bootstrapstudio.io/user_avatar/forum.bootstrapstudio.io/prime0147/32/4153_2.png) [@Prime0147](https://forum.bootstrapstudio.io/u/Prime0147)
#### Post date: [March 4, 2023, 3:34pm UTC](https://forum.bootstrapstudio.io/t/bootstrap-tooltips/10048/4 "2023-03-04T15:34:11Z")

</div>

Thanks for the tips, helped me on this one…

It was in front of me and I didn’t see it
