How to use wordpress tooltip shortcode [tooltips] to add tooltips manually?

It is very easy to add wordpress image / video / audio tooltips, form element tooltip… in wordpress automatically or manually via a few clicks, just in one minute. Please check our wordpress tooltip video tutorials at below or Try WordPress Tooltip Demo:

Since wordpress tooltip 4.2.8(current version is 20.9.8, at 2023-05-18), based on user requested, we added a new wordpress tooltip shortcode [tooltips].

In general, you do not need a tooltip shortcode, because wordpress tooltips plugin will add tooltips effect for post’s content/title/tag/excerpt/gallery/menu automatically, based on wordpress standard APIs. By this way, wordpress tooltip plugin will save your time to manage tooltips, for example, when you want to change tooltips content, you will not need to read all posts to find which page has a specified tooltip and change it one by one manually, what you need to do is just editing your tooltips in wordpress standard WYSWYG editor, then tooltip content in all posts will be updated automatically.

Some amazing users told us they want to use tooltip shortcode to add tooltips in wordpress posts, with a lot of reasons, for example: homonym tooltip(homonym tooltip means same word but different meanings); for example, use tooltip shortcode in Divi page builder, elementor page builder, VC page builder… and so on, we are happy to report you that we have built a powerful wordpress tooltip shortcode [tooltips] to help you add pretty tooltip in anywhere 🙂

The wordpress tooltip shortcode [tooltips] is very easy to use:

[tooltips keyword="wordpress tooltips" content="Wordress Tooltips is a rich featured wordpress tooltip plugin. "]

It looks like this: wordpress tooltips

Also you can add image tooltip in wordpress tooltip popup box, for example:

[tooltips keyword="lovely girls" content="<img src='https://mydomain.com/wp-content/uploads/2017/02/screenshot.png'>"]

It looks like this: lovely girls

Our WordPress tooltip short codes support many more amazing features, for example, add video tooltip on an image, use another image as image tooltip for images… and so on:

WordPress Tooltip Pro support to add multimedia tooltips to an image, you can insert many different multimedia format elements in the tooltip, which is anything you can hear and see, including text, images, sound, music, film, animation, video, audio recorders, etc.

Let’s try it, when you hover over the image, a wordpress multimedia tooltip appear with a description of the image, you can see a combination of different multimedia content forms, text, link, image, audio and video in the tootlip.


How to use wordpress tooltip shortcode

We add the wordpress multimedia tooltip to an image using tooltip shortcode [tooltips].

[tooltips keyword = "<img src='Source of image' />" content = "Alternative Multimedia content will be displayed as a tooltip"]

NOTE:

1. Input the wordpress tootlip shortcode in the wordpress text editor. This editing mode makes you write your wordpress multimedia tooltip content of HTML.

2. Select the option “Enable Advance Tooltips Shortcode” in “Tooltip Settings for this page, or wordpress tooltip shortcode will not work.

Usage example

Usage example 1

Input the wordpress tootlip shortcode in the wordpress text editor.

[tooltips keyword = "<img src='https://tooltips.org/wp-content/uploads/2018/08/girl.png' />" content = "<video controls='controls'><source src='https://tooltips.org/wp-content/uploads/2023/05/003.mp4' type='video/mp4'>Your browser does not support the HTML5 Video element.</video><h3>Multimedia Tooltip</h3>"]

  • Tooltips keyword is the anchor image similar to a hyperlink.
  • Img src specifies the URL of your image.
  • The Content text entered will be shown on the popup tooltip box.
  • WordPress Tooltip Shortcode Demo 1: Add Video Tooltip on Image

    The example present video and text in a wordpress multimedia tooltip.

    Usage example 2

    Input the wordpress tootlip shortcode in the wordpress texts editor.

    [tooltips keyword = "<img src='https://tooltips.org/wp-content/uploads/2018/08/fruit.png' />" content = "<audio controls = 'controls'><source src='https://tooltips.org/wp-content/uploads/2018/08/001.mp3' type='audio/mpeg'>Your browser does not support the audio element.</audio><h3>Multimedia Tooltip"]
    

  • Tooltips keyword is the anchor image similar to a hyperlink.
  • Img src specifies the URL of your image.
  • The Content text entered will be shown on the popup tooltip box.
  • WordPress Tooltip Shortcode Demo 2: Add Audio Tooltip on Image

    The example presents audio music and text in a wordpress multimedia tooltip.

    Usage example 3

    Input the wordpress tootlip shortcode in the wordpress text editor.

    [tooltips keyword = "<img src='https://localhost/wp-content/uploads/2017/02/girl2.gif' />" content = "<img src='https://localhost/wp-content/uploads/2017/02/girl2.gif' /><h3>Multimedia Tooltip</h3><div><a style='text-decoration: underline;' href='https://tooltips.org/'>tooltips Pro </a> support any multimedia content. Hover the trigger, you'll see a tooltip that contains text, image, audio, vedio and much more.</div>"]
    

  • Tooltips keyword is the anchor image similar to a hyperlink.
  • Img src specifies the URL of your image.
  • The Content text entered will be shown on the popup tooltip box.
  • WordPress Tooltip Shortcode Demo 3: Add Image Tooltip On Another Image

    The example present image, text and link in a wordpress multimedia tooltip.

    [tooltips] shortcode is a powerful tool, [tooltips] support Self-Closing Shortcode and Enclosing Shortcode, with Enclosing Shortcode, you can use [tooltips] shortcode to add icon tooltip

    How to use WordPress Tooltip Shortcode to Create Icon Tooltip?

    It is very easy to create icon tooltip from wordpress tooltip plugin, Please mouse hover this icon tooltip -> 🙂

    Please check codes:

    [tooltips keyword=’good’ content = ‘you are very welcome!’]:)[/tooltips]

    or

    [tooltips content = ‘you are very welcome!’]:)[/tooltips]

    Both of them will works well, please use your icon replace the “:)”

    Also we offer another method to add icon tooltip more easier, you do not need add your content, you can just use conent from existed tooltip terms, it works like this:

    Please check codes:

    [icon_tooltip_by_id tooltip_id=’308’]your icon here[/icon_tooltip_by_id]

    You can find more icon tooltip demos at:

    [tooltips] shortcode icon tooltip demo

    [icon_tooltip_by_id] shortcode icon tooltip demo

    How to Reference the Content from an Already Existing Tooltips Term in Tooltip Short Code?

    1: Click “Tooltips” menu item, in “All Tooltips” Panel, search the existed tooltip term which you want to reference.

    2: Click Editor button of the tooltip term, it looks like this:

    edit button of tooltip term

    edit button of tooltip term

    3: Then you will open “Edit Tooltip” panel.

    4: In “Edit Tooltip” panel, you will find the tooltip id in browser URL bar, it looks like this:

    find tooltip term which you want to reference

    find tooltip term which you want to reference

    You will find the in the browser URL bar, the URL is: tooltips.org/wp-admin/post.php?post=3107&action=edit&classic-editor, and the tooltip id is 3107.

    5: Now you can insert this tooltip id in your tooltip_by_id shortcode [tooltip_by_id tooltip_id='3107'] in any wordpress page or post

    6: The result looks like this:

    Tooltip For Forms Demo - Message Field
    In the current time, wordpress shortcode mechanism have many flaws yet, by this way, you can easily push the limits of the wordpress shortcode. You can achieve many complex effects in wordpress tooltips standard WYSWYG editor, and then use tooltip_by_id shortcode to reference the content of the tooltip term into any wordpress post or page. 🙂

    About WordPress SVG Icons Tooltips:

    SVG stands for Scalable Vector Graphics, SVG is an XML-based vector graphics format used to display a variety of graphics on the Web and in other environments, SVG is becoming more and more popular, most major browsers already support SVG, but wordpress do not support SVG yet, our wordpress tooltip plugin have an addon, in which we can support WordPress SVG Images Tooltip, you can find detailed step by step wordpress SVG Tooltip document at How to Build a SVG Tooltip?

    Some amazing users told us they want to use our wordpress tooltip in other plugins generated content too, for example add tooltip in tables which generated by table plugins, add tooltip in form plugins, add tooltip in price tables, add tooltip in Divi page builder… and so on, now you can insert wordpress tooltips to pages which is generated by those 3rd plugins very easy, for example, in tablepress plugin, you can add wordpress tooltip shortcode in table title, table cell… and so on, when users mouse hovers the table cell, they can see video, image, audio, text, html links, google map, QR code related with this table cell in tooltip popup box.

    you can find more wordpress shortcode guide at Lists of How to Use WordPress Tooltip Shortcode.

    We are working hard to let WordPress tooltip plugin support more and more famous plugins, for example woocommerce, tablepress, MaxButtons, Easy Pricing Tables… and so on, if you have any feature request for wordpress tooltip plugin, please don’t to hesitate to tell us, we are happy to integrate our wordpress tooltip plugin with famous plugins.

    We are happy to add more amazing wordpress tooltip function for our wordpress tooltips shortcode, any feature request is very welcome. 🙂

    WordPress Tooltip features can be found at features of WordPress Tooltips Plugin . Please check WordPress Tooltip Demos of video tooltip, image tooltip, audio tooltip, tooltip for button, tooltip for title, tooltip for tag, woocommerce tooltip, table tooltip, pricing table tooltip, … Try Demo

    Thanks, have a happy day with your family. 🙂

    WordPress Tooltips Plugin demos:

    Add tooltips in Table Cell

    Add tooltips in Pricing Table

    WordPress Image Tooltips Demo

    WordPress Audio Tooltips Demo

    Add tooltips in wordpress post title

    Add tooltips for your WooCommerce Product

    Add tooltips on Button

    Add wordpress tooltips in wordpress post tag

    Show Tooltips In F.A.Q

    Add wordpress tooltips on tag

    Add wordpress tooltips on title demo

    use Video as wordpress tooltips demo

    Demo of add tooltips manually so you can add many different tooltips content for the same tooltips term

    Have fun!
    Wordpress tooltips plugin team

    Tagged with: , , , , , , , , , , ,

    WordPress Tooltips Pro 4.2.8 Released

    Hi Dears,

    We are happy to report you that we released a new wordpress tooltips pro version — wordpress tooltips pro 4.2.8, in the version we added a few new features based on users request:

    1: We Added new shortcode [tooltips] for our wordpress tooltips plugin, You can add any tooltips which is not in content of post, or not in wordpress database.
    It is very easy to using:
    [tooltips keyword="wordpress" content="Wordpress is great system"]

    Also you can add image in “content”, for example:
    [tooltips keyword="Sample" content="<img src='https://mydomain.com/wp-content/uploads/2017/02/screenshot.png'>"]

    A demo page can be found at here: demo of shortcode [tooltips]

    By this way, you can use this plugin to insert tooltips to plugin generated page, for example, in a table plugin — tablepress, when you insert element to a cell, you can add our tooltip shortcode in it and you can show tooltips in this table… and so on. Please note, because there are too many plugins — nearly 50,000 plugins, they realized in different methods, so we have no way to support “any” plugins or themes, but we are try to support more and more famous plugins, for example woocommerce, tablepress, MaxButtons, Easy Pricing Tables… and so on.

    Also for avoid users typed error tooltip parameter which will caused tooltips not work, when you entered error usage in the wordpress tooltips shortcode [tooltips], instead of not working, we will show you the correct usage in tooltip popup box which will tell you how to use the shortcode [tooltips].

    We are adding new functionality for the shortcode [tooltips], any request is welcome. 🙂

    2: New feature: Only Add Tooltips For Specified Post Types, for example, you can setting to add tooltips only for post, page, and do not show tooltips for woocommerce product post type, and so on.

    3: Now we can disable tooltips for specified pages, when you add / edit posts / pages / products, in the top right of the wordpress standard editor, you will find
    a meta box: “Disable tooltips for the page”, if you checked the “Disable tooltips for the page” check box, in this post, we will not add tooltips content from tooltips database automatically, even there are tooltips keyword in the post content.
    By this way, you can choose show tooltips automatically in some pages and disable tooltips in other pages.
    However, if you want to add tooltips manually in this page, we keeped this option for you, you can still use shortcode [tooltips] to add your customized tooltip in this page manually.

    4: Improved Internationalization

    5: Tweaked style of admin control panel, it looks more modern and stylish.

    We are adding new features based on user requesting now and you will see it soon, any feature request is welcome. 🙂

    Best Regards,
    Tomas

    Tagged with: , , , , , , , ,

    WordPress Tooltips Pro 3.9.2 Released, New Feature Tooltips Stats Is Online Now

    Dear Tooltip Users,

    We finished a new wordpress tooltips plugin, in the new version 3.9.2, we added tooltips stats functionality, in backend, you can see how many hits for each tooltip, you will know which tooltip on your site is most popular on user side, it looks like this:

    Wordpress Tooltips Pro Stats functions

    WordPress Tooltips Pro Stats functions

    Also we add categories support for a Tooltips in back end, you can manage your tooltips more easier via categories, it looks like this:

    wordpress tooltips category

    wordpress tooltips category

    And we upgrade for repalce deprecated functions register_sidebar_widget() and register_widget_control() with wp_register_sidebar_widget() and wp_register_widget_control()

    Also we have fixed a bug on tooltips widget.

    We are adding more amazing features for example, more element control in tooltips style panel so you can make tooltips more easier, or you can see users hit logs that he was watching which tooltips, or you can see each tooltips’ hit history chart…. and…, and so on.

    Dear friends, any tooltips feature request is welcome, enjoy. 🙂

    Best Regards,
    Tomas

    Tagged with: , , ,

    Tooltips For Button

    Hi Dear WordPress Tootip Plugin Users,

    WordPress tooltips plugin support add tooltip effects to buttons on wordpress site, for example, in the right hand of this page, you will find the search form in the widget, please mouse hover the button “Go”, you will find the button tooltip popup box, you can add video / audio / image / text / links to tell users how to use the search form. WordPress tooltip plugin by tooltips.org can add tooltip effect to nearly all buttons on your site, and it is very easy to do. 🙂

    How to Add Tooltip Effect on WordPress Buttons

    It is very easy to add button tooltips on your wordpress site:

    #1 Login wordpress admin area

    #2 Click “Tooltips” menu item

    #3 Click “Add New” sub menu item

    #4 In the wordpress tooltip editor, you can add your tooltip title and content in here, also the right of tooltip editor, you will find “Tooltips For Forms” meta box, just enter your button class or id in this metabox, and publish the tooltip, also the title is “tooltips for forms”, but actually this can be used on all elements on your site, for example, form tooltips, element tooltips, button tooltips, table tooltips….and so on, it looks like this:

    #5 How to find class or id of your button? If you use firefox, in front end, you can enter F12, then you will find “Inspector” tab, before “Inspector” tab, there are arrow button, click arrow button and move your mouse in your front end page, move on your button and click it, you will find some codes like <button id=’homepagebuttonname’>… and so on,it looks like this:

    firefox f12 to find button id or class

    firefox f12 to find button id or class

    Just copy id name of the button,  for example in my screenshot, you can see firefox have highlight the search button, the id of search button is “searchsbumit”, so please enter the button id in “Tooltips For Forms” meta box like this: “#searchsbumit”, then in front end, your button will have tooltip effect, just like what I do in my current demo page, if you still not know how to use firefox, search google, firefox F12, inspector, then you will get a lot of guides.

    Also wordpress tooltip plugin by tooltips.org support a few 3rd button plugins, the demo at below will show how wordpress tooltips plugin can add a tooltip on the button generated by MaxButtons plugin, When you hover the button text, you will find a tooltips box popup, and we still keep the function of the button, please try to click the button, you can still go to the linked URLs in the button.

    Button of Product Tooltips

    The shortcode we are using is [maxbutton id="1"]

    Conclusion

    With WordPress Tooltip Plugin by tooltips.org, tooltip users can add tooltip on nearly any buttons on their WordPress site, you can add video / audio / image / text / links / google map / QR Code …. nearly any thing in wordpress button tooltip, with many animation effects, also you can custom color, border, width… nearly all things of tooltip box, to make different tooltip effect for each button, to build a lively, good user experience wordpress site for your users.

    WordPress tooltip plugin by tooltips.org support button tooltip, image tooltip, video tooltip(video demo), Audio Tooltip(audio demo), WooCommerce Tooltips, Pricing Table Tooltip, table tooltip… and buddypress tooltip, bbpress tooltip, ACF tooltip…, please check features of wordpress tooltip for more features, or click to try demo

    We are happy to add more pretty functions for the wordpress tooltips plugin, any feature request or question is welcome. 🙂

    Thanks, have a happy day with your family. 🙂

    Best Regards,

    WordPress Tooltip Plugin Support Team

    Tagged with: , , ,
    Top