In the following article, links will be referenced as originating from system.spektrix.com. If you have implemented a custom domain for your Integration, please replace system.spektrix.com with your chosen subdomain.
- In the
<head>of each page containing a Spektrix Iframe that needs auto resizing enabled include the following script tag, replacing
clientnamewith the Spektrix client name you are integrating with:
If you are using a custom domain with your integration, please use the following script in replacement of the above, replacing
clientname with your custom domain and Spektrix client name.
- Add the query string parameter ‘resize=true’ to the Iframe source url embedded into the page and add a name and id attribute to the Iframe with value ‘SpektrixIFrame’:
<iframe name="SpektrixIFrame" id="SpektrixIFrame" frameborder="0" src="..Iframe.aspx?resize=true" style="width: 100%; height: 1000px;" > </iframe>
replacing ‘300’ with the minimum height of the Iframe that you would like (in pixels).
When navigating through the Iframes, you may find that pages do not scroll to the top when changing from one page to another. This behaviour can be forced by adding an additional attribute of onload=”scroll(0,0);” to the Iframe tag (HTML5 support only):
If using the Express Checkout Flow, we recommend that you remove the above from the Checkout Iframe due to how express checkout renders from one section to the next.
The resize script only handles the height of the Iframe. If you are having issues with the width of the Iframe, this is likely to be caused by the styling of the Iframe element in the parent site.