- This topic has 7 replies, 2 voices, and was last updated 3 years, 7 months ago by
.
-
Posts
-
Hello Everyone,
I am running WP 5.9 and GP Premium child theme.
I have an issue on mobile only. There is lots of blank white space under my pins. The pins are embedded using the custom HTML blocks, copied and embedded straight from Pinterest -> “Get Embed Code” -> “Large” (size)
The “large” sized pins display perfectly on the desktop.
I would like to resize all the embedded Pin images, possibly limiting the max height to remove (or minimize) the white spaces on mobile, please.I suspect that the height of the large image sizes is too much for mobile (or not resized correctly), which adds all the unnecessary white space below each pin on a mobile device.
If you could please suggest a solution that would be very helpful.
Thanks,
ZoltanCustomer Support
Hi Zoltan,
Can you share an occurrence of this issue? So we can better understand what should be looked at. 🙂
For the pins, I believe you’re pertaining to the Pinterest red “Save” button overlaying the images?
I’ve checked the 2 pages and I’m not sure I’m seeing anything similar to what’s described as all the buttons don’t have white spaces below them and are overlaying the images.
Perhaps I’m missing something. Let us know. 🙂
Hi Elvin,
Thank you for the quick reply.:)
The Pinterest Save button was fine.:)
If you please open one of the pages on desktop than on mobile.
You will find that the desktop looks good, it’s just to give us a benchmark vs the mobile look.
On mobile, there is a massive white gap below each and every pin. The pins are bordered with a light grey line, the problem is below this grey line, the spacing is off.I have sent you a screenshot, in a private message to illustrate.
This spacing issue is the same on all my mobile pages that have pins.
Thanks,
ZoltanI see.
This is a tricky one because the content is an iframe w/ a fixed height attribute.
That space you see occurs on any screen that has a width smaller than 450px.
This occurs when the content of the iframe tries to be responsive while maintaining its layout.
One thing you can try is to assign a different height to the iframes on small viewports through CSS. But the problem is, some pinterest cards will be cropped while some will have white space WITHIN the card. It is not a iframe content aware setting.
This is the caveats of having an iframe on a page.
For this to be properly responsive, you may have to run a specific iframe-resizer script but that’s something beyond the scope of our support, unfortunately.
Hi Elvin,
Got it, thanks.
What is Generate Press theme-supported method to embed pins on the page?
What would you recommend instead of using the iframe, please?I’m not sure if Pinterest has a WP plugin that doesn’t use iframes.
If there is actually no Pinterest cards related plugins that doesn’t use iframes, you may have to start considering iframe resizer libraries like this one – http://davidjbradshaw.github.io/iframe-resizer/
Ok, thanks Elvin!
No problem. Let us know if you have further questions. 😀
- You must be logged in to reply to this topic.
