Trying to add iframe to collection page but will not resize on mobile

Highlighted
New Member
1 0 0

First post here .......

I am using a page on an existing Shopify site to test an iFrame before I use it on another yet to be created Shopify site ......

I followed the instructions below from my vendor by uploading iFrameResizer.min.js file as an asset and have referenced this js file before the head tag in the theme.liquid file 

Added html code to the collections page below

https://www.housenumbersdirect.co.uk/collections/door-stops

But I am unable to get it to resize. Can you help  ?

 

--------------------

3. Upload the iFrameResizer.js script to your website folder

 Add the file iFrameResizer.js that you downloaded in step 3 to your scripts folder (or any location you prefer to store your javascript files). 

4. Insert the script references to your webpage

 Add the below html to the scripts section of your web page. Now update the src attribute so that it points to the location where you have just placed the iFrameResizer.js file.


    <script type="text/javascript" src="iFrameResizer.min.js"></script>
    <script type="text/javascript">
        window.onload = function() {
            iFrameResize({
                log                     : false,
                enablePublicMethods     : true, 
                enableInPageLinks       : true
            });
        };
    </script>


5. Add the iFrame to your website

Add the below html to page where you want to display Your Web Shop. Update the src attribute to point to your own webshop url. 
 
<iframe src="http://YOURSUBDOMAINGOESHERE.yourwebshop.com" frameborder="0"  width="100%" height="1800px"scrolling="yes"></iframe>

0 Likes