Responsive Device Switcher does not work
Table of contents
How to recognize the error
If you would like to display and edit your website responsively, but your website fails to load in the responsive device mode, it could be due to framing restrictions.
How to fix the error
Solution 1: Using the Varify.io® Chrome Extension
So that you can still display and customize your variants for mobile devices, you have the option of bypassing this framing restriction with the Varify.io® Chrome Extension.
- Download the Varify® Chrome Extension
- Activate it in your browser and store your Varify® code snippet
- Activate the "Allow Responsive Device Switcher" switch
- Reload the page - Ready!
The Responsive Device Switcher should now work.
A more detailed explanation of installation and activation, as well as other functions, can be found here: Varify® Chrome browser extension
Solution 2: Customizing the X-Frame options on your own website
If you see an error message like in the screenshot above, a framing restriction is not allowing you to load the page in the responsive device switcher.
The normal desktop view of the visual editor is not affected by framing restrictions.
If your page is delivered with the response header X-Frame-Options with the value "deny", responsive editing cannot be used.
A sensible solution in this case would be to relax the restriction to X-Frame-Options: "sameorigin".
X-Frame-Options: "sameorigin" allows your pages to be embedded in a frame from your domain, but does not allow them to be embedded from other websites.