HTTPS Mixed Content Checker
Paste your HTML code to find insecure HTTP resources on HTTPS pages.
📖 Understanding Mixed Content and HTTPS Security
Mixed content is one of the most common security issues affecting HTTPS websites, and it can silently undermine the security you've worked to implement. When a webpage is served over a secure HTTPS connection but loads resources (images, scripts, stylesheets, fonts, or iframes) over insecure HTTP, you have a mixed content problem. This vulnerability can expose your users to man-in-the-middle attacks, compromise data integrity, and trigger security warnings that damage user trust.
Our HTTPS Mixed Content Checker scans your HTML source code to identify all external resources and classify them by protocol. Simply paste your page's HTML, and the tool instantly reveals which resources are secure, which are insecure, and which use relative URLs. This makes fixing mixed content issues fast and straightforward, helping you maintain a fully secure website that browsers trust and users feel safe visiting.
What Exactly Is Mixed Content?
When you visit a website using HTTPS (indicated by the padlock icon in your browser's address bar), you expect all communication between your browser and that website to be encrypted. However, if the HTTPS page includes resources loaded via plain HTTP, those specific requests are unencrypted and vulnerable to interception. This creates a "mixed" security situation where some content is protected and some isn't.
Types of Mixed Content
| Type | Resources Affected | Browser Behavior | Risk Level |
|---|---|---|---|
| Active Mixed Content | Scripts, stylesheets, iframes, XHR/Fetch requests, Web Workers | Blocked by default in all modern browsers | Critical - can execute code |
| Passive Mixed Content | Images, audio, video, fonts | Loaded with warnings (being phased out) | Moderate - content interception |
Why Mixed Content Matters
- Security Vulnerabilities: Attackers can intercept and modify insecure resources, potentially injecting malicious code or misleading content
- Browser Warnings: Modern browsers display "Not Secure" warnings or broken padlock icons when mixed content is detected
- Blocked Resources: Active mixed content (scripts, stylesheets) is blocked entirely, potentially breaking your website's functionality
- SEO Impact: Search engines consider HTTPS a ranking factor, and mixed content issues can negatively affect your site's perceived security
- User Trust: Security warnings erode user confidence, increasing bounce rates and reducing conversions
- Compliance Issues: Industries with data protection requirements (healthcare, finance) may have strict HTTPS enforcement policies
⚠️ Important: As of 2024, major browsers are increasingly strict about mixed content. Chrome and other browsers are moving toward blocking all mixed content, not just active content. Fixing mixed content issues is no longer optional—it's essential for a functioning, trustworthy website.
🔍 How to Use This Mixed Content Checker
Due to browser security restrictions (specifically CORS policies), web-based tools cannot directly fetch and scan live URLs. However, checking your pages for mixed content is still straightforward using the HTML source code approach that this tool provides.
Step-by-Step Instructions
- Navigate to Your Page: Open the webpage you want to check in your browser
- View Page Source: Right-click anywhere on the page and select "View Page Source" (or press Ctrl+U on Windows, Cmd+Option+U on Mac)
- Copy the HTML: Select all the HTML code (Ctrl+A or Cmd+A) and copy it (Ctrl+C or Cmd+C)
- Paste and Scan: Paste the HTML into the text area above and click "Scan for Mixed Content"
- Review Results: The tool will display all found resources, color-coded by security status
- Fix Issues: Update any HTTP resources to HTTPS or use relative URLs
Understanding the Results
| Status | Indicator | What It Means | Action Needed |
|---|---|---|---|
| Secure | ✅ Green | Resource loads over HTTPS | None - properly secured |
| Insecure | 🚫 Red | Resource loads over HTTP | Change to HTTPS immediately |
| Relative | ⚠️ Yellow | Uses relative path or protocol-relative URL | Usually safe, inherits page protocol |
| Data URI | ⚠️ Yellow | Embedded data (e.g., base64 images) | Safe - no external request made |
Resources the Tool Scans
- Images: <img src> tags - product photos, icons, graphics
- Scripts: <script src> tags - JavaScript files, analytics, widgets
- Stylesheets: <link href> tags - CSS files, fonts
- Iframes: <iframe src> tags - embedded content, videos, widgets
- Media: <video>, <audio>, <source> tags - multimedia content
- Embeds: <embed> and <object> tags - Flash, PDFs, etc.
- CSS URLs: url() references in inline styles - background images
🔧 How to Fix Mixed Content Issues
Once you've identified mixed content on your website, fixing it is usually straightforward. The approach depends on whether you control the external resource and whether it supports HTTPS.
Common Fixes for Mixed Content
| Solution | When to Use | Example |
|---|---|---|
| Update to HTTPS | Resource server supports HTTPS | Change http://cdn.example.com to https://cdn.example.com |
| Use Relative URLs | Resource on same domain | Change http://yoursite.com/img.jpg to /img.jpg |
| Host Locally | External source doesn't support HTTPS | Download resource and host on your HTTPS server |
| Use HTTPS CDN | Need external hosting with HTTPS | Migrate to Cloudflare, AWS CloudFront, etc. |
| Remove Resource | Resource is non-essential or deprecated | Remove old tracking pixels or unused widgets |
Server-Side Solutions
- Content Security Policy: Add the upgrade-insecure-requests directive to automatically upgrade HTTP requests to HTTPS
- HTTPS Redirects: Configure your server to redirect all HTTP requests to HTTPS
- HSTS Header: Implement HTTP Strict Transport Security to enforce HTTPS connections
- Search and Replace: Use database tools to bulk-update URLs in CMS content
Content Security Policy Example
Adding this meta tag to your HTML <head> tells browsers to automatically upgrade insecure requests:
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
Or configure it as an HTTP header on your server for better security:
Content-Security-Policy: upgrade-insecure-requests
💡 Pro Tip: When fixing mixed content, test thoroughly after each change. Some resources might load differently over HTTPS (different certificates, different responses), and some third-party services may require configuration changes to work with HTTPS URLs.
🔒 HTTPS Best Practices and Security
Fixing mixed content is just one aspect of proper HTTPS implementation. Following comprehensive HTTPS best practices ensures your website provides maximum security for your users.
Complete HTTPS Security Checklist
- Valid SSL Certificate: Use a trusted certificate authority (Let's Encrypt offers free certificates)
- Redirect HTTP to HTTPS: Configure 301 redirects for all HTTP URLs to their HTTPS equivalents
- Update Internal Links: Ensure all internal links use HTTPS or relative URLs
- Check Third-Party Resources: Verify all external scripts, fonts, and APIs support HTTPS
- Implement HSTS: Add Strict-Transport-Security header to enforce HTTPS
- Update Sitemaps: Ensure your XML sitemap lists HTTPS URLs
- Update Canonical Tags: Make sure canonical URLs use HTTPS
- Configure CDN: Set your CDN to serve content over HTTPS
- Update Social Media: Update your website URL on all social profiles
- Monitor Certificate Expiry: Set up alerts for certificate renewal
Testing Your HTTPS Implementation
- SSL Labs Test: Use Qualys SSL Labs to grade your SSL configuration
- Browser Developer Tools: Check the Security tab for certificate and connection details
- Mixed Content Scanner: Use this tool regularly, especially after content updates
- Security Headers: Verify HSTS, CSP, and other security headers are set correctly
❓ Frequently Asked Questions
Yes, mixed content can negatively impact your SEO in multiple ways. Google has confirmed HTTPS as a ranking signal, and mixed content issues can undermine this. Additionally, browser security warnings can increase bounce rates, and blocked resources might break functionality that affects user experience metrics. Search console may also flag mixed content as security issues. Resolving mixed content is important for both security and SEO.
Modern browsers implement security policies called CORS (Cross-Origin Resource Sharing) that prevent JavaScript on one website from fetching content from arbitrary other websites. This protects users from malicious websites that might try to access private information. The workaround is simple: view your page's source code and paste it here. This gives the same results without requiring server-side processing.
Relative URLs (like /images/logo.png or styles/main.css) are generally safe because they automatically inherit the protocol of the parent page. If your page is loaded over HTTPS, relative URLs will also use HTTPS. They're actually the recommended approach for resources on the same domain because they work regardless of whether the page is accessed via HTTP or HTTPS during development or production.
Protocol-relative URLs like //cdn.example.com/script.js were once recommended as they inherit the page's protocol (HTTP or HTTPS). However, they're now considered outdated because modern best practices assume all sites should use HTTPS. Using them on an HTTPS page works fine, but explicit https:// URLs are now preferred for clarity and to ensure resources always load securely regardless of context.
For large-scale fixes, use database search-and-replace tools (many CMSs have plugins for this), or run SQL queries to update URLs in your database. For hardcoded URLs in theme files, use your code editor's find-and-replace feature. Alternatively, implement the upgrade-insecure-requests Content Security Policy directive to have browsers automatically upgrade HTTP requests to HTTPS—though fixing the actual URLs is still recommended.
Check for mixed content whenever you make significant content or code changes, add new third-party integrations, update your CMS or theme, or migrate content from external sources. For large websites, consider setting up automated monitoring that alerts you when new mixed content issues appear. Regular monthly checks are a good practice for actively maintained sites.
Why Ads?
Ads help keep DC Tools free and running. Thank you for your support!
Found a Bug?
Help us improve! Report issues and suggestions.