How to Install and Setup WP Rocket and MaxCDN in WordPress

If you have been blogging for a while, then you probably know how important it is to have a fast loading website. Small time delays can have a big impact on user-experience and seemingly small impact on the site rankings.

People don’t like to wait, and will click away after just a few seconds. So if you want to create a successful website, you really need to focus on improving the performance of your website. Increasing the website’s speed is not an easy job, there are a lot of things you can do to optimize your WordPress website, however the most effective way is to install a cache plugin. There are many cache plugins available (mostly free), in the WordPress.org repository.

For WPKube, I am not using any cache plugin as this site is hosted on WPEngine (our review). But for other WordPress sites that are hosted on shared hosting environment, I am using a paid cache plugin called WP Rocket along with a CDN service – MaxCDN.

In this post, I will show you how to install and setup WP Rocket plugin to get maximum results. Before we get started, I suggest that you check your website performance with – GTMetrix or Pingdom tools.

Here’s the screenshot of my test site (without WP-Rocket).

WP Rocket Review

WP Rocket is a premium caching plugin, created by Jean-Baptiste Marchand-Arvier, Julio Potier, and Jonathan Buttigieg. The plugin has been in the market for a little over a year now, but made its international debut in May of this year. This is the first commercial plugin in the market, which is currently dominated by free plugins.

Price starts at $39 for one website and goes up to $199 for unlimited websites, with a year of support and updates.

The plugin offers page caching, cache preloading, minification, GZIP compression, DNS Prefectching, Multisite compatibility, and CDN support. It also comes with LazyLoad option, which ensures that images are only downloaded once the image is visible in browser.

With WP Rocket, you can also export all your plugin settings to another website using the plugin’s import and export tool.

Installing and Configuring WP Rocket

WP Rocket is a very powerful plugin, but unlike other caching plugins it is not packed with a ton of options. In fact, this plugin is exactly opposite to W3 Total Cache. There are only a handful of options that you will need to configure to make it work for your site. If you are a beginner, and installing WP Rocket plugin for the first time, then please follow the steps carefully.

Before you install the plugin, you need to make sure that you uninstall all other caching plugins, for example W3 Total Cache or WP Super Cache. This needs to be done before installing WP Rocket plugin, so you don’t run into any issues upon activation.

Download and Install the plugin

Since WP Rocket is a premium plugin, the first thing you will need to do is to download a copy of the plugin from their site. Once you have downloaded the plugin files, you can install it directly from the WordPress dashboard. Under the plugins option of your dashboard, click the “Add new” button and then the “Upload plugin” button.

Go ahead, upload the plugin, and click the “Install Now” button.

Activate the plugin

After activating the plugin, you’ll get a new navigation option under the settings menu: “WP Rocket”. Unlike other premium plugins, this one doesn’t require any authentication or activation key, so you will get a very user friendly experience.

The options are very basic compared to other cashing solutions and you can easily go by without modifying any settings, however it only takes a minute to configure the plugin.

Basic Options

You will find the Basic Options page, by clicking on the “WP Rocket” menu under settings tab in you WordPress admin panel. This is page where you will configure basic options such as Lazy Load and Minification. I am going to explain every single feature below.

