WordPress + NGiNX + HHVM + HTTP/2 + Let’s Encrypt SSL = Free Super-Fast HTTPS Website

Rated A+ SSL Certificate

As you could see now this blog of mine is on HTTPS and  the SSL Certificate is 100% PCI-Compliant,  rated A+ in SSL Test. Here I will share how it’s super easy to get HTTPS for your WordPress website. It’s free and should not take more than few minutes to set up.

Google announced HTTPS is now a signal for SEO rank, and now everyone is pushing to get secured and your site need to load fast too. Few years ago you have to spend at least hundred dollar per year to get SSL certificate for your root domain, wildcard will costs even more. The price has dropped with time down a lot. Like in the year 2015 it was possible to get a simple SSL Certificate as cheap as $4 USD. But now in the year 2016, when Let’s Encrypt is out of beta, anybody could have a SSL Certificate for free.

Let’s Encrypt  is an initiative by non-profit/ public benefit corporation Internet Security Research Group (ISRG). This project is sponsored and promoted by tech-giants like Facebook, Mozilla, Google and many more companies. Learn more about them at – https://letsencrypt.org/

Here is how it looks –

Screenshot 2016-02-06 11.19.05

Faster Web:

Your site needs to load fast, for good user-experience,  and for good rank in search, and also to say up to the curve. Here in this tutorial we will use top-notch technology like HHVM, HTTP/2 and NGiNX as server.

Easy Engine:

EasyEngine is the tools that makes all of this possible for almost anybody. You don’t need to install anything manually. This is a super fantastic and very popular project by my dear friend Rahul Bansal. You could learn more about it here – EasyEngine.io

 

Get Started:

Before you decide if it’s something for you or not, I will jump into how-to actually do it. As its super easy, just look at the steps below, and then think about it.
Here is this tutorial I will not show how to setup EasyEngine, its so easy and literally just 2-3 line command.
1) Install EasyEnginehttps://easyengine.io/docs/install/

wget -qO ee rt.cx/ee && sudo bash ee

* You need to have a VPS or Dedicated or Cloud Server and I recommend using Ubuntu 14.04LTS as Operating System. You could pick any server that serves your purpose.

2) Now update your NGiNX to mainline version, as HTTP/2 is only supported after NGiNX version 1.9.5.

ee stack remove --nginx && ee stack install --nginxmainline

More about HTTP/2 with EasyEngine – https://easyengine.io/docs/http2-support/

3) Now install WordPress: Check their resource here. Here is sample command to create a WordPress site with W3 Total Cache plugin with HHVM, PageSpeed and Let’s Encrypt.

ee site create domain.com --w3tc --hhvm --pagespeed --letsencrypt

Yes, it’s literally that easy. This one line of command will install WordPress, setup Database, configure W3TC plugin, enable HHVM, PageSpeed and setup SSL too. If you want you could run basic command too

ee site create domain.com --wp --letsencrypt

 

4) For Existing site in EasyEngine: If you are already hosted in EasyEngine, just update your EasyEngine with command below

ee update

Follow the process in Step 2 to install mainline version of NGiNX. Then run following code add Let’s Encrypt SSL certificate to your site.

ee site update domain.com --letsencrypt

That’s it you site will configured with ssl.

5) Let’s Encrypt: Actually in either step 3 or 4 you have already installed Let’s Encrypt. So, the SSL certificate is already installed. Just restart nginx or you could restart all other main process with the following command.

ee stack restart

Now if you try to visit your site at http://domain.com it will automatically go tohttps://domain.com

6) Basic Configuration in WordPress: First time you visit your WordPress Dashboard after this process you will have to re-login even if you were perfectly logged in before.

Everything should work, but you might notice your browser address bar might showing https in gray color, not like the green color that is support to be.

Screenshot 2016-02-05 11.43.03

So, you have to fix few stuff before your site is full ready for serving with SSL.

a) Change site url with https//: Visit your WordPress Dashboard Setting -> Generalpage, update both WordPress Address (URL) & Site Address (URL) with https//, so if it was http://domain.com make it https://domain.com. 

*This step is important even if you manually updated your wp-config.php for site url.

b) Search & Replace: You need to search for all old domain reference from your entire WordPress database and replace with new https. You could get the “Search & Replace” plugin from WordPress.org directory. Add that plugin, you could also get this plugin from this url – https://wordpress.org/plugins/search-and-replace/

