Skip to content

Troubleshooting CSS Not Loading on HTTPS Pages (Mixed Content) ​

If your page looks unstyled on HTTPS URLs, your CSS files may still be loading over http://. Browsers block those requests as mixed content, so styles never load.

In this article

Verify that mixed content is the cause ​

  1. Open an affected HTTPS page in an incognito/private browser window.
  2. Open your browser Developer Tools and go to the Console or Network tab.
  3. Reload the page.
  4. Look for errors such as blocked:mixed-content or messages saying a stylesheet was loaded over HTTP and blocked.

If you see those errors, continue with the steps below.

Fix HTTP asset URLs ​

1) Confirm your WordPress site URLs use HTTPS ​

  1. In WordPress, go to Settings > General.
  2. Check both WordPress Address (URL) and Site Address (URL).
  3. Make sure both values start with https://.
  4. Save changes if you updated anything.

2) Replace hardcoded HTTP URLs in your content or settings ​

Old content, page builder data, theme settings, or plugin settings can still contain http:// asset URLs.

  1. Search for http://your-domain.com references in your content and settings.
  2. Update those references to https://your-domain.com.
  3. If your site uses a search-and-replace tool, run it carefully and back up your database first.

⚠️ Warning: Always create a full backup before running a database-wide URL replacement.

Purge all cache layers ​

After fixing URLs, clear every cache layer so visitors get fresh HTTPS assets:

  1. In WordPress admin, use the Purge whole cache option from the Super Page Cache toolbar menu.
  2. If you use additional caching/optimization plugins, purge those caches too.
  3. In Cloudflare, purge cache from your dashboard.
  4. Hard refresh your browser (or test in a fresh incognito/private window).

Verify the fix ​

  1. Reload the same HTTPS page.
  2. In Developer Tools, confirm stylesheets now load from https:// URLs.
  3. Confirm there are no new blocked:mixed-content errors.
  4. Confirm the page styling appears correctly.

If CSS is still missing ​

  • Temporarily disable other optimization plugins that combine, rewrite, or defer CSS, then test again.
  • Check your theme/plugin custom code for hardcoded http:// stylesheet links.
Was this helpful?