• Lazy Load – This will will ensure that your images are only loaded as they are about to become visible in a user’s browser. This feature is also available in a standalone plugin – Rocket Lazy Load. You should enable this feature, but make sure to uninstall any other lazy load plugin you may already have on your site.
• Minification – Minifying the CSS and Javascript files can have a significant impact on your site. It reduces the size of your static files by removing any spaces and comments it has. However, it can sometimes break theme code. You may have to adjust the settings for your theme or exclude those files from minification.
• Mobile Cache – You may already have the responsive design, but enabling Mobile Cache will ensure that your site loads as fast as it loads on your desktop (or Mac). Only enable this, if your sites get a good amount of mobile traffic – You can check that from your Analytics account.
• Logged in user cache – Normally, cache plugins doesn’t work when a user is logged in. It lets you enable caching for logged in users. This feature can be very useful if you run a multi-authors site or any other type of site that require users to sign-in.
• SSL – Lets you enable caching for pages with SSL protocol (http://).
• Clear Cache Lifespan – Define the time in which cached files are automatically cleared and renewed. By default, it is set to 24 hours.

Next, we have advanced options.

Advanced options

Normally, I would want to skip the advanced settings because the basic options are sufficient enough. But in this case, it is essential that you go through the Advanced settings page.

• Prefetch DNS Requests – Every time a user visits a website, it loads external scripts such as Google Fonts and Facebook Widgets. These scripts takes fractions to load properly in the browser. The problem here, really, is the DNS lookups involved with third party domains. Fortunately, there’s a quick fix to speed up this process – DNS Prefecting. If you need to request assets from say ajax.googleapis.com, then you can prefetch that hostname’s DNS by simply adding the domain in the Prefetch DNS Requests section. Make sure to only add assets that will be looked up on every page of your site.
• Exclude JS and CSS files – This is where you add the CSS and JS files that you want to exclude from caching. And if you are running WooCommerce and Easy Digital Downloads you should exclude the basket and checkout pages from caching.
• Deferred loading – You can add JavaScript files that will be loaded asynchronously at the same time as the page loads.

You can skip the advanced options tab, if you haven’t enabled the Minification and doesn’t want to use DNS prefetching.

CDN

WP Rocket supports all the Pull CDN providers including MaxCDN (which is what we’re using here on WPKube). Here’s the complete list of top CDN services. You should check out yourself, which one suits you well.

This section will only apply to sites that are using CDN. If you think you will be using a CDN service, then I recommend MaxCDN (use coupon “wpkube25” for 25% off).

Step 1: Create a Pull Zone in your MaxCDN dashboard. Login to your MaxCDN account, click on Zones menu in the top navigation, and then click the Create Pull Zone button.

Step 2: Next, you need to fill the details for your pull zone.

• Pull Zone Name – Simply give it a name, so you can identifiy it in your MaxCDN panel.
• Origin server URL – Enter your website url (including http://).
• Label – Description for the pull zone.

This is how it should look when you fill the details:

Once you have entered the data, click the Create button. It may take up to 3 minutes for the process to complete.

Step 3: Next step is to create a custom zone for your site. You can do this by going in to your MaxCDN dashboard. Click on the Manage button at the bottom of the dashboard, next to your pull zone that you just created. Next, click on the settings tab. Now, add a subdomain (like cdn.yourdomain.com) and click the Add button.

Step 4: The next step is setting up the CNAME alias in your DNS Zone file for your domain. You can easily ignore this step and use temporary domain, but it is highly suggested that you follow this step to create a better url structure.

If you ignore this step, your url will look like this – http://wpdeck.wpkubecom.netdna-cdn.com/wp-content/uploads/2013/11/clipper-theme.jpg.

To add the cName, login to your hosting account and click on Simple DNS Zone Editor under Domains section. Most WordPress hosting providers such as BlueHost, SiteGround, etc provide a cPanel account, where you can manage different settings of your hosting account.

On the next screen, you have to add a CNAME record with a direct link to your temporary CDN URL.

Now you will need to wait for a few minutes for your CNAME record to propagate. You can use this site – http://www.whatsmydns.net/#CNAME/ to check on your DNS Propagation.

Step 5: Once the propagation is completed, add your CDN URL into your WP Rocket Cache settings (Dashboard » Settings » WP Rocket » Cache).

See the screenshot below:

Click the Save Changes button and that’s all. You have successfully configured the MaxCDN in WordPress with WP Rocket.

Even by enabling just a few of the features of WP Rocket plugin, you should be able to speed up load times of your site. However, the plugin comes with many other options that I haven’t covered above. So I will try my best to explain them.

Tools

The tools page allows you to participate in beta program, get earlier access to new versions, clear page, and pre-load cache. You also get a clear cache button on individual posts and pages, next to publish button.

You can also import and export the settings of WP Rocket plugin from tools page.

A Frequently asked questions, video tutorials, and support page are also integrated into the plugin options page.

Final Thoughts

WP Rocket is easily becoming the most user friendly caching solutions for WordPress users.

I have been a long time user of W3 Total Cache (see our tutorial) and finally ditched it for WP Rocket. It has only been a few weeks but so far I am happy with the plugin.

Unlike other caching solutions, it doesn’t have hundreds of settings. The plugin is priced at $39 and comes with a 30-day money back guarantee if you are not happy with the results.

I hope that you found this article helpful. If you are still not sure and looking for alternatives, see our roundup on best caching plugins for WordPress. If you’re looking for a free alternative, see our article on Cache Enabler Review: The Best Free Caching Solution for WordPress.

Don’t forget to our MaxCDN coupon code “wpkube25” for 25% off.

If you have any questions, then please let me know in the comments below.