This article will help you:
  • Figure out why a page isn't loading in the Editor in Optimizely Testing and Personalization
  • Diagnose and fix common editor-loading issues
  • Clear your browser cache and cookies

Are you seeing a Sorry, we were unable to load... message in the Editor? Having trouble accessing a certain page in the Editor? Are pages not loading as you expect? Maybe you see something that looks like this:

This article walks you through how to load different content types in the Editor.

Here are a few common issues:

  • If you see a message, "We have loaded your site using compatibility mode," check out our article on mixed content.

  • If you're trying to load a page that requires session-specific information, like a shopping cart, intranet page, or other logged-in content, check out our article on gated content.

  • If you're trying to load content that's in an iFrame, read about loading iFramed content.

  • If you use an X-Frame-Options header, consider switching to the newer Content Security Policies header.

Having another problem that you can't identify? Keep reading to troubleshoot Editor-loading issues.

Common Editor loading issues

If a particular page won't load in the Editor, first run through this list:

  1. Check that the page loads consistently outside of Optimizely. 

    Make sure you can reach the page in your browser, outside of Optimizely, multiple times in a row. If the page doesn't always load outside of Optimizely, it may not load in Optimizely either.

  2. Clear your browser cache and cookies, then reload the page.

  3. Check that the Optimizely snippet is installed.

    If you're using Optimizely Testing, check the Diagnostic Report to see if the snippet is installed and properly configured.

    If you're using Optimizely Personalization, the Diagnostic Report will be available soon! Instead, check for the snippet in the browser console.

    Load your page in a browser. In Chrome's Developer Tools, use the following keyboard shortcut to open the browser console:

    • Windows: Ctrl + Shift + J

    • Mac: Command + Opt + J

    Once the console is open, type optimizely. If it returns an error such as "optimizely is undefined" then the snippet is not implemented correctly.



    Learn about implementing the snippet.

  4. Check that the snippet is installed synchronously at the top of the page. 

    Make sure that the snippet is at the top of your <head> tag, as we recommend in the snippet implementation walkthrough.

  5. If you're using Optimizely Personalization, try loading the page with the Pop-Out Editor. Popping out the Editor helps to solve many header issues.

  6. Advanced: Are there any errors in the JS console that don't normally exist on the page?

    Filter the console output for error logs. If you see an error within "bundle" or "client.js/[projectID].js", there may be a conflict.

  7. Advanced: Is your site configured to disallow parameters it doesn't expect, or parameters that include raw URLs in them?

    Check this by trying to load the page with an innocuous query parameter, like ?test=true and then a parameter that contains a raw URL.

    If your site disallows unexpected parameters, you'll need to whitelist Optimizely's Editor parameters. Contact support if you'd like to know more about this.

  8. Advanced: Does the page load outside the Editor within an arbitrary iFrame?

    Some sites have frame-busting logic that prevents them from being iFramed correctly. Try constructing an iFrame on any page through the browser console to see if the page loads correctly, for example: <iframe src='http://www.atticandbutton.us/' style='width:800px;height:600px'></iframe>

    If the page won't load in an arbitrary iFrame, you may need to whitelist the Optimizely domain (https://app.optimizely.com) as a valid host.

Clear browser cache and cookies

Sometimes, the simplest solution is to clear your browser cache and cookies.

Here's how to clear your cache:

Google Chrome:

  1. Type chrome://settings/clearBrowserData in the browser bar (where you normally enter a URL).

  2. From the Obliterate the following items from: menu, select your desired time range or the beginning of time to clear your entire cache/cookies.

  3. Select:

    • Browsing history

    • Download history

    • Cookies and other site and plug-in data

    • Cached images and files

  4. Click Clear browsing data, then close all of your Chrome windows and re-open Chrome.

Firefox:

  1. Select History > Clear Recent History from the browser's top-navigation menu.

  2. From the Time range to clear: menu, select your desired time range or Everything to clear your

  3. Open the Details panel and select:

    • Browsing & Download History

    • Cookies

    • Cache

  4. Click Clear now, then close all of your Firefox windows and re-open Firefox.

Internet Explorer:

  1. Select Tools > Delete Browsing History (in older versions) or SafetyDelete Browsing History (in newer versions) from the browser's top-navigation menu or settings menu.

  2. Deselect Preserve Favorites website data.

  3. Select:

    • Temporary Internet files and website files

    • Cookies and website data

    • History

  4. Click Delete, then close all of your IE windows and re-open IE.

Note that Optimizely only supports IE8 and higher.

Safari for Desktop:

  1. Select Safari > Clear History from the browser's top-navigation menu.

  2. From the Clear menu, select your desired time range or all history to clear your browser cache and cookies.

  3. Click Clear History, then close all of your Safari windows and re-open Safari.

 Safari for iOS:

  1. Open the Settings app.

  2. Tap Safari.

  3. Tap Clear History and Website Data, then close all of your Safari windows and re-open Safari.

Android:

  1. From the Settings menu, tap Apps or Application Manager.

  2. Choose the All tab.

  3. Find your web browser, then tap it.

  4. Tap Clear Data, then Clear Cache, then close all of your browser windows and re-open your browser.

Android encompasses a wide variety of devices and browsers, so these steps may differ for you.

Optimizely Personalization: Load the Pop-Out Editor

If you're using Optimizely Personalization, try using the Pop-Out Editor to load your page. Popping out the Editor helps to work around header issues in most cases.

In the Editor, click the () icon to load it in a new browser window.

Load mixed content in the Editor

When you load a page in the Optimizely Editor, you may see a warning: "We have loaded your site using compatibility mode — you can still edit your page, but some site functionality might be missing."

To fix this issue, see our article on compatibility mode and mixed content.

Loading pages that require a login, or intranet pages

If your site gates certain pages behind logins or requires session-specific information, those pages will not immediately load in the Editor.

A few common examples include:

  • A page that requires session-specific information to load, such as a shopping cart

  • A page that is gated or available only to logged-in visitors

  • A staging site behind a firewall

  • An intranet page

If this is the case, check out our article on loading gated content.

Loading pages that use iFrames: Inline Frames

Some sites use iFrames, which load content from other pages onto your site. You won't be able to edit the content inside iFrames in your variations.

To learn more about what to do with these pages, see our article on iFrames.

Loading Modals or Hiding Modals in the Editor

Use editor_only code to display/hide modals in the editor. This is useful if you need to edit a modal that does not show up in the Optimizely editor on load, or if you need to edit underlying content behind the modal.

Everything inside the editor_only code will execute in the Optimizely editor but will not execute outside the editor when the experiment is live.


/* _optimizely_evaluate=editor_only */
$("MODAL_SELECTOR_HERE").css(
{"display":"none"}
);
/* _optimizely_evaluate=end_editor_only */
// Write your variation code below
 
Tip:

If you’ve had a look at the steps above and you haven’t been able to load your page in the editor correctly yet, you can also try out our Chrome extension that helps with certain editor loading issues. Have a look at our article on our Optimizely Editor Loading Chrome extension.