This is a very serious steps, make sure you kept  a backup of your site and specially database before running Search & Replace. You could also do a dry run first, only search, not replace, to see how much table will alter, then when you are ready run the replace. If you are handy with MySQL DB, you could do it easily from database directly too. Main thing is you have to replace all reference of http with https, from post meta to widget setting.  And as we configured your server in a way that you old image link like

http://domain.com/wp-content/uploads/2016/02/logo.png

is automatically available now in https too at

https://domain.com/wp-content/uploads/2016/02/logo.png

So, changing all reference to https is very important. But unless you kept a DB backup, this will be irreversible process. So be careful.

c) Fixing Mixed Content Warning: In your browser you could get mixed content warning. It means though your site has a valid SSL certificate, but its serving some content from http:// as well. You have to fix this issue. This depends entirely how your site is built, what kind of theme you are using or how its configured. If you get the mixed content warning and/or your site address in browser address bar is shown in gray, you need to use those tools to fix it.

Google Chrome Dev Tool: Use Google Chrome’s built in developer tools. Use the Security console to see what content is serving from http:// and causing issue.

Screenshot 2016-02-05 16.52.14

Manually look at your page source code: You could look at your source code from browser, and search for all elements served from “http://” and see what they are and how you could replace those with “https://“.

Things to Note:

# Here some themes could be built in bad way, and have some hard coded source with only http:// reference.

# You might have some javascript like analytics, ads, or whatever you added and they might be serving from http, here check if that source has a https version of the code you are using (most project should or already have https, like google analytics, or fonts).

# External link: If you have links to an external site which has only http version, don’t worry, it will not cause any issue. You get mixed content notice only for resource loads with your site, not the link just hyperlinked.

Here are few popular plugin available in WordPress.org to help you fix the mixed content issue or configuring HTTPS. But I found if you follow my steps, you would not need any other plugin, and some of those plugin are very old and not updated in long time, and gives various error.

  1. WordPress HTTPS (SSL) – https://wordpress.org/plugins/wordpress-https/

  2. SSL Insecure Content Fixer – https://wordpress.org/plugins/ssl-insecure-content-fixer/

 

7) Migration Of Already Hosted WordPress Site: This is kind of beyond scope of this post. This is not very difficult, just depends too much on how you are hosted now and your technical skill. Just give a read to EasyEngine Official guide here, its fairly simple. Visit – https://easyengine.io/docs/site-migration/

 

Important Information:

# If you are wondering what type of SSL Certificate you get with Let’s Encrypt, you get a “Domain Verified” DV certificate. Here is a demonstration about what’s the difference between DV and EV certificate.

 

Screenshot 2016-02-05 04.28.58

# Wildcard certificate, means subdomain support in Let’s Encrypt with EasyEngine is still shaky, might not work properly.

# CloudFlare Support: If your domain is hosted in CloudFlare it might not work properly with this setup. I personally liked them, but don’t use any of their service currently, but it’s entirely upto you. BTW they also offer free SSL for all their free user.

# No Dedicated IP Needed. You don’t need dedicated IP for each site for this setup.

#Automatic Renewal of Let’s Encrypt. This setup for EasyEngine takes care of renewal. They are super, so you don’t have to worry a bit.

 

Caution:

# This is a guide that teaches you how to host your website by yourself. If you are not a server savvy person, and not willing to take the risk of learning, then it’s not for you.

# This is a generalized guide for general use-case. Your server-environment, WordPress setup and lots of other factor could affect the outcome of this process. Feel free to comment below or reach me in Twitter. But there is no guaranteed support from me. I wrote this on a fine Friday evening, spending my own time, I will respond humanely in comments.

# And also don’t forget the security concern regarding self managed hosting server. EasyEngine is the best tool out there, which gives everything out of the box, but for experience user they always tweak according to their need and experience, to make the system more secure and faster.

 

Source:

https://asif.im/1974/how-to-wordpress-ssl-nginx-lets-encrypt-https-hhvm/

Resource:

  1. Article at Make.WordPress.org about HTTPS in WordPress – https://make.wordpress.org/support/user-manual/web-publishing/https-for-wordpress/

  2. Article at WPBeginner.com – How to Add SSL and HTTPS in WordPress