AMP resizes embedded video(s) (vimeo)

Thanks for reaching out and sharing details of what you’re encountering. While I’m unable to recreate this on my own site I do see some differences when comparing the same Vimeo video in a column block to your own – when checking the AMP version.

When checking the non AMP version the HTML markup seems the same. For that reason it may be a case that there is something independent of the AMP plugin or Vimeo block how your video is appearing in AMP.

In order to investigate further you can share your Site Health information here or privately using our user submission form?

Thanks for sharing the additional insights with your Site Health form. As nothing obvious stands out can you share whether you encounter the same when performing any of the below checks:

1. When you switch to another theme temporarily. If you are performing this check let me know and I can review your site with another theme active.
2. When using the Health Check & Troubleshooting plugin, with only the AMP plugin active. We have steps for performing this check listed on the plugin website. This will only impact you as a logged in administrator, deactivating all plugins by default while in this mode.

Let me know how you get on with the above checks.

Thanks for the instructions. I followed your advice and tested with the themes Twenty Twenty and Twenty Nineteen with all plugins deactivated exept for the AMP plugin: same behavior.

Thanks for the update. I did some more testing on this and it looks like what you’re encountering is due to the missing CSS classes that get automatically added for Vimeo videos.

Can you add the below classes added to the Vimeo video below, to the Blocks sidebar (Advanced > Additional CSS class(es))?
wp-embed-aspect-1-1 wp-has-aspect-ratio

You’ll see a recording of me re-adding the classed below, in order to resolve the same issue:
https://recordit.co/L5UPI5eCHH

Let me know how you get on after the above. I’m happy to check your site also if you want to let me know once this is done.

Yeah, it works. Thank you so much.

Great to hear it, many thanks for the update. If you have any further queries going forward be sure to reach out. And if you’ve been using the plugin for some time now please also consider sharing your plugin feedback.

I am curious to know whether this is a bug in WordPress core or in the AMP plugin? Yes, I do have another question, but will open a new thread.

Good question. I don’t think it’s a bug in either WordPress Core or the AMP plugin as I’ve checked and this occurs for other blocks with embeds such as YouTube. Tt also occurs when not using the AMP plugin. Some blocks have additional CSS classes added once they’re added.

In your own case why the attributes were removed I can’t be sure. It may be worth testing on other Vimeo or even YouTube blocks.

Happy 2022!

I would like to share my findings. The problem was a crooked aspect ratio of the uploaded video.

When selecting the vimeo (or youtube) embed block, entering the URL and hitting the embed button, the Additional CSS class(es) field under Advanced cannot be empty. If it is, there is a problem with the aspect ratio of the video.

Adding any of the classes

wp-embed-aspect-1-1 wp-has-aspect-ratio
wp-embed-aspect-4-3 wp-has-aspect-ratio
wp-embed-aspect-16-9 wp-has-aspect-ratio

manually, is only a short term solution, it gets removed as soon as the page or post is edited again.

In my case, the aspect ratio of the uploaded video was 4.5:3. I corrected it to 4:3 (640 x 480), uploaded the videos again and had my problem solved.

Thank you for sharing solution with us, I’ll mark this as resolved. Feel free to open a new support topic if you require any further assistance.