🌐 To improve performance and searchability, our platform URL has moved to app.amilia.com. If you use www.amilia.com in your website, socials and email campaign(s), the links will automatically redirect to app.amilia.com. For an optimal page loading speed and user experience, update your links asap to app.amilia.com.
When you embed your online store directly into your official website, clients may browse, log in, register and pay while remaining on your site. This is called an iFrame. Not sure how it works? Here's a webinar on the basics of iFrame and API integration.
In this article, we'll review:
1. How to Customize your Embedded Store
Before embedding your iFrame, choose a color and a default start page in the Store > Store Settings > Store Embedding subtab.
Choose a color to match the esthetic of your website. Click on a swatch, move the color scale or write the color code to find exactly what you're looking for.
Choose a start page that will serve as the iFrame's default landing page.
To see what the iFrame will look like, scroll down the page for a Preview of the integrated store. At any time you can add/remove store tabs via the Store > Customize tab.
2. How to Embed the iFrame in your Website
To successfully integrate your iFrame in your website, you must:
In the Store settings > Store Embedding subtab, add your website's URL in the Website section. To add multiple URL, write them on a separate line. Our security measures prevent outside sources from embedding the iFrame in a different website.
We suggest testing with the Test code prior to using the Production code to make sure it works properly. When you're ready, copy and paste the HTML Production code in the desired location on your website.
To embed the iFrame, right-click on the desired location in the webpage and select 'View Page Source'. Paste the Production code in the appropriate spot in the HTML strand. Your webmaster or someone with knowledge of HTML should perform this action. Contact us at support@amilia.com if you need help.
If you prefer, you can integrate buttons on your website that link to your online store.
3. How Safari Users Interact with your iFrame
Clients browsing with Safari on their Apple products will need to click one or two additional buttons in order to interact with your iFrame.
If 30 days or more have elapsed since the client logged into their user account, the message below appears after they click on the iFrame:
If less than 30 days have elapsed since the client logged into their user account, the message below appears after they click on the iFrame:
If clients Allow cookies, they may continue browsing on the iFrame. If clients Don't Allow cookies, they'll be redirected to your store on the SmartRec platform.
4. FAQ's
Can I embed my store with an iFrame if I host my website on GoDaddy?
Can I embed my store with an iFrame if I host my website on GoDaddy?
Given the way that GoDaddy implements its HTML widget, it is not possible to embed the store on a GoDaddy site. In more technical terms, GoDaddy adds an impenetrable layer between the injected HTML code and the rest of the page, and Amilia SmartRec would need access to the rest of the page in order for the iFrame to display properly.
Does the iFrame work with the Hostinger web builder?
Does the iFrame work with the Hostinger web builder?
The Hostinger web builder has an Embed code element but it does not support embedding the iFrame code. Enabling CORS for the website won't fix this issue because the Hostinger web builder does not have an accessible file manager. You would need to create a new blank website with a new CMS other than Hostinger.