[How-To] HTTP/2 + WordPress + NGiNX + HHVM/PHP7 + MariaDB + Let’s Encrypt SSL = Free Super-Fast HTTPS Website

HTTPS+WordPress Tutorial+PHP7-V1.1

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.

================================================================

Quick Version: Just Command

I really don’t recommend doing this, but if you think you know everything, and just want to deploy this setup, be my guest here is the command you need to run (one by one).

Log into your Ubuntu 14.04 LTS server with full root admin privilege and run the following command.

[syntax type=”html”]wget -qO ee rt.cx/ee && sudo bash ee
ee stack install –nginx
ee stack install –php7[/syntax]

Install New WordPress
[syntax type=”html”]ee site create domain.com –w3tc –php7 –pagespeed –le[/syntax]

Update Existing WordPress site installed via old EasyEngine
[syntax type=”html”]ee update
ee site update domain.com –hhvm=off
ee site update domain.com –php7 –le[/syntax]

And, you could always restart all process after any major change or issue.

[syntax type=”html”]ee stack restart[/syntax]

================================================================

Details:

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.

Rated A+ SSL Certificate

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.

* This guide has been update to enable PHP7 support, please read through the end of steps to read details about PHP7, its always better idea to read first before trying out.

1) Install EasyEngine: https://easyengine.io/docs/install/

[syntax type=”html”]wget -qO ee rt.cx/ee && sudo bash ee[/syntax]

  • 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 Install NGiNX.  Now update your NGiNX to mainline version, as HTTP/2 is only supported after NGiNX version 1.9.5.

[syntax type=”html”]ee stack install –nginx[/syntax]

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.

[syntax type=”html”]ee site create domain.com –w3tc –hhvm –pagespeed –letsencrypt[/syntax]

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

[syntax type=”html”]ee site create domain.com –wp –letsencrypt[/syntax]

 

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

[syntax type=”html”]ee update[/syntax]

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.

[syntax type=”html”]ee site update domain.com –letsencrypt[/syntax]

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.

[syntax type=”css”]ee stack restart[/syntax]

Now if you try to visit your site at http://domain.com it will automatically go to https://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 -> General page, 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

[syntax type=”html”]http://domain.com/wp-content/uploads/2016/02/logo.png[/syntax]

is automatically available now in https too at

[syntax type=”html”]https://domain.com/wp-content/uploads/2016/02/logo.png[/syntax]

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 the 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/

Update – April 26, 2017

================================================================

You dont need NGiNX mainline version anymore, by default ee will install compatible version for HTTP/2

================================================================

Update – March 14, 2016

================================================================

Get PHP7 With This Setup

PHP7 is fully compatible with this guide. I find out PHP7 perform even better than HHVM in some cases, only issue I see is it’s not compatible to all plugins and create performance lag for some site. But when it works, its way better then HHVM.

So, if you want a setup with PHP7, change your Step 3 as follows –

First, install PHP7 on the server.
[syntax type=”html”]ee stack install –php7[/syntax]

Now, let’s install WordPress with PHP7, instead of HHVM.
[syntax type=”html”]ee site create domain.com –w3tc –php7 –pagespeed –letsencrypt[/syntax]

Or, update any existing already install site with PHP7
[syntax type=”html”]ee site update domain.com –hhvm=off[/syntax]

Then run this
[syntax type=”html”]ee site update domain.com –php7[/syntax]

Read more about EasyEngine support of PHP7 here.
*Note: PHP7 implementation still does not support memcached and APC Caching, so if you are using W3 Total Cache, before the update turn off any other caching other than disk or disk enhanced caching, otherwise you will see NGINX server error 500.

================================================================

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.

 

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

Comments

8 responses to “[How-To] HTTP/2 + WordPress + NGiNX + HHVM/PHP7 + MariaDB + Let’s Encrypt SSL = Free Super-Fast HTTPS Website”

  1. Hung Nguyen Avatar
    Hung Nguyen

    ee stack install –nginxmainline not work

    1. Not required anymore. Now, default install is good enough.

  2. Ahmed Avatar

    coool, thanks a lot, I used this https://github.com/zach-adams/hgv-deploy-full

    before, however I like your modern approach

    few questions:

    PHP 7 lacks APC and memcach

    so u think it still ouperforms HHVM?

    also I kind find Varnish away from ssl support, do u think it is usefull to have?

    is there any steps to upgrade my setup https://github.com/zach-adams/hgv-deploy-full to your setup?

    I have already added let’s encrypt

    but could’t implement varnish with ssl ngix yet, as Im thinking in removing it at all.

    your advise is highly appreciated
    best.

    1. PHP 7 has OPcache built it, so don’t worry about APC. If your setup is modern, like new theme and plugins, then PHP 7 is best for you, but otherwise HHVM still out performs in some cases. I am completely against using Varnish with NGINX, its pretty pointless. NGINX could handle everything pretty fine and even far better then Varnish. And I don’t think you could migrate automatically. Better take used backup, and migrate to EasyEngine described here.

  3. This tutorial is awesome and geared towards 2016+ as most of this stuff is still either unknown to most people, or at the very least not a priority until your SERPs go down, down, down….then it may be too late to jump back in…

    Great post, my friend!

    – Ray at Kingweb.com

  4. […] Free Super-Fast HTTPS Website – Asif.im […]

  5. Nice article. I will try it for my blog. But heard that Lets Encrypt SSL is valid for 3 months?

    1. Thats the best part of this EasyEngine. If you follow the process above, it will setup a cron to run automatically to renew. Sweet, ha?

Leave a Reply

Your email address will not be published. Required fields are marked *