Magento 2 Add Tooltips

With Magento 2 adding tool tips is much easier vs Magento 1.
In Magento we used to have to load a jquery tool tip plugin’s css and js files, then add some script near the tool tip location.
That’s a lot of work for such a simple feature.

With Magento 2 it’s built into the new UI.
The first step in implementing tool tips is coding the tool tip spans where ever you wan them to appear.
The second step in implementing tool tips is adding a css style rule in you’re theme’s custom.less stylesheet.
Here is what the finished tool tip will look like when implemented-

See download below for code example of working tool tip.

Click To View Tooltip Code

Good Luck!

This entry was posted in Magento, Magento 2. Bookmark the permalink.