Tag Archives: wordpress

Optimize WordPress for Speed – In 5 simple steps

Improving the load time for a wordpress blog has lots of benefits – good user experience (faster page loads also results in more pageviews), better rankings in search engines (SEO), reduced cost (due to reduction in resource (RAM, CPU, cycles and bandwidth) usage) etc.

So, if you run a wordpress blog/website that needs a little optimization you should follow this guide. But you need root access to your server. If you’re on a shared server, then first things you should do is move to a VPS; it’s cheap, faster and more secure and you also get full control over the server environment.

I’m using Digital Ocean for this blog and I’m pretty happy with the performance (read my review on digital ocean and the article about setting up wordpress on vps server). They’ve plan starting at $5/mo, cheaper than most of the shared hosting providers. Signup using my referral link and get 2 months of free hosting – $10 credit to give it a try.

speed up wordpress

Step 1. Enable Caching

Caching static resources such as images, css, js etc on the browser helps in reducing page load time on subsequent page visits.You can enable browser caching either using a plugin or manually. If you’re using Apache, then you can skip this step as Hyper Cache will do that for you (using htaccess config).

Caching static content (browser)
Login to your server(over ssh) and type (I assume you’re using Ubuntu or any debian derivative for OS with nginx as the web server, otherwise change command accordingly) :

sudo nano /etc/nginx/sites-available/site.conf

Add these lines to enable browser caching with nginx.

Save the file (Ctrl x and y) and reload the nginx server to apply above configuration.

sudo service nginx reload

PHP caching If you’re using lots of plugin then the php code will take lots of time and resources to execute, that means server response time will be high (not a good thing). So, caching php code means – the server will send cached html instead of generating it on every single request (which is lot faster). As a result, the server response time (as well as TTFB (Time to First Byte)) will go down (that means faster page load, even on first visit). To enable php caching there are lots of ways, the most simple way is to use HyperCache plugin. (Disable browser caching or compression if you’ve already done that manually with nginx) Download HyperCache plugin for wordpress and enable/activate it. (you can do it from wordpress dashboard or by manually extracting the file on server)

Step 2. Enable Compression

Sending compressed data over the network means faster download time for pages, plus you’ll save bandwidth for server and user as well. All modern browser supports compression, so there is no reason why you shouldn’t be using it. SSH into to the server and type :

sudo nano /etc/nginx/nginx.conf

And add these lines to nginx config. (you may want to tweak few variables like compression level etc depending on your need, if you’re not sure, then just go with the default value)

Save the file (Ctrl x and y) and reload the nginx server to apply above configuration.

sudo service nginx reload

Step 3. Move JS to Footer

By default, most of the WordPress themes load javascript files in header and it causes render blocking issue. The browser will not start rendering the page until all the javascript files are downloaded. Moving those js files (jquery etc) to bottom of the page (before body tag) will have good impact on page loading time, especially if you use lots of js plugins.

To move the javascript to footer, simply download and install this plugin and clear the cache from wordpress dashboard -> Settings -> Hyper Cache page.

Step 4. Use CDN for jQuery

Using CDN for jquery has many advantages. It reduces load/bandwidth on your server, low latency for users (since the jquery will be downloaded from the CDN end point near to your user, that means faster download) and lots of other people use it, So, it may be already cached in user’s browser (best case). First you need to find out the jquery version you are using, so you can specify exact version from below.

  • For jquery : Google CDN
  • For jQuery migrate :  jQuery CDN

To use above CDN, just add these lines to your theme’s functions.php (at the end) and clear the cache (if you’re using any caching). Don’t forget to correct jquery version if required. (you can edit it using wordpress dashboard -> Appearances -> Editor but make sure you’ve already created a backup for theme files, in case anything goes wrong.)

Step 5. Image Optimization

