1

I want to use his image zoom function on my wordpress site: Medium's Image Zoom in vanilla JS

but I'm not sure how to add

data-action="zoom"

attribute to all images attached in posts. What function I need to use? Can somebody help me?

  • Attached in the post you mean directly to the content of the post? – Drupalizeme Nov 2 '17 at 12:01
  • Yes, I mean directly to the content. – Georgi Pehlivanov Nov 2 '17 at 12:04
  • you can use jquery like this jQuery('.class_name').attr('data-action','zoom') – DHL17 Nov 2 '17 at 12:21
  • Thanks for your help. I'm not sure which class name to add. I need this to be attached to all posted images. – Georgi Pehlivanov Nov 2 '17 at 12:35
  • You can use class wp-post-image – DHL17 Nov 2 '17 at 12:49
2

You have a number of options.

You could use the add_filter( 'the_content', 'add_data_attributes' ); And after that find the images attached to the post.

Or you can use the image_send_to_editor filter more here.

  • Thank you very much! I'll read more about both options and try it. – Georgi Pehlivanov Nov 2 '17 at 12:31
  • This is a good hint to do that. – Frank May 12 '18 at 11:20
0

Place this code where you run the post loop after <?php get_footer(); ?>

    <script>
    jQuery('.wp-post-image').attr('data-action','zoom')
    </script>
  • Thank you very much! This work, but I have a problem. Images don't have .wp-post-image class. I inspect an image and class is wp-image-1928 ... so every image have different class. I'm not sure what to do. – Georgi Pehlivanov Nov 2 '17 at 13:41
  • did you find any common class? if any common classes are there than use that one instead of wp-post-image. – DHL17 Nov 3 '17 at 3:44

Not the answer you're looking for? Browse other questions tagged or ask your own question.