After installing a valid letsencypt certificate on https://www.personalzone.com I was presented with the following error in my Chrome browser which didnt make much sense given the certificate had just been installed.
To investigate I went to the developer tools security tab.
First click on settings ( 3 dots in top right of browser ) -> More tools -> Developer tools.
Then click on the security tab of the developer tools console
From here it could be seen that the browser was alerting to active mixed content and the cause was google fonts that were being pulled in via http: instead of https:
Knowing that the css for my Joomla website is included in the template in use I went to the active template and started looking in the css files
CSS files for a template can be found in the Joomla backen at extensions -> templates
and then clicking on the template in the right hand column of results.
Clicking on the template ( Jsn_mini_pro by Joomlashine in this case ) shows all the files associated with the template.
After a bit of browsing I found the following culprit in the css/styles/news.css file
To fix the issue this was changed to:
To ensure that the fonts were requested from Google via a secure connection.
Once this was done the browser was shut down and the personalzone tab was shutdown and re-opened and chrome started displaying the site as secure.
Job Done ... another problem solved.
During my research into the simple things I can do to boost the reputation and subsequently (hopefully) my search engine rankings I discovered that activating https apparently provides a minor SEO benefit . Unfortunately I also discovered that there is a cost associated with getting the SSL certificates required to set up https and that it was going to get quite expensive to set up the basic domain validated certificates for the half dozen or so websites I run. So I did what any budget conscious webmaster does and went searching for free or cheap SSL certificates.
12 months ago when I did this I found a few good cheap options such as godaddy who provide domain verified SSL certificates for under USD$10 so I signed up for them , unfortunately I wasn't able to find cheap certificates for all my websites so I only got them for the higher traffic sites. Unfortunately 12 months later certificates started to expire introductory prices were gone and renewing certificates was going to cost me hundreds of dollars so once again I wend searching on Google and found Letsencrypt.org who is providing free domain verified certificates and when I say free I mean free to set up and no ongoing recurring charges.
After investigating Letsencrypt.org I discovered that the only catch is that they run an automated service and if your hosting provider isn't set up for this automated service then you need to follow a manual process to set up, install, and renew certificates which as I discovered can be a little complicated when you are working out what you need to do.
The following tutorial documents what you need to do to manually create and install certificates provided by Letsencrypt.org.
Start by installing the Letsencyrypt software required to generate certificate keys on your local machine:
Once the software has downloaded and installed you can use the following steps to start generating certificates which will be installed on your website later.
In the request below we specify a key size of 4096 and request a certificate that can be used on adomain.com and www.adomain.com
./letsencrypt-auto certonly -a manual --rsa-key-size 4096 -d adomain.com -d www.adomain.com --debug
Enter the password for your Mac when prompted.
Note: It is only necessary to use the --debug option the first time you generate a certificate as it triggers the once off download ind installation of XCode command line tools which are required for success.
Lets encrypt will then step through the following process of verifying each of the domains specified in the command line ( adomain.com & www.adomain.com in this case ).
The user interface isn't particularly friendly so you need to watch it closely.
A message similar to the following will be displayed:
Make sure your web server displays the following content at
http://adomain.com/.well-known/acme-challenge/c95E8aJS91Akd4sORhF6YpOjtfDxp9g1sJoxhuvn1RA before continuing:
Do not press enter to continue yet
Open Cpanel for your domain in a web browser and use filemanager to create a text file in the .well-known/acme-challenge subdirectory of your main domain directory with the name and content specified in the message above:
Once the file has been put in place you can return to the terminal window containing letsencrypt and press enter.
The above process will repeat for each -d argument you have entered in the command line.
If you have put the validation files in the right directories with the right content validation will pass and you will get a message indicating that your certificate has been generated.
Once you have generated your certificate you can retrieve the keys from your local machine and install them for your website as follows:
Navigate to the SSL/TLS area of CPanel and select Install and Manage certificates
Select the domain you wish to install certificates for from the domain drop down list
Return to your terminal window and type the following to display the key information:
Cut and Paste the contents of each key into the corresponding field displayed in CPanel i.e. copy the contents of cert1.pem into the CRT field, privkey1.pem into the KEY field, and chain1.pem into the CABUNDLE field .
Hit the Install Certificate button and the job is done.
You should now be able to open a webbrowser and navigate to your website using https:// with or without www. at the front.