What is the website preloader feature?

The website preloader enables you to pre-load your website or your blog into your Fastory Microsite or Landing Page. The aim is to improve loading times, in order to increase conversion and overall performance.

Displaying the website preloader feature

There are two ways to display the website preloader into your microsite or Landing Page. The only difference is the way the iframe will be displayed in your microsite. You can display the website preloader as a:

  • button: in this case, the website preloader will display on the current screen;
  • screen: in this case, the website preloader will display on another screen. 

How does the website preloader work?

The website preloader works in:

  • desktop version: the website preloader will open a new tab in the browser for the user to access the desktop website;
  • mobile version: the website preloader will load your site before it opens so that the user can access it quicker and navigation seem smoother.

What could generate iframe integration problems?

If the website preloader does not work on your microsite or Landing Page, this means your website might have some security settings blocking the iframe integration. 

Here is the process to allow loading your site into a Fastory microsite:

  • Server

The X-Frame-Options and the Content-Security-Policy should be compatible with most browsers.

Note: Chrome doesn't support ALLOW-FROM but supports the frame-ancestors where IE doesn't support frame-ancestors but supports ALLOW-FROM )

CSP references: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy
X-Frame-Options: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options

  • Apache
...
Header set X-Frame-Options "ALLOW-FROM https://story.tl"
Header set Content-Security-Policy "frame-ancestors https://story.tl;"
  • Nginx
...
add_header X-Frame-Options "ALLOW-FROM  https://story.tl";
add_header Content-Security-Policy "frame-ancestors https://story.tl;";
  • IIS
<system.webServer>
  ...

  <httpProtocol>
    <customHeaders>
    ...
      <add name="X-Frame-Options" value="ALLOW-FROM https://story.tl" />
      <add name="Content-Security-Policy" value="frame-ancestors https://story.tl;" />
    </customHeaders>
  </httpProtocol>

  ...
</system.webServer>
  • CMS

Magento: https://devdocs.magento.com/guides/v2.1/config-guide/secy/secy-xframe.html

Add the line below to the <Magento install dir>/app/etc/env.php file
'x-frame-options' => 'ALLOW-FROM https://story.tl',

for v1 of Magento:

  • Magento Admin Panel
  • System (from main navigation)
  • Configuration (might be last in sub-menu list)
  • Admin (found at bottom in left options column)
  • Security Section
  • Allow Magento Frontend to run in frame => Enabled
Did this answer your question?