Hello, I am trying to embed an html5 file in an iframe, in a metafield on a product page.
The file is responsive on its own, but as soon as you host on the shopify site, it loses the responsiveness.
See the 'Look inside' tab here
I've also set up some tests on a page and cannot get them to work on the iphone either
Hope you are doing well.
can you please share some some small videos/recording of the issue? so, I can get the better idea to provide the solution.
I cant seem to make a video. but the iframe is
<iframe src="https://www.childcaretechtrends.com/flipbooks/ccd/index.html" width="900" height="637" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>
When just the file is viewed
it is responsive on phone (eg fills window and flips one page at a time)
but in the iframe on the shopify page - it is cut off on the phone
it is looking good and is responsive on a mobile screen
Some times iPhone behaves like this. can you confirm on an android phone? I have seen on the Android phone it is working well.
I have had seen this problem earlier on iPhone, I don't think so there is any reliable solution.
Please try to updating your code as per below. Let me know if you still facing the same issue after updating.
<iframe src="https://www.childcaretechtrends.com/flipbooks/ccd/index.html" width="100%" height="637" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>
Make the shift from discounts to donations, and witness your business not only thrive fina...By Holly Dec 4, 2023
On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...By Arno Nov 27, 2023
You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...By Skye Nov 8, 2023