My demo refuses to connect in Preview Iframe

If a visitor access the demo iframe of ThemeForest at: https://preview.themeforest.net/item/magone-responsive-magazine-news-wordpress-theme/full_screen_preview/14342350

he will see a message: demo refuses to connect

But when if he access the demo page directly at: https://demo.sneeit.com/magone/ (or he can click Remove Iframe) and he will access the demo properly.

Any body has problem? Appreciate if you can help. Thanks a lot.

Hi,

Your server is setting the following header which prevents it from being displayed in an iframe.

X-Frame-Options: SAMEORIGIN

You should either omit the header, or change it to something like below:

X-Frame-Options: ALLOW-FROM https://preview.themeforest.net/

If you are not familiar with X-Frame-Options then contact your webhosting support and let them do this for you.

Thanks

1 Like

Thanks for the reply.

I added the follow code to .htaccess but the problem still stand:
Header always append X-Frame-Options ALLOW-FROM https://preview.themeforest.net/

Appreciate if you can provide more details. Thanks a lot.

The header is still set to sameorigin, and the demo won’t work until you fix that.

Make sure the .htaccess file is in the root of your demo website (e.g. https://demo.sneeit.com/.htaccess). If it’s still not working, then you will need to contact your web host and ask for their help, since there are dozens of different reasons why the rule may not be taking effect – they will be best suited to figure this out for you.

Yes, I change the .htaccess file in the root folder of the site. Here is the whole content of the .htaccess

RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]

# add a trailing slash to /wp-admin
RewriteRule ^([_0-9a-zA-Z-]+/)?wp-admin$ $1wp-admin/ [R=301,L]

RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]
RewriteRule ^([_0-9a-zA-Z-]+/)?(wp-(content|admin|includes).*) $2 [L]
RewriteRule ^([_0-9a-zA-Z-]+/)?(.*\.php)$ $2 [L]
RewriteRule . index.php [L]

Header always append X-Frame-Options ALLOW-FROM https://preview.themeforest.net/

Thanks for your help.

Just realized that the value should be enclosed in quotes like so:

Header always append X-Frame-Options "ALLOW-FROM https://preview.themeforest.net/"
Header always append Content-Security-Policy "frame-ancestors https://preview.themeforest.net/;"

Other than that, looks good to me. If it’s not working, contact your web host.

2 Likes

Wow. You saved my day with your awesome knowledge. Thank you very much for your kind help! Have a nice day.

1 Like