Knowledgebase

Mixed Content in CSS and JavaScript Files Print

  • sslcertificateshttps, plugins, themes, caching, https, troubleshooting, database, security
  • 0

Harder to find because the URL is inside a file rather than in the database.

HOW IT HAPPENS

A stylesheet referencing a background image with an absolute http URL A script loading another resource over http A font file referenced insecurely

FINDING IT

The console names the offending resource URL, but not always which file requested it. The Network tab shows the initiator for each request, which identifies the file.

FIXING IT

  1. Locate the file, usually in your theme or a plugin folder.
  2. Edit it and change http:// to https://, or make the URL relative.
  3. Clear caches.

IF IT IS IN A PLUGIN OR THEME FILE

Editing it means the change is lost on update. Either use a child theme, or report it to the developer and use a temporary fix meanwhile.

PROTOCOL-RELATIVE URLS

Writing //example.com/file.js instead of http://example.com/file.js makes the browser use whatever scheme the page used. This is now discouraged in favour of explicit https, but it works.

MINIFIED AND COMBINED FILES

If your caching plugin combines files, clear its cache after editing the source, or you keep serving the old combined version.


Was this answer helpful?
Back

Are you happy with your experience? Leave us a review on Trustpilot.


Trustpilot