Wondering how to fix Mixed Content Error in PrestaShop? We can help you.

Often customers using PrestaShop report to us that they get mixed content while loading their PrestaShop.

Generally, mixed content warnings happen when a site’s content loads through a mix of HTTP and HTTPS connections.

Here at Bobcares, we handle requests from our customers to fix similar errors as a part of our Server Management Services. Today we will see how our Support Engineers fix this for our customers.

What causes Mixed Content Error in PrestaShop?

Before going into the steps for fixing the error we will see what causes this error.

When a browser detects mixed content, it will alert the user and potentially block the content.

Usually, the initial HTML loads via HTTPS, and then various content resources loads through HTTP.

Cause for this error:

The mixed content warnings are seen on sites with heavy use of site assets especially external ones like images, media files, JavaScript, and even CSS.

Following are the two primary reasons:

1. URLs to those files are hardcoded in the site
2. Default configurations load these assets over HTTP

However, when a site gets updated to HTTPS those paths will still be linked to the HTTP version.

In the site’s code, we can see that the absolute URL path is set, instead of relative paths for images, CSS, or JavaScript files.

Absolute path:

Relative path:

How to fix mixed content Error in PrestaShop?

Following are the steps to fix this PrestaShop error:

1. First, we must make our PrestaShop website use HTTPS.

2. This can be done by clicking Configure.

3. From there go to Shop Parameters and take General.

4. Now  Enable SSL on all pages:

The website will use HTTPS from here on.

In case if we still see any Mixed content on the website, we can add the following code .htaccess file:

Header always set Content-Security-Policy: upgrade-insecure-requests

This will also force all the mixed content to use HTTPS.

[Need assistance? We can help you]

Conclusion

In short, we saw how our Support Techs fix Mixed Content Error in PrestaShop for our customers.