Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • September 16, 2024 at 5:40 pm #1467122
    paulw185

    I’ve tried many suggestions on this forum to disable the tooltip with the image title, when hovering over an image. A.o. in these topics:

    https://kriesi.at/support/topic/hide-titles-and-descriptions-when-you-hover-on-images-or-thumbnails-of-galleries/
    https://kriesi.at/support/topic/remove-tooltip-display-of-image-captions/

    But I can’t make it work, or I’m doing it wrong. Need some help. Btw I don’t use a child theme.
    My website: https://wta.nl/
    Portfolio page (with more images): https://wta.nl/portfolio/

    • This topic was modified 1 week, 4 days ago by paulw185.
    • This topic was modified 1 week, 4 days ago by paulw185.
    September 16, 2024 at 6:06 pm #1467128
    Mike

    Hey paulw185,
    If you are not using a child theme you could use the WP Code plugin then add a new snippet, in the top right corner use the PHP snippet as the code type:
    use wpcode php snippet and activate
    and ensure that it is activated, then add the code and save.

    Best regards,
    Mike

    September 16, 2024 at 7:30 pm #1467138
    paulw185

    Thanks Mike. But do I really need a plugin to implement the code, or can I just paste the code in Enfold’s functions.php through the WordPress editor?

    Also: could you please post the correct code here? Because I’ve seen several versions of this code.

    September 16, 2024 at 11:21 pm #1467149
    paulw185

    I have installed a child theme after all, because it was super easy to do, and imported the parent settings. Everything works great. But… the php code still doesn’t work in functions.php in the child theme.

    I first tried the code from the Enfold documentation page:

    function remove_title_attr(){
?>
 <script>
jQuery(window).on('load', function(){
jQuery('#wrap_all a').removeAttr('title');
jQuery('#wrap_all img').removeAttr('title');
});
 </script>
<?php
}
add_action('wp_footer', 'remove_title_attr');

    That had no effect. Then I tried the modified code found on this forum page: https://kriesi.at/support/topic/hide-titles-and-descriptions-when-you-hover-on-images-or-thumbnails-of-galleries/#post-981936 

    function remove_title_attr(){
?>
<script>
jQuery(window).load(function(){
  jQuery('#wrap_all img.avia_image, #wrap_all .avia-gallery-thumb img, #wrap_all .avia-gallery-thumb a').removeAttr('title');
});
</script>
<?php
}
add_action('wp_footer', 'remove_title_attr');

    That didn’t work either. The tooltip still shows up when hovering an image. Hope you can help.

    • This reply was modified 1 week, 4 days ago by paulw185.
    • This reply was modified 1 week, 4 days ago by paulw185.
    September 17, 2024 at 5:53 pm #1467222
    Mike

    Hi,
    I see that you are getting the error: Uncaught ReferenceError: jQuery is not defined
    Please try this snippet instead:

    function temporary_removal_title_tags(){
?>
<script>
  window.onload = function() {
      var links = document.querySelectorAll('a , img');
      for (var i = 0; i < links.length; i++) {
          var link = links[i];
          link.onmouseover = function() {
              this.setAttribute("org_title", this.title);
              this.title = "";
          };
          link.onmouseout = function() {
              this.title = this.getAttribute("org_title");
          };
          link.onclick = function() {
              this.title = this.getAttribute("org_title");
          };
      }
  };
</script>
<?php
}
add_action('wp_footer', 'temporary_removal_title_tags');

    Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
    Thanks to Guenni007
    If this doesn’t help please include a admin login in the Private Content area so we can examine

    Best regards,
    Mike

    September 17, 2024 at 6:28 pm #1467224
    paulw185

    Hey Mike. Thanks again. The code works, but only on my homepage. Not on my portfolio page. I’ve included my login in Private Content. Appreciate it!

    September 18, 2024 at 8:12 am #1467279
    Guenni007

    try this as selector above in the snippet from: https://kriesi.at/support/topic/disable-image-title-tooltip-on-hover/#post-1467222
    var links = document.querySelectorAll('a, img, *[title]');

    September 18, 2024 at 11:39 am #1467304
    paulw185

    Hi @Guenni007. That works perfectly! Now ALL images on my homepage and portfolio don’t show a tooltip anymore. Great stuff! Thanks a lot!

    September 18, 2024 at 5:06 pm #1467344
    Mike

    Hi,
    Glad Guenni007 could help, thank you Guenni007, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Disable image title tooltip on hover’ is closed to new replies.