Using an SSL certificate on your website is very important for security. It is used to create an encrypted connection to the server to protect data from prying eyes. Though it can be used across an entire site, it is most commonly used for portions of the site that use sensitive information, such as shopping cart checkout areas.
How do I know the SSL is working?
It is very important for your visitors to know when they are on a secure area of your site. When the SSL is active on the page you are viewing, they can tell by checking the address bar at the top of the browser. There should be a small lock icon in the address bar area. The format can can vary among the different browsers. Below are a few examples of different sites with different browsers.
Why does my lock disappear?
It is a common reaction to blame the SSL or host for having the certificate installed improperly. This is usually not the case. The SSL lock will only appear or display properly if all items on the page are linking securely. If there is even one insecure link on the page, the SSL will appear as broken. This means it may not display at all, or it may display differently. Again, this will vary depending on the browser you are using. Below are examples of the same browsers using a page that is partially insecure.
Almost exclusively, the cause for this is the use of absolute links for images and text links within the page code instead of relative links. If even ONE link on the page is using the absolute format it will ‘break’ an otherwise secure page. Below are descriptions of absolute and relative address linking.
Absolute Addresses
Absolute addressing for images and links include the entire domain name and the protocol, which is typically https://. For example, if you were linking image.jpg and your domain name was example.com, the link would be code as <img src=”https://example.com/image.jpg” />
Relative addresses
Relative addresses differ from absolute in that they include neither the protocol nor the domain name. Using the same image.jpg file as before, the link code to that file in would simply be <img src=”image.jpg” />.
It’s a coding issue? How do I correct it?
The solution is ‘relatively’ easy, pun intended. You will need to go through the code for your site and change all absolute links to relative ones. With hand-code sites this can be a simple, but tedious process. If your site is coded with a Content Management System such as WordPress or Drupal, they should already follow this rule on the core level, so you will want to check any links that have been included in the content addition areas such as the editors within the program where you create pages and posts. Once you or your developer has completed this process, you should be able to refresh your site and the lock should display in the correct format.