Optimizing images is important because it’s usually the most heavy static resource on a web page. So, if you use lots of images in your blog pages/articles, then you should :

  • Optimize images before upload (use an online tool like this one : https://tinyjpg.com/). You can also use some plugins like this one. (BTW, I haven’t used them but it seems good)
  • Avoid scaling/resizing a big bulky image after page load. Scale images to the required size before you upload them or use this plugin – Imsanity
  • And you can also use imgur or Dropbox to host your images. (it will act as CDN)
speed up wordpress

How to setup wordpress on Ubuntu 12.04 Server (VPS)

It’s a step by step guide for setting up wordpress on a vanila server (e.g Digital Ocean, don’t know about it? then read Digital Ocean VPS Review) running Ubuntu 12.04 LTS (latest LTS release, recommended for server). With, most of the VPS providers, you can deploy GNU/Linux distribution from their control panel itself, after that, everything will done over the ssh connection.

setting up wordpress

Step 1. Setting up the server

ssh into the server and create a user (as it’s not a good idea to use root account).

ssh root@vps_ip_address
apt-get -y update
adduser user_name --ingroup sudo

Now, logout from the current session and login again with the user newly created above.

exit
ssh user_name@vps_ip_address

Install the web server – Apache (you could also choose nginx)

sudo apt-get install apache2

Now, create a virtual host –
In this tutorial I’ll be using nano editor (a light-weight command line editor) So, if it’s not already installed – then install it using sudo apt-get install nano.

sudo nano /etc/apache2/sites-available/example.com

and add this contents (change few things according to your need such as domain name, user_name)

If you selected nginx instead of Apache, here is a sample configuration for nginx/wordpress blog.

Then enable the virtual host,

sudo a2ensite example.com
sudo service apache2 reload

Step 2. Installing Dependencies (PHP, MySQL)

During installation process, you will be asked to provide password for MySQL root account.

sudo apt-get install mysql-server
sudo apt-get install php5 libapache2-mod-php5 php5-mysql

For image manipulation, wordpress uses php-gd library, so you need to install that as well,

sudo apt-get install php5-gd

You may have to enable rewrite mod for apache2, to do that simply type :

sudo a2enmod rewrite
sudo service apache2 restart

Step 3. Creating Database

Login with MySQL root account and create the required users and databases (you need to remember these details for wp-config.php)

mysql -u root -p
create database DBNAME;
grant all on DBNAME.* to DB_USER@localhost identified by 'password';
exit

Step 4. Installing WordPress

Download the latest version of wordpress and extract its content.

cd ~
wget http://wordpress.org/latest.tar.gz
tar -xzvf latest.tar.gz

For simplicity, you can rename the wordpress directory to something like – your domain name e.g example.com.

mv wordpress example.com

Now, you can manually edit the wp-config.php file or go through the automated installation process (just visit the URL, I assume you have setup DNS correctly, or use IP address instead).

cd example.com
nano wp-config-sample.php

Then add the database details and random strings for session tokens etc and save the file (Ctrl+x, y). Now, rename the file.

mv wp-config-sample.php wp-config.php

That’s set, you’ve successfully installed wordpress, visit the URL/IP_ADDRESS and create the admin user.

Moving your Blog ?

If you’re moving your old wordpress blog to a new server, then you also need to copy wp-contents directory (from the old one to new server, it’s the directory – that holds your images, themes and plugins). Besides that you will also have to export/import database contents. Use your server control panel or a tool like PHPMyAdmin (which is usually installed on all shared hosting providers) to export your database contents in *.sql format.

I assume you already have an exported database file (*.sql), So you can easily import it, on new server using the single command –

mysql -h localhost -u DB_USER -p DB_NAME < db_backup.sql

Note : If you have any problem during installation, then leave a comment here, we’ll try to figure it out!

blogilo in Ubuntu 11.10

Best Blogging Client for Ubuntu/Linux

If you are one of the bloggers who publishes articles too frequently then publishing directly from desktop in a few clicks may be easier than publishing from the web interface (although Web interface has evolved into lot better now a days and most of the desktop blogging client lacks even basic features, except Windows Live Writer (but we can’t change Operating System just for Live writer :) )).

On Ubuntu or other Linux distributions such as Linux Mint, Fedora, PCLinuxOS, OpenSuse etc, There are few desktop blogging softwares are available for blogging that supports Blogger, Live Journal, wordpress, wordpress (self hosted or called as Movable Type), Tumblr, Posterous etc but none of them are even little closer to Live Writer. In this post you will learn about Two great software – one a KDE blogging client called as Blogilo and the other one is ScribeFire, a plugin for Firefox, Chrome and Opera.

Blogilo : Blogging Client for Ubuntu (11.10/12.04)

blogilo in Ubuntu 11.10

Blogilo is a KDE blogging client, it works well with Gnome 3 or other Desktops. It is the most advanced blogging software in Ubuntu. it is very easy to use and supports a lot of blogging platform.

Important features of Blogilo

  • Post Preview (you can also preview in blog style – for some reason it wasn’t working for me (probably due to caching) but give it a try)
  • a good visual editor
  • Insert image from your computer or remote location (although drag ‘n’ drop style is not supported)
  • HTML editor
  • Post categories (although creating new categories is not supported right now)
  • local draft (that you can write even you’re offline)
  • permalink customization options
  • post tagging
  • time stamp modification
  • auto save (default is 5 minutes but you change it under settings)

How to install Blogilo in Ubuntu

Open terminal (Ctrl+Alt+t) and execute –

sudo apt-get install blogilo

Publishing an article with Blogilo

adding a blog in Blogilo

#1 : It’s quite simple, go to Settings -> Configure Blogs -> Blogs -> Add

#2 : Then specify the URL (address of your blog), enter the login details (username and password) and click on Auto-Configure button.

#3 : Click on New Post icon, write post and when you’re done – hit the submit button. That’s All, check out the new entry in your blog!

ScribeFire : Blogging Add on

scribefire-screenshot on Chrome (Ubuntu 11.10)

ScribeFire is a very simple and easy to use blogging tool – available as a plugin for all modern Web Browsers such as Firefox, Chrome, Opera etc. ScribeFire has a lot of cool features – including the most basic features – tagging, categories (creating new categories is also supported), Excerpt, Custom Fields, WYSIWYG editor etc. Some advanced features – including Zamanta Integration (which will allow you to get relevant meta data – such as images from Wikipedia, Flickr etc, for the posts; and it’s free), Markdown support etc. Initially it was available – only for Firefox but from its vs 4.0, it’s available for all popular browsers, and so it is platform independent!

Install ScribeFire in Ubuntu

Go to http://www.scribefire.com and click on Install Button (it should automatically detect your browser, otherwise click on individual links give below for each browser)