My store's login page is not displaying correctly
If your store's login page appears blank or has a broken layout for some customers, the cause is usually a script conflict rather than a VTEX platform bug.
Keywords: VTEX ID | login | SSO | blank page | broken layout | script conflict
The store's login page is rendered by the VTEX ID module and is not part of your Store Theme or FastStore code — it is redirected to from your storefront. Because it can be customized through Admin > Account Settings > Authentication and through scripts you or your agency inject via tag managers (e.g. GTM) or other third-party code, it may occasionally display incorrectly: showing a blank screen, a broken layout, or overlapping elements. This behavior is usually intermittent and hard to reproduce on demand.
Below are the troubleshooting checks and instructions you can use to identify and fix this kind of issue in your store.
| Issue | Troubleshooting instructions |
|---|---|
| The login page appears completely blank for some customers. | Reproduce the issue in an incognito session. |
| The login page layout looks broken, with overlapping elements, intermittently. | Check the browser console for script conflicts. |
| The issue happens randomly and you can't reproduce it consistently. | Compare successful and failed page loads using HAR files. |
| You're not sure whether the issue is caused by VTEX or by a custom script. | Isolate the conflicting script by blocking requests. |
| You confirmed a custom script is causing the issue. | Fix the conflicting customization. |
Solution
To understand and correct each error, see the solutions below:
Reproducing the issue in an incognito session
Reports of this issue tend to concentrate on first-time visits, such as sessions with no existing cookies or cached data for the store domain. If you can't reproduce the problem in your regular browser session, try the following:
- Open an incognito/private browsing window.
- Disable browser extensions that might interfere with the page, such as ad blockers (some ad blockers can incidentally hide the same requests that are causing the conflict, masking the bug).
- Navigate to your store's home page and then to the login page (for example, by clicking Sign in).
- Repeat the navigation a few times, since the issue is intermittent by nature and may not appear on every attempt.
Checking the browser console for script conflicts
A blank or broken login page is frequently caused by a JavaScript library being loaded more than once on the same page (for example, two different versions of jQuery), rather than by a platform bug.
- Open your browser's Developer Tools (
F12orCmd+Option+I) and go to the Console tab. - Reload the login page a few times until you reproduce the broken state.
- Look for errors indicating a duplicated or conflicting library, such as
$ is not a functionor similar jQuery/script conflict messages. - Compare the console output between a normal page load and a broken one — the broken load typically shows extra errors that don't appear otherwise.
Comparing successful and failed page loads using HAR files
Since the issue is intermittent, capturing a HAR (HTTP Archive) file for both a working and a broken page load makes it much easier to compare what's different between the two.
- Open Developer Tools and go to the Network tab.
- Make sure Preserve log is enabled.
- Reload the page until you get a normal (working) load, then export the network log as a HAR file.
- Reload the page until you reproduce the broken state, then export a second HAR file.
- Compare both files (or share them with your technical team) to identify requests, scripts, or initiators that are present only in the broken load.
Isolating the conflicting script by blocking requests
Once you have one or more suspect scripts (from the console errors or HAR comparison), confirm the root cause by blocking requests one at a time.
- Open Developer Tools and go to the Network tab.
- Right-click the suspect request and select Block request URL (or use the Network request blocking panel in Chrome DevTools).
- Reload the login page and try to reproduce the issue.
- If blocking a specific script (e.g., a jQuery file) stops the error from happening, that script is a strong candidate for the root cause.
- To confirm, unblock unrelated third-party requests one by one and keep only the suspect script blocked — if the page keeps working, you've isolated the conflict. If blocking a different, unrelated request has no effect while the original one does, that further confirms the specific script responsible.
- Check the request's Initiator column to identify what triggered it (for example, a Google Tag Manager tag loading a custom script), so you know where the customization comes from.
Fixing the conflicting customization
The VTEX ID login page itself is delivered by VTEX, but its content and any additional scripts are fully customizable through the Admin > Account Settings > Authentication settings and via tag managers or other customizations added to the store. The steps above point to a customization issue, rather than a VTEX platform issue, if the issue only happens with a specific custom script or library loaded (not a native VTEX ID request), and blocking that script consistently prevents the issue. Follow the steps below to fix the problem.
- Using the console errors, HAR files, and the specific request(s) identified as the source of the conflict, locate the script in your codebase or tag manager configuration.
- Check for duplicate library loads (e.g., two versions of jQuery loaded on the same page) or scripts that assume they're the only ones manipulating the login page's DOM.
- Remove or de-duplicate the conflicting script, or scope it so it doesn't load on or affect the login page.
- Re-test using the incognito reproduction steps above to confirm the fix.
For more on how the login page integrates with your store, see Login (SSO) and, for Store Framework/FastStore stores specifically, Integrating the VTEX Login.