Live preview of themes, issue

It’s not an issue with Envato, it’s actually an issue with your server:

Refused to display ‘http://revis.payo-themes.com/’ in a frame because it set ‘X-Frame-Options’ to ‘sameorigin’.

The relevant header sent back by your server is below - you can find this in the Network tab of your browser’s developer tools:

X-Frame-Options: SAMEORIGIN

Setting X-Frame-Options to SAMEORIGIN means other websites, including ThemeForest, cannot embed your site in a frame. There are two options to resolve this:

Option 1. Remove the header entirely

This will ultimately depend on how the header was set. You can try a general .htaccess rule like the following, but it’s not guaranteed to work, so make sure to test it with your browser’s devtools.

Header unset X-Frame-Options

Option 2. Use the newer CSP headers

Add the Content-Security-Policy header to your website and specify the marketplace’s preview URL as a permitted frame ancestor. This will override the X-Frame-Options header in modern browsers.

Content-Security-Policy: frame-ancestors https://preview.themeforest.net/;

If you care about supporting older browsers, you might also want to override the X-Frame-Options with an allow rule like below, but this won’t work for most modern browsers.

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

Here’s an example on how to do both with an .htaccess file (mod_headers is required):

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