# Shopify Form won't load into HS iframe

**URL:** <https://community.hubspot.com/t/shopify-form-wont-load-into-hs-iframe/21395>\
**Category:** CMS Development\
**Tags:** javascript\
**Created:** [June 4, 2020, 12:10am UTC](https://community.hubspot.com/t/shopify-form-wont-load-into-hs-iframe/21395 "2020-06-04T00:10:50Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![sberry11](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/sberry11/32/43030_2.png) [@sberry11](https://community.hubspot.com/u/sberry11)\
**Post date:** [June 4, 2020, 12:10am UTC](https://community.hubspot.com/t/shopify-form-wont-load-into-hs-iframe/21395/1 "2020-06-04T00:10:50Z")

</div>

We have a calculator built in Shopify that is pulled into a page on HS. It has worked for months, but all of the sudden can’t be seen. Where the form should be you see this:

 ![27587iD8E09FA8E50EF2E5.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/2/0/20d42e7745fd384ca7a4c215be589b30fd8bdcd3.png)

I can see the form when I go to that link:

 ![27588iCDF60C7B60F075B0.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/f/3/f3fb31abbede50b6144a18a5bcdc48cc1b44e157.png)

I’ve looked around and around. I can’t find what would have changed to block it? The broken page is [http://info.eagleprotect.com/sustainability-savings-calculator](http://info.eagleprotect.com/sustainability-savings-calculator).

Thanks for any ideas to get this running. We need it working to get our certification finalized so it’s kind of urgent.

Sarah

---

<div class="post-metadata">

**Author:** ![jieyintan](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jieyintan/32/29368_2.png) [@jieyintan](https://community.hubspot.com/u/jieyintan)\
**Post date:** [June 4, 2020, 10:13am UTC](https://community.hubspot.com/t/shopify-form-wont-load-into-hs-iframe/21395/2 "2020-06-04T10:13:48Z")

</div>

Hi @sberry11

The “refused to connect” message for iFrames usually comes up with the linked site ([https://eagleprotect.com/pages/calculator](https://eagleprotect.com/pages/calculator)) has a content security policy that is blocking the webpage from showing up.

It’ll be a good idea to check in on that with your developers!

Here’s more information on that: [https://responsivedesign.is/articles/xframe-options/](https://responsivedesign.is/articles/xframe-options/)

---

<div class="post-metadata">

**Author:** ![sberry11](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/sberry11/32/43030_2.png) [@sberry11](https://community.hubspot.com/u/sberry11)\
**Post date:** [June 4, 2020, 4:51pm UTC](https://community.hubspot.com/t/shopify-form-wont-load-into-hs-iframe/21395/3 "2020-06-04T16:51:46Z")

</div>

Thanks everyone and it makes sense, but this one may be above me. I can’t seem to find that part of the code to change the frame-ancestors.

Thanks for the help

---

<div class="post-metadata">

**Author:** ![GregSamsa](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/gregsamsa/32/18373_2.png) [@GregSamsa](https://community.hubspot.com/u/GregSamsa)\
**Post date:** [June 4, 2020, 11:09am UTC](https://community.hubspot.com/t/shopify-form-wont-load-into-hs-iframe/21395/4 "2020-06-04T11:09:03Z")

</div>

In Chrome the consol error reads:

“Refused to frame ‘[https://eagleprotect.com/](https://eagleprotect.com/)’ because an ancestor violates the following Content Security Policy directive: “frame-ancestors ‘none’”.”

I believe you need to set frame-ancestors to allow your page.
