pics in footer do not scale

sh70 · December 2016

Hello,

i have a footer-layout 1/4 1/4 1/4 1/4.
When i put a pic inside one of these colums, the pic doesn't stays inside the 1/4, it shows in original size.
The text grows and shrinks with the columns, but the pic not.

In Visual Composer e.g. a pic (attribute "FULL") is always shrinking to the size of the column.
In footer this doesn't work. But i need this, because i can't scale the pic beforehand, because it will not be responsive then on other devices.

Can you help me?
Thanks!
Best Regards
Steffen

Albert · December 2016

Hi Steffen,

did you set scale-with-grid class for those pictures?

sh70 · December 2016

Hi,

no, i use a shortcode from "WP Video Lightbox" in one of the footer columns.
This shortcode plays a youtube-video and the picture is only the placeholder.
I use a text-widget in footer with this argument:

[video_lightbox_youtube video_id="YOUTUBE_VIDEO_ID" width="960" height="720" anchor="/wp-content/uploads/2016/12/play_video.jpg"]

The result is a picture showing in the footer and if you click on that picture a modal window is opening and playing the youtube-video.
The problem is, that this placeholder-pic is not scaling with the grid.
How can i solve this problem?

Thanks!

Albert · December 2016

You need to add scale-with-grid class for the images if you want them to be responsive.

sh70 · December 2016

ok.
How would this complete text-widget look like then?
What do i have to write in there in total?

[video_lightbox_youtube video_id="YOUTUBE_VIDEO_ID" width="960"
height="720" anchor="/wp-content/uploads/2016/12/play_video.jpg"]

+ what ??

Albert · December 2016

The first thing you need to check if this shortcode works with class attribute so you can add the following attribute into above shortcode:

class="scale-with-grid"

But if this shortcode does not have such attribute, you need to contact with shortcode author and ask him how to make shortcode images responsive.

sh70 · December 2016

Unfortunately it doesn't work. :-(
I will contact the author.

Do you maybe know a way for your theme to put a RESPONSIVE pic into one footer column that is only a placeholder and with click on it a youtube-video is being played in a modal / popup window?

Albert · December 2016

You can try to use something like below in Text widget:

<a href="LINK-TO-YT-VIDEO" rel="prettyphoto"><img src="PATH-TO-IMAGE" class="scale-with-grid"></a>

sh70 · December 2016

Thanks! It works! :-)

Albert · December 2016

You are welcome!

pics in footer do not scale

Comments