Having a “secure” Shopify store sounds like a no brainer and with Shopify now supporting free SSL, it’s not only easy, but can be quite important for your business — however, making the switch over to SSL on your Shopify theme can be tricky at times.
SSL, which is short for “Secure Sockets Layer” (which I personally always thought would make a great band name), is actually the term for one of the original methods of securing communications between users and websites.
The more current technology is known as Transport Layer Security, or TLS, but the term SSL is still commonly used to refer to both the original SSL and TLS. For the sake of consistency with Shopify terminology, I’ll use the term SSL to refer to TLS, however.
When a site is secured using SSL, you’ll notice that, in the address bar of your browser the “http” that you are probably most familiar with seeing before Web addresses gains an “s” after the “p” to become “https.”
HTTP is short for “Hypertext Transfer Protocol” (also another great band name) and, in simplified form, refers to how Web servers and browsers transfer information between each other.
When the letter “s” is added to HTTP, this signals that the connection is “secure” or is being handled by SSL.
One important thing to note is that some browsers, including Google Chrome, will hide “http” in the browser bar, but typically show “https” when the site being accessed is considered secure.
The exact methodology and functionality of SSL is rather complex and there are plenty of online resources that can explain the intricate technical details of how it works, but here’s a simplified explanation:
A quick note to techies: These explanations are very simple and aren’t meant to be an exhaustive explanation of all the nuances of how SSL works.
While SSL is certainly complex, it also comes with plenty of advantages.
The most obvious one is that data such as customer login credentials and credit card numbers are encrypted during transfer over the Internet and therefore protected against a third party intercepting or viewing any of this sensitive data.
SSL also helps ensure your customers’ computers are always connecting to and communicating with genuine Shopify servers.
A second benefit of SSL is with SEO. Google, for example, has publicly acknowledged that SSL-enabled sites will receive a small ranking boost over non-SSL ones.
Keep in mind, however, that SSL is just one of numerous factors search engines will use in ranking your site, so switching over to SSL won’t necessarily give you any noticeable boost.
Finally, while Shopify has always processed checkouts over a secure “https” address (that’s the reason why checkouts always have to go through https://checkout.shopify.com), having all of your store pages being notated as secure can give customers added confidence of the safety and security of your whole store. It also illustrates that your company has a dedication for security and pays extra attention to details such as data security and integrity.
Enabling SSL in your Shopify store is easy using these steps and Shopify has also announced that it will be requiring all of its stores to use SSL soon.
While SSL is obviously a key part of ensuring that secure information such as customer names and payment information is kept secure, it can cause a few issues.
The most common issue that store owners encounter when switching on Shopify SSL is what is commonly known as a “mixed content” error.
Shopify’s SSL tool will automatically check for mixed content errors in the most common places and attempt to show you where they should be fixed, but it can require a bit of trial and error to extinguish these errors. We have a guide on things to look for when fixing SSL issues with Shopify themes here.
Mixed content issues can cause a variety of problems:
The best way to avoid theme related SSL issues is to ensure you are using the most recent version of your theme.
Shopify has been requiring theme developers to ensure themes are fully compatible with SSL for some time now, so using the most recent version will ensure you are getting one that meets these requirements.
If you’re having issues with SSL, the first thing to do is upgrade your theme. If you’re an Out of the Sandbox theme user, you can try using our Shopify theme updater app to upgrade.
The next step is to ensure that any customizations or third party apps you are using are compatible with SSL.
This is known as a “protocol agnostic” (yet another great potential band name).
For example, if you are on a page starting with “http://,” the image or other resource will be requested over “http://” — and vice-versa.
Using protocol agnostic URLs and Shopify asset tags have been required in Shopify themes for some time now and is considered best practice as it doesn’t assume that the user is accessing the site via SSL.
There are some cases, however, when protocol agnostic URLs aren’t the best option — namely in links (or <a> tags) to external sites or pages. Unless you are certain the site you’re linking to always uses “https://” as the beginning of its URLs, it’s often best to leave links as “http://” to avoid unpleasant warning messages or errors when linking to third party sites.
That said, assuming you have SSL activated on your site, there’s no harm in having your internal links start with “https://” on your pages. Another option is to remove your domain name entirely and simply start internal links with a forward slash.
For example, https://www.mystore.com/collections/my-collection/” can be simplified to just “/collections/my-collection” as Web browsers will automatically assume that “/collections/my-collection/” is stored on the same domain name as the page linking to it.