How to open the Graphic editor when it is stuck at 47% or not loading?

Scenario 1: The Graphic editor fails to load for anyone

Step 1 – Verify Kameleoon script installation

If the Graphic editor is not loading, and you are being redirected to a login page or another destination, the first step is to check whether the Kameleoon script is correctly installed on the page.

To do this:

  1. Open your browser’s developer tools:
    • On Mac: Press ⌘ + Option + I.
    • On Windows: Press Ctrl + Shift + C.
  2. Navigate to the Elements tab and press ⌘ + F (Mac) or Ctrl + F (PC) to search for the word “Kameleoon” in the DOM.
    Alternatively, you can:
    • Open the Network tab.
    • Filter by “Kameleoon” after refreshing the page to confirm if the script is being loaded.
  • If the Kameleoon script is not present: You will need to install the Kameleoon script on the website to proceed.
  • If the Kameleoon script is present: Move on to the next troubleshooting step.

Step 2 – Verify domain and subdomain configuration

Ensure that the domain and all relevant subdomains have been correctly configured in the Kameleoon App.

  1. Go to the App > Admin > Project, and select Setup for your project.
  2. Click on the Modify Setup button.
  3. Navigate to the Domain Configuration section.
  4. Add all necessary domains and subdomains.
    • For subdomains, use a wildcard (*), for example: *.mywebsite.com.
  5. After adding the required domains, click Validate/Create to save your configuration.

6. Finally, at the top of the page, click the pencil icon next to your project title to modify the domain URL if needed.

Step 3 – Check for CORS policy errors

To ensure the Graphic Editor functions correctly, check your browser’s console for any CORS (Cross-Origin Resource Sharing) policy errors.

  1. Open the console using the following shortcuts:
  • On Mac: ⌘ + Option + J
  • On Windows: Ctrl + Shift + J

2. Look for any CORS-related errors in red, as shown in the screenshot below.

If you encounter CORS policy issues, you will need to whitelist the following Kameleoon domains and subdomains in your server’s CORS policy configuration:

  • *.kameleoon.com
  • *.kameleoon.eu
  • *.kameleoon.io

Follow the steps in this documentation

Scenario 2: The Graphic editor loads for some users and not for others

Step 1 – Clear cache

You may be viewing an outdated version of your website, which could prevent the Graphic editor from loading. To resolve this, follow these steps:

Option 1: Empty your cache

  1. Open the browser inspector using the shortcut:
    • On Mac: ⌘ + Option + I
    • On Windows: Ctrl + Shift + C
  2. Right-click on the browser’s refresh button and select Empty cache and hard reload.

Once completed, try launching the Graphic editor again.

Option 2: Use private browsing (incognito mode)

You can also try opening the Graphic editor in a private browsing window to ensure that no cached files are interfering.

Step 2 – Allow third-party cookies

Make sure that your browser allows third-party cookies, as they are essential for the Graphic editor to work properly.

To enable third-party cookies:

  1. Go to your browser’s Settings.
  2. Navigate to Privacy & Security.
  3. Locate the Third-party Cookies section and ensure they are allowed.

Step 3 – Disable ad blockers (e.g., Adblock)

Ad blockers can sometimes interfere with the proper functioning of the Graphic editor. To resolve this issue, you can try one of these solutions:

  • Disable your ad blocker and relaunch the Graphic editor.
  • Open a private browsing window where the ad blocker might not be active and relaunch the Graphic editor.
  • Try using another browser without ad blockers (e.g., Firefox) and see if the Graphic editor works there.

Step 4 – Switch to a different Wi-Fi network

If the Graphic editor still won’t launch, there could be network-related issues. Try connecting to a different Wi-Fi network and relaunch the editor to rule out network problems.

Step 5 – Use the Chrome Dev browser

The Chrome Dev browser is often more compatible with tools like the Kameleoon Graphic editor. If you’re facing issues with the standard Chrome browser, switch to Chrome Dev.

Step 6 – Install the Graphic Editor extension

Installing the Kameleoon Graphic Editor extension can help bypass common errors, such as CORS policy issues, and improve the editor’s loading performance.