If you are subscribed to the Framer & Customers plan, you can optionally load your account in an iframe on any page of your website. To make this work, your SimulArt account must first be installed on a subdomain matching your website domain. 




Step 1. Contact us to initiate the custom subdomain installation procedure, a $10 monthly fee applies for the installation, maintenance, and SSL certificate required to secure the URLs.


Step 2. Add the following code inside the <head></head> tags of the page where you will be loading the iframe. This code will make the height of the iframe adapt to the content. Make sure to replace ACCOUNT_URL by your account URL. 

<script src="https://ACCOUNT_URL/ext/iframeResizer/iframeResizer.min.js" type="text/javascript"></script>

<script language="javascript">
var myWidth = 0, myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
</script>


Step 3. Add this code where you want the design page to be loaded. Do not forget to replace ACCOUNT_URL here as well. 

<style>iframe{width:100%}</style>
<iframe id="fstudio" scrolling="no" style="border: none; min-height: calc(100vh);" onload="iFrameResize({autoResize:true,checkOrigin:false})"></iframe>
<script>document.getElementById("fstudio").src = "https://ACCOUNT_URL/design?parentWidth=" + myWidth + "&parentHeight=" + myHeight;</script>

In the example above, the home page named design is loaded but you can also load the following pages:

connect_page -> Simplified customer interface without checkout option

connect -> Complex customer interface without checkout option

gallery -> Gallery of images if you offer them

podgallery -> POD Exchange gallery of images if you offer them



You can optionally customize the page appearance of customer pages by adding your own CSS under Menu -> Settings -> Customer Pages CSS Styling.


Prices are displayed by default but if you set "Do you want to display prices to guests?" to "No" under Menu -> Settings -> Customers, no prices will be displayed to customers that are not logged in.