How to add tooltips in WordPress posts and pages – Learn WordPress from a to z

Tutorials 0 lượt xem

Tooltips are additional pieces of information that show up when you hover over certain words. It’s a useful way to clarify your content.

In this article, I will show you how to add WordPress tooltips.

Why display Tooltips in WordPress posts and pages?

Tooltips display information in small boxes that pop up when you hover your mouse over an area of ​​the website. They are a great way to add captions to your content.

You can use tooltips to add definitions of difficult words, highlight events. Like footnotes, they can improve a reader’s user experience.

How to Add Tooltips in WordPress Posts and Pages

However, tooltips are never used for the necessary information. Your post should contain everything your readers need even if they don’t read the tooltips, just in case they don’t see them. You should also make sure that you don’t abuse the tooltips, otherwise they can become a distraction for your website visitors.

Let’s see how you can add tooltips to your WordPress posts and pages.

How to Add Tooltips in WordPress Posts and Pages

The first thing you need to do is install and activate the WordPress Tooltips plugin .

Once the plugin is activated, there are several ways to add tooltips to your posts and pages. The first is to automatically add tooltips for certain keywords.

Automatically add Tooltips to keywords

All you have to do is navigate to Tooltips » Add New to create new tooltips. You need to start by adding a title.

This title is a keyword and the tooltips will automatically be displayed everywhere the keyword appears in your posts and pages. This can save you a lot of time, as you don’t need to add tooltips in multiple locations throughout your site.

If you want to display tooltips in more than one word, you can enter them in the synonyms section on the right side of the screen. If you enter multiple synonyms, they must be separated by |.

tooltips illustration

Now, in the body, add your tooltips. A tooltip can be just a few words long, or it can be several pieces of content rich with images and other media. Remember, though, that you’re writing content for tooltips, not a full post, so keep it as concise as possible so it’s easily readable on any screen.

Once done, you should click the “Publish” button on the right side of the screen. Tooltips will now automatically be displayed on your posts and pages wherever tooltips titles and synonyms are found.

refer to keyword tooltips

Add Tooltips using shortcode

Another way to add tooltips is to add shortcodes to your post and page content. This method is suitable for shorter tooltips or when you want to show the tooltips just once instead of on every matching keyword on your site.

To add your shortcode tooltips, you first need to create or edit the post or page you want. Then you should add this shortcode where you want the tooltips to be displayed:

[tooltips keyword="YOURKEYWORD" content="YOURTOOLTIPCONTENT"]<div><span>1</span></div>

Simply replace YOURKEYWORD with the word or phrase you want to add tooltips to and replace YOURTOOLTIPCONTENT with the text you want to add to the tooltips. Make sure to leave the quotes in the shortcode for it to work properly.

shortcode tooltips

You can preview the page to see the tooltips in action. This is how it appears on the demo page.

refer to shortcode tooltips

Build glossaries from your tooltips

Each tooltip is a description of a keyword, like what you would find in a dictionary or glossary. As you continue to add tooltips, you are building a basic glossary.

This is why this plugin allows you to display the tooltips panel on your website. Just add the shortcode [Glossary] to the post or page you want.

glossary tooltips

Once you’ve published your post or page, visit the website to view the glossary.

This is how it appears on the demo page. It includes the tooltips I added to the plugin’s tooltips list, but not the tooltips I created with the shortcode.

refer to glossary tooltips

If you want to customize the glossary, you can go to Tooltip » Glossary Settings menu in the Admin panel. Here you will find several options that you can adjust for how the glossary is displayed and what will be included.

install glossary

Epilogue

Hope you have mastered how to add Tooltips in WordPress posts and pages.

If you find it interesting, you can follow the  WordPress basics section  to know more new knowledge.

Follow fanpage to receive the latest posts:  Group

 

Bài viết liên quan