View iFrames and out-of-frame photos on mobile

Hello. IFrames and out-of-frame photos are displayed on the mobile and are not automatically adjusted to the size of the mobile screen.

Hi there! Looking at your site, it appears that the problematic embeds are all within the WooCommerce description panel. Is that correct?

I tried adding similar embeds to a Twenty Twenty-Two test site without WooCommerce, and they worked just fine on mobile. So I suspect that this may be an issue with the way WooCommerce’s tabs layout works with Twenty Twenty-Two. If so, I’d suggest asking about this over in the WooCommerce plugin’s forum:

https://www.ads-software.com/support/plugin/woocommerce/

The language of my site is Persian and right to left. Do I have to use a new css?

Your site’s text should flow right to left automatically when you have the Persian language selected. I see a lot of right-to-left text on your site currently, is there a specific area that’s not appearing as expected?

Thanks!

• This reply was modified 2 years, 8 months ago by Kjell Reigstad.

Hi There! This problem is not only present in WooCommerce pages but also in normal site pages and posts. Please check the link below.
https://nimafereidooni.com/2022/01/21/136112/

• This reply was modified 2 years, 8 months ago by nimafereidooni1.

https://nimafereidooni.com/2022/01/21/136112/

Thanks for the link —?I can see the issue.

I see that these embeds on that page are placed inside of Code Blocks. Are you sure that’s necessary? When I embed that YouTube link directly, it scales as expected on mobile:

I’m not sure about the Aparat videos though, because the editor doesn’t support direct embeds from there by default.

Unfortunately, due to the filtering of YouTube in Iran, it is not possible to place a direct link. Aparat movie sharing site is common in Iran, but unfortunately this site has not provided the possibility of placing a direct link. In addition, the pages of my site are more than 8000 pages, so far the videos have been placed in the previous form with an iframe code. Can’t 2022 skin settings be changed a bit to fix this?

Would you mind sharing the block markup you’re using to embed one of these videos? If you select the embed and use the copy command here, that should give you the markup:

It would help me (or anyone else in the forums) reproduce the issue and troubleshoot. Thanks!

<!– wp:html –>
<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/MTDzV7IkA58&#8243; title=”YouTube video player” frameborder=”0″ allow=”accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture” allowfullscreen=””></iframe>
<!– /wp:html –>

<!– wp:code –>

<iframe width="560" height="315" src="https://www.aparat.com/video/video/embed/videohash/dt43F/vt/frame" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>

<!– /wp:code –>

Thanks for sharing. There’s currently a mismatch between how iframes appear in the editor, and how they appear in the frontend by default. I’ve opened an issue here for the block editor team to discuss:

https://github.com/WordPress/gutenberg/issues/38586