Image Tooltip Guide: How to Use “REL” As Image Tooltip Content via WordPress GutenBerg Editor

Image Tooltip using “Alt Attribute” as default content in image tooltip popup,  but sometimes, you may don’t want to show tooltip popup on the site logo, so is there a way to disable the popup on the site logo? Yes, Of course, our image tooltip have a few options to allow you insert image tooltip content in other html tags, for example, use HTML link tag “REL Attribute” by this way:

#1: Please logged in your WordPress admin area, click “Tooltips” menu item.
#2: Enable image tooltips in  “Enable / Disable Tooltips for Image Setting” panel.
#3: In “Tooltips for Image Keyword Matching Mode” panel, select “use rel attribute in image tags as content of tooltips for image” option, and then click “Update Now” button

#4: Now you need add “REL Attribute” in your image links, it is very easy, when you edit posts in wordpress gutenberg editor, if you click your image in the editor, then you will find in the right hand of the gutenberg editor,  there are link settings metabox, you can decide link to anything, for example media file, gutenberg will change link url automatically for you. Then you will find “Link Rel” field in metabox, just enter image tooltip content in link rel, and click update button at the top right on gutenberg editor, then in front end,  you will find when you hover an image,  a tooltip for image popup box will show your rel text as image tooltips content.

#5: That’s all, easy? 🙂

Conclusion:

So, we can  keep the Image tooltip option enabled for images in the body, but disable it for the Logo in the header.

Please note: wordpress Tooltip plugin support a few kinds of image tooltips too, for example, just like this image tooltip guide mentioned, you can use “Alt” attribute or “Rel” attribute or “Title” attribute as content for your image tooltip automatically, for example, you can use an image as image tooltip for another image in your post manually, wordpress tooltip have a few video tutorial to help you use image tooltip more easier:

WordPress Tooltips Video Tutorial 8: Enable/Disable WordPress Tooltips for Images

WordPress Tooltips Video Tutorial 9: WordPress tooltips for image setting

A image tooltip faq post(2017) can be found at Tooltips Tips: How I can put a tooltips with texte on hover an image?

Also you can check image tooltip result at image tooltip demo.

We are adding more image tooltip feature, any feature request is welcome 🙂

WordPress Tooltips Support, updated at March 25, 2019: Image Tooltip Guide: How to Use “REL” As Image Tooltip Content via WordPress GutenBerg Editor

 

 

Tagged with: , , ,

Leave a Reply

Your email address will not be published. Required fields are marked *

*