iframe shows huge on mobile

Let’s see your site please Dan.

The live blog post that I eventually want to get this video working on is:

https://gtsclothing.com/chicago-cubs-pitcher-jake-arrieta-wins-2015-nl-cy-young-award/

I just set up a test post that you can view the actual iframe code directly from the MLB.com video I’m trying to embed. I need the video to display centered on my post and be responsive for desktop and mobile.

https://gtsclothing.com/jake-test/

Thanks for the help!

Try this plugin: https://www.ads-software.com/plugins/iframely/

In general there’s a design pattern to tackle this problem that involves;
– Adding a wrapper to the iFrame
– Absolutely positioning the iFrame (relative to the wrapper)
– Adding some padding styles to the wrapper

I tried using the test your link option that iframely provides and used the code to update a new text block element on my wordpress post. Please view the new one. It’s a bigger iframe, but it’s still not centered or responsive, when I shrink the size of my browser window the size of the video player doesn’t adjust.

Can you show a screenshot of the issue you see when you shrink the window size? I might be misunderstanding the issue.

https://snag.gy/seJQV.jpg

When I simply link up a youtube video using the video url and a video player element for my wordpress page builder, the video will fit perfect within the container after making the browser window small. This one is still cut off and bigger than a mobile optimized view should be.

The plugin doesn’t appear to be triggering on the larger video. Are you using the shortcode:

[iframely]https://your.url/here[/iframely]

?

Hi guys, Ivan from Iframely here.

Unfortunatelly, MLB videos’ iFrames are not responsive on their own. Iframely knows that and keeps returning the fixed size, sorry.

You can verify that by opening their iFrame in a separate tab.

Sorry I misunderstood your plugin.

Maybe for now you can use this service to make your videos responsive: https://embedresponsively.com/

Iframely is the right plugin for the task. But there is no way to make MLB iFrames responsive, because they are not.

Oh right it’s a specific type of iFrame from MLB, that makes sense.

Crap! Okay thanks for the help guys. I’ll just stick with this layout for now:

https://gtsclothing.com/chicago-cubs-pitcher-jake-arrieta-wins-2015-nl-cy-young-award/