My site looks broken

What you are seeing

The way a page breaks points to the cause. Note which pattern you have before you start purging and toggling.

What you see	What it points to
Plain text, blue links, Times New Roman, the menu as a bullet list	The main stylesheet is not loading at all.
Layout mostly right, but menus, sliders, tabs or popups do not respond	A JavaScript error stops scripts from running.
Squares or blank spaces instead of icons	The icon font file is blocked, often by CORS, or missing.
Broken for visitors, fine when logged in (or the reverse)	A cached copy of the page is out of date.
Broken on phones only	A responsive layout or separate mobile cache problem.
Images missing but text styled	Wrong upload URLs, hotlink protection or a CDN fault.
A shared link on Facebook, LinkedIn or in a chat app shows the wrong picture or none	Missing or wrong Open Graph tags, or the platform cached an old preview. See wrong image when sharing a link.

The browser console (F12, then the Console tab) usually names the cause. The messages you are most likely to see:

• Refused to apply style from '...css' because its MIME type ('text/html') is not a supported stylesheet MIME type: the CSS address returned an HTML page instead, usually a 404 page, a login page or a firewall block.
• Mixed Content: The page at 'https://...' was loaded over HTTPS, but requested an insecure stylesheet 'http://...'. This request has been blocked: an old http:// address.
• Access to font at '...' from origin '...' has been blocked by CORS policy: the font sits on another domain that does not allow your site to use it.
• Uncaught ReferenceError: jQuery is not defined: a script ran before jQuery loaded, nearly always from deferring or combining JavaScript.
• Refused to load ... because it violates the following Content Security Policy directive: a security header is blocking the file.

Confirm it in two minutes

1. List the stylesheets the page asks for.

curl -s https://example.com/ | grep -oE 'href="[^"]+\.css[^"]*"'

Run it on your own computer’s terminal, replacing example.com with your domain. It prints the address of each CSS file in the page. Look for addresses on an old domain, a staging site, or starting with http://.

2. Test one of those files.

curl -sI CSS_FILE_URL | grep -iE '^(HTTP|content-type|content-length|server|cf-cache-status)'

Run it on your own computer. CSS_FILE_URL is one full address from check 1, ideally from your theme or page builder. Good: 200, content-type: text/css and a content-length above 0. Bad: 404 (the file is gone), 403 (a firewall or hotlink rule blocks it), content-type: text/html (an error page served in its place), or content-length: 0 (the file was written empty).

3. Compare logged in and logged out. Open the page in a private window with extensions disabled, next to your normal logged-in window. If only the private window is broken, a page cache is serving an old copy. If only your normal window is broken, suspect a browser extension.

4. See what changed in WordPress.

wp plugin list --fields=name,status,version,update_version
wp theme list --status=active --fields=name,version

Run these in an SSH terminal inside the site’s folder (the one with wp-config.php). --fields limits the columns shown. Compare versions against when the problem started: an update to the theme, builder or an optimization plugin on that day is your lead.

Most likely causes, in order

1. A stale cache pointing at deleted CSS files. Tell: check 2 returns 404 for a file with a version number or random-looking name, because an update renamed the files while the cached HTML still lists the old names. Fix: purge every cache layer together, then reload.
2. JavaScript optimization breaking script order. Tell: jQuery is not defined or $ is not a function in the console, starting after a change to defer, delay or combine settings. Fix: exclude jQuery and the broken script from deferral, or switch that feature off.
3. Page builder CSS not regenerated. Tell: builder-made sections are unstyled while theme parts look fine, after an update or migration. Fix: regenerate the builder’s CSS, as the page builder field guide shows.
4. Old URLs or mixed content after a move. Tell: check 1 shows the old domain or http://. Fix: a search and replace on the database (dry run first), then regenerate builder CSS.
5. A CDN, firewall or hotlink rule blocking files. Tell: 403s, or text/html responses for .css, .js or font files. Fix: allow those file types for your own domain and any CDN hostname.
6. Files that cannot be written. Tell: CSS files return 200 with content-length: 0, or regenerating does nothing. A full disk or wrong folder ownership stops the builder writing files. Fix: free disk space, and ask your host to correct ownership of wp-content/uploads.
7. A browser extension. Tell: broken for you, fine in a private window without extensions. Ad blockers hide elements with class names containing words like "ad", "banner" or "sponsor". Fix: rename those classes on your site.

What it usually is not

• A corrupted theme that needs reinstalling. Theme files rarely change on their own. Reinstalling wipes changes made directly to theme files.
• A hack. Defacements add content; they rarely just remove styling. Check the console first.
• Only your browser cache. If check 2 shows a bad response, it is broken for everyone, whatever your own browser shows.

What to send your host

• The page URL, and the URL of each failing file with its status code and headers from check 2.
• The console errors, copied as text.
• When it started, in UTC, and what was updated around then.
• Whether it breaks logged in, logged out, or both, and on which devices.
• Whether a CDN sits in front, and when caches were last purged.