we are trying to setup a background image for our universal login page but encounter an error.
What have we done: We specify a valid, >2000px background image url in the branding page (“update branding theme”.
What happens: While the preview looks fine, once we publish it, the published login screen falls back to the background color and does not show the image.
What we’ve tried: Leaving the background color empty (resulting in an error on save saying the value must conform to the regex starting with #…) or setting it to a 8-dig transparent color, which didn’t work either. We are aware of other community posts #1, #2, #3, #4 and none of them helped us resolve the issue. @nathan.jenkins
We are surprised that such a seemingly easy configuration already took us plenty of time and appreciate any help – thank you in advance.
If the preview looks correct but the live site does not, we should look at three primary culprits:
Experience Toggle: Your tenant might still be set to the “Classic” Universal Login experience. The Branding Theme editor primarily targets the New Universal Login experience.
Template Overrides: If you have previously customized the HTML of your login page using the “Custom Login Page” toggle or the Liquid template API, these manual overrides often take precedence over the no-code Branding Theme settings.
Content Security Policy (CSP): While less common for images hosted on standard CDNs, if your image URL is from a private or restricted domain, the browser might block the request on the live site even if the dashboard (which has different security headers) displays it.
To ensure your background image displays correctly, please follow these steps:
1. Verify New Universal Login is Active
The Branding Theme settings only apply to the New Universal Login experience.
Navigate to Settings > Universal Login.
Ensure the New experience is selected and saved.
2. Check for Page Template Overrides
If you have used the Management API or the Dashboard to set a custom HTML template, it will ignore the “Background Image” field in the Branding section.
Go to Branding > Universal Login.
Look at the Advanced Options or the Login tab.
If the “Customize Login Page” toggle is ON, the Branding Theme will not apply. To use the background image setting from the UI, you should turn this off (be sure to back up any custom code first).
If you have any further questions, please don’t hesitate to ask.