Title: Add tooltips
Last modified: April 27, 2020

---

# Add tooltips

 *  [wrey75](https://wordpress.org/support/users/wrey75/)
 * (@wrey75)
 * [5 years, 11 months ago](https://wordpress.org/support/topic/add-tooltips/)
 * Hi,
    This a simple proposal for your plugin. I added a shortcode to look into
   the database to display the description of an entry in the page using the glossary.
   I think it is a very useful feature. Here the code snippet used.
 * I have integrated as an helper in the code for the next version of my (very) 
   new plugin (Slithy Web) if your plugin is active but it is a hack…
 * Here the code I used to achieve it (the page reference shows the running code
   for “SEO”), feel free to reuse:
 *     ```
           public function tooltip_shortcode($atts, $contents = null, $tag=''){
               extract(shortcode_atts(array(
                           'name' => null,
                           'text' => null,
                           'dir' => null), $atts));
               wp_enqueue_style('slithy_css');
               if( $name ){
                   global $wpdb;
                   // We rely on the "Name Directory" plugin if exists
                   $directory = intval($dir);
                   $query = "SELECT description FROM {$wpdb->prefix}name_directory_name WHERE name = %s";
                   if($directory > 0){
                       $query .= " AND directory = $directory";
                   }
                   $final_query = $wpdb->prepare($query, $name);
                   $definition = $wpdb->get_var($final_query);
                   if($definition){
                       $text = $definition;
                       if(!$contents){
                           // If we have found something and no contents provided, 
                           // use the name as the text.
                           $contents = $name;
                       }
                   }
               }
               return '<span class="tooltip">' . esc_attr($contents)
                           . '<span class="tooltiptext">' . esc_attr($text)
                           . '</span></span>';
   
           }
       ```
   
 * The CSS code has been taken from [https://www.w3schools.com/css/tryit.asp?filename=trycss_tooltip](https://www.w3schools.com/css/tryit.asp?filename=trycss_tooltip)
 * Feel free to contact me for further details and congratulations for your work.
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fadd-tooltips%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 2 replies - 1 through 2 (of 2 total)

 *  Plugin Author [Jeroen Peters](https://wordpress.org/support/users/jeroenpeters1986/)
 * (@jeroenpeters1986)
 * [5 years, 11 months ago](https://wordpress.org/support/topic/add-tooltips/#post-12741868)
 * Hi [@wrey75](https://wordpress.org/support/users/wrey75/),
 * thank you for using my plugin and sharing this code! Also thank you for your 
   compliments. It’s great to see how people use the plugin.
 * So if I understand correctly: you can use the shortcode for a word/name, which
   is being looked up in the database (eventually with a directory id) and (if found)
   the word is being displayed with the description as a tooltip?
    Seems very cool!
 * I also see you can use it for your own (fallback) text in the tooltip.
 * Very nice that you want to share this with me! I will think on how I can integrate
   it (I think it will be “just” an extra shortcode) and write documentation about
   it in the FAQ.
 * Thanks a lot for sharing this!
 * Kind regards,
 * Jeroen Peters
 *  Thread Starter [wrey75](https://wordpress.org/support/users/wrey75/)
 * (@wrey75)
 * [5 years, 11 months ago](https://wordpress.org/support/topic/add-tooltips/#post-12742047)
 * Hi,
 * Exactly. The code I copied is a simplified version because the version I implemented
   can also use tooltips not in the glossary and I have a better fallback if the
   definition is not found. See the code here: [https://github.com/wrey75/slithyweb/blob/master/basic.php](https://github.com/wrey75/slithyweb/blob/master/basic.php)
 * The “contents” text provided can replace the “name” term if you use a plural 
   noon: I use the [tooltip name=”rush”]rushes[/tooltip] of my camera.
 * I was wondering to find a plugin like Name Directory. The only missing feature
   I needed was very easy to implement because your code is simple to understand.
 * Best regards,
    William Rey

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Add tooltips’ is closed to new replies.

 * ![](https://ps.w.org/name-directory/assets/icon-128x128.png?rev=1008185)
 * [Name Directory](https://wordpress.org/plugins/name-directory/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/name-directory/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/name-directory/)
 * [Active Topics](https://wordpress.org/support/plugin/name-directory/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/name-directory/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/name-directory/reviews/)

## Tags

 * [feature](https://wordpress.org/support/topic-tag/feature/)

 * 2 replies
 * 2 participants
 * Last reply from: [wrey75](https://wordpress.org/support/users/wrey75/)
 * Last activity: [5 years, 11 months ago](https://wordpress.org/support/topic/add-tooltips/#post-12742047)
 * Status: not resolved