Ignore image class?

Hi shanefellows!
No, I’m afraid that’s not possible at the moment. Are you using the WordPress plugin for Royalslider?
When inserted through the editor, Responsify ignores all image sizes larger than the one being inserted. So I guess there’s something else going on with Royalslider.

Hi Stefan,

Yeah, it seems that RoyalSlider uses a script to insert the thumb, but that is being replaced by the responsify code. Here is how the code looks before Responsify does its magic:

<div class="rsContent">
<img class="rsImg" src="https://cdn.acquaphoto.com/wp-content/uploads/Fairmont_Mayakoba_Wedding_001-1340x893.jpg" data-rsBigImg="https://acquaphoto.com/wp-content/uploads/Fairmont_Mayakoba_Wedding_001.jpg" alt="Fairmont_Mayakoba_Wedding_001" width="1140" height="760"/>
<div class="rsTmb"><img src="https://cdn.acquaphoto.com/wp-content/uploads/Fairmont_Mayakoba_Wedding_001-96x72.jpg" alt="Fairmont_Mayakoba_Wedding_001" width="96" height="72"/></div>
</div>

and after:

<div class="rsContent">
<span data-picture data-alt="Fairmont_Mayakoba_Wedding_001"><span data-src="https://acquaphoto.staging.wpengine.com/wp-content/uploads/Fairmont_Mayakoba_Wedding_001-320x213.jpg" ></span><span data-src="https://acquaphoto.staging.wpengine.com/wp-content/uploads/Fairmont_Mayakoba_Wedding_001-1024x683.jpg" data-media="(min-width: 320px)" ></span><span data-src="https://acquaphoto.staging.wpengine.com/wp-content/uploads/Fairmont_Mayakoba_Wedding_001.jpg" data-media="(min-width: 1024px)" ></span><noscript><img src="https://acquaphoto.staging.wpengine.com/wp-content/uploads/Fairmont_Mayakoba_Wedding_001-320x213.jpg" alt=""></noscript></span>
<div class="rsTmb"><span data-picture data-alt="Fairmont_Mayakoba_Wedding_001"><span data-src="https://acquaphoto.staging.wpengine.com/wp-content/uploads/Fairmont_Mayakoba_Wedding_001-320x213.jpg" ></span><span data-src="https://acquaphoto.staging.wpengine.com/wp-content/uploads/Fairmont_Mayakoba_Wedding_001-1024x683.jpg" data-media="(min-width: 320px)" ></span><span data-src="https://acquaphoto.staging.wpengine.com/wp-content/uploads/Fairmont_Mayakoba_Wedding_001.jpg" data-media="(min-width: 1024px)" ></span><noscript><img src="https://acquaphoto.staging.wpengine.com/wp-content/uploads/Fairmont_Mayakoba_Wedding_001-320x213.jpg" alt=""></noscript></span></div>
</div>

So you can see that for Thumb it is loading the largest image it can, which on large screens is full-res resized down to 96×72. That’s pretty much the opposite of what we need it to do. ??

I am able to customize the markup for RoyalSlider, just not sure what would work best for the thumbs with Responsify. Would you mind taking a look at the markup documentation and making a recommendation?
https://help.dimsemenov.com/kb/wordpress-royalslider-tutorials/wp-using-slide-markup-editor

Thanks! BTW- I’ve tested all the other wordpress responsive/scaled images plugins and yours is by far the best!!!

sorry, here is a better link to the actual markup tags:
https://help.dimsemenov.com/kb/wordpress-royalslider-advanced/wp-list-of-supported-variables-for-custom-slider

and here is the markup that I am currently using:

<div class="rsContent">
<img class="rsImg" src="{{image_url}}" data-rsBigImg="{{large_image_url}}" alt="{{title}}" width="{{image_width}}" height="{{image_height}}"/>
<div class="rsTmb"><img src="{{thumbnail_url}}" alt="{{title}}" width="{{thumbnail_width}}" height="{{thumbnail_height}}"/></div>
  {{html}}
  {{animated_blocks}}
  {{#link_url}}
  <a class="rsLink" href="{{link_url}}">{{title}}</a>
  {{/link_url}}
</div>

Thanks! BTW- I’ve tested all the other wordpress responsive/scaled images plugins and yours is by far the best!!!

??

I’ll try it out myself and see if I can come up with a smart solution. I guess there might be more similar scenarios with other plugins out there.

I’ll get back to you ??

You know what? I think I’ve already found a solution!
What happens if you downloads this modified version of responsify and adds the rwp-not-responsive class to the image?