iThoughts Tooltip Glossary banner

iThoughts Tooltip Glossary

Cet article existe également en Français.
A really nice portegues howto is available at CanalWP

iThoughts Tooltip Glossary is the perfect tool to embed definitions or comments into your posts.

Demonstration

Definition of Glossary, a tooltip, and a mediatip

GitHub repository: https://github.com/iThoughts-Informatique/iThoughts-Tooltip-Glossary

WordPress plugin page: https://wordpress.org/plugins/ithoughts-tooltip-glossary/

What is iThoughts Tooltip Glossary ?

iThoughts Tooltip Glossary is a fork from TCBarrett’s WP Glossary, which is inactive for more than one year now. I tried to send my changes to him, but, unfortunately, nothing happened there. But, because the plugin was licensed with GPLv2, I was allowed to use that work as part of mine, and I created a new plugin from the TCBarrett’s one. The biggest part of this plugin is exactly the same as the original WP Glossary, but I added some improvements

What’s new in iThoughts Tooltip Glossary ?

iThoughts Tooltip Glossary introduce some breaking changes to improve user experience:

  • Tooltips have now “Responsive” activation mode, which is “touch/focus” on touch devices (like smartphones), and “hover/focus” on pointer devices (like computers)
  • Tooltips bounding box was corrected to reduce risks of bugs on small screens.
  • Base URL of glossary terms can now be changed for better SEO
  • TinyMCE plugin added, with 2 new buttons, making create tooltips as easy as pie. You don’t even have to remember shortcode & options anymore.
  • Many tooltips mode, such as “Glossary”, “Tooltip”, and “Mediatip”.

HowTo

Install

Install this plugin from the admin panel if you can, or do as follow:

  1. Upload the archive of the plugin downloaded from the plugin page to the “/wp-content/plugins/” directory
  2. Unzip the archive
  3. Activate the plugin through the ‘Plugins’ menu in WordPress

Create a term

Go to your admin panel, and look for “Glossary Terms” => “Add new term”. A form will appear, allowing you to create your glossary term.

Create new plugin elements

3 new buttons have been added to your TinyMCE editor:

  •  : Create tooltips with this button. From the form opened, you can open the advanced settings form (using the button at the bottom left of the create tooltip form) to customize your tooltip behavior
  • : Remove the tooltip currently under the cursor (if any)
  • : Create a glossary list/index

Create a glossary tooltip

Go into the “Glossary” panel into the iThoughts Tooltip Glossary form, fill the text that will be displayed into the link, and search for the desired glossary term. Once you have clicked on the term, just press ok.

Create an inline tooltip

Go into the “Tooltip” panel into the TinyMCE form (this panel is the default), and use the embed TinyMCE Editor into the form to create the content of your tooltip.

Create a mediatip

There are several types of mediatip:

Local image

Just select the image from your site’s media storage, and choose the type of link you want

Image from Internet

This mode will embed the image with the link you specify into a tooltip designed for that use.

Web video

Use a YouTube or dailymotion shortcode/embed code/video link, or an url to a .mp4 file, and the mediatip will display it into a tooltip. A “Pin” button will allow your visitor to keep the mediatip always visible, to prevent it from hiding during they watch the video.

Avoid the use of Ajax

In the plugin options, a new option is available: Static terms . This option allow you to directly insert the term’s content into your glossary link, and avoid the later usage of Ajax. However, this can slow down your page generation.

Customize elements (until v2.6.0)

Customize elements (froù v2.6.0)

Add your own animations

From the version 2.6.0, you can add your own tooltip animations using filters  ithoughts-tt-gl_tooltip-anim-in  &  ithoughts-tt-gl_tooltip-anim-out. The 2 examples bellow are already available in the plugin.

Maybe you prefer to add your animations in a JavaScript file for performance reasons. It this case, extend the object ithoughts_tt_gl as following:

Don’t forget to add ithoughts_tooltip_glossary-qtip as a dependency of your script when registering it!

Customize tooltip links

If you want to customize all tooltip links, here are the required selectors:

It is recommended to do those modifications into your child theme, to not be reset if you do an update.

Known issues

My shortcode content isn’t displayed into the post excerpt

This issue is due to the removing of shortcodes into excerpts by WordPress core. Please follow this post instructions

I have a bug, what should I do ?

First, it is totally inappropriate to post your problem here. First, read the readme file once more, and documentation if available. Only after that, if the problem persists, go to the dedicated plugin support page, check for another post with the same bug than yours to complete his topic, or create a new one.

Interactions with other plugins

Relation Versions Usage
Advanced Code Editor

Tooltip Glossary
1.1.0

2.4.1
Use an ACE editor in the custom CSS fields of the iThoughts Tooltip Glossary theme editor
Lightbox

Tooltip Glossary
0.1.0

2.1.7
Uses iThoughts Tooltip Glossary mediatips as image that can be included into lightboxes

Oh dude, you’re amazing! Can I do something for you?

Yes, of course you can.