Host Images of WordPress Blog in a Subdomain for Better Speed

May 28th, 2010 Tanmay

In some previous articles, I’ve described about how to reduce the page load time of your WordPress blog [ 1. Speed Up Your WordPress Blog By Improving Page Load Time 2. Install Contact Page in WordPress Blog Without Any Plugin 3. Reduce Page Load Time Installing Tweetmeme Retweet Button Manually ] .  Another issue is still yet to discuss that effectively participate in your page performance. By default the images of your site are hosted in the same domain. This slow downs your page speed.

Also read: How to Add Extra Widget Section In WordPress Blog.

Because, almost all the browsers create maximum two-four connections when downloading a page from the web server. So if your pages contain more than one images then it is wise to host those images in another domain so that the browser can download the images in parallel with your main domain.

WordPress does not support hosting images in different domain. But fortunately, it supports and allows you to host images in a subdomain. This article is about how to host your website post images in a subdomain along with the old images that were hosted in the main domain.

Create a Subdomain for your site

In order to get your subdomain you’ve to log-in to your domain control panel.

Point to Subdomains and create your subdoamain, provided your domain resides under /public_html/.

Note: The facility depends on your hosting provider. So if you are unable to create a subdomain then contact your hosting provider.

Change default image  uploading folder in WordPress

This step involves in setting WordPress to change the default uploading folder for the post images. log-in to your WordPress dashboard. Click on “Miscellaneous” under “Settings” from left side of the dashboard.

Fill up the fields as follows:

Store uploads in this folder : images

Full URL path to files : http://images.yourdomain.com

Click on “Save Changes”. Now whenever you will upload any image to your post, the images will be uploaded in the subdomain http://images.yourdomain.com.

Update the old post images location

You’ve just changed the upload location of your post images. So the images of the new posts will be uploaded in the subdomain. But what about the old post images? Changing the location of all the old images one by one is a stupid job. So at first download all the folders containing the images under /public_html/wp-content/uploads/ from your server.

Upload all those folders in the folder /public_html/images/.

Now you have to execute a simple SQL query on your database. You can do this from the phpMyAdmin in your domain control panel.

Click on phpMyAdmin > select your database from the left side > click on the “SQL” tab.

Now put the following query in the box

UPDATE wp_posts SET post_content = REPLACE(post_content,'http://www.yourdomain.com/wp-content/uploads/','http://images.yourdomain.com/')

Click on “GO”. This query will replace “http://www.yourdomain.com/wp-content/uploads/”  with “http://images.yourdomain.com/” in all the image location url.

To update the images links in the media library run the following sql command

UPDATE wp_posts SET guid = REPLACE(guid,'http://www.yourdomain.com/wp-content/uploads/','http://images.yourdomain.com/')

Redirect the old images link to to subdomain

You have completed all the task with your site and database. But Google has crawled and indexed your old images. So redirect the old image urls to the new image urls to let Google know that those images are same.

To do so ad the following line in your .htaccess file

RedirectMatch 301 ^/wp-content/uploads/(.*)$ http://images.yourdomain.com/$1

Reminder: Backup your .htaccess file before any modification.

That’s all to set your subdomain as post-images upload location. Any question is always well come. Put your feedback in the comment section.

Reader Comments

  1. this is a nice trick to reduce the load time, worth remembering :)

    June 1st, 2010 at 14:06
    • Tanmay

      Thanks Shekhar.

      June 1st, 2010 at 18:44
  2. Amy

    this is a nice trick to reduce the load time, worth remembering :)

    June 4th, 2010 at 08:32
  3. Hi Tanmay, this is a good article, and i apply it already on my website http://www.rokocountrybarak.co.cc
    By the way, can i also put my image themes in my subdomain? and what should i do in order to make everything correct. I want to do this because my theme is kind of heavy theme

    June 5th, 2010 at 21:10
  4. sorry, i forgot to say the important word: Thank you very much for the nice trick..haha

    June 5th, 2010 at 21:12
  5. Tanmay

    @Sariyanta
    Happy to know that you found our article useful. Thanks for your nice words. By the way I could not understand what you’ve wanted to do. Do you want to keep the theme in subdomain or the theme images?

    June 5th, 2010 at 22:07
  6. That is fast response, thank you, i appreciate your attention.
    What i intend to do is to move my image theme into sub domain.
    One more problem, when i try to upload an image to my subdomain, it showing something like this
    The uploaded file could not be moved to /home/xxxxxx/public_html/img/2010/06. and my subdomain is img.mydomain..
    can you help me?
    thanks for your time

    June 6th, 2010 at 02:03
  7. sorry, everything is ok now, except the image themes one

    June 6th, 2010 at 02:16
  8. one more thing, what about css and js file? do you have an explanation about this?

    June 6th, 2010 at 03:44
  9. Hi again Tanmay, i want to move all the theme in subdomain, and also i want to create another subdomain to store my script file, is that possible? if its possible then how to do it? i’ve tried googling but nothing makes sense to me, i am a newbie, so this kind of article with a complete tutorial will be very helpful.
    thank you.

    June 6th, 2010 at 05:12
  10. Tanmay

    @Sariyanta,
    No, you can’t upload the theme in a subdomain. But obviously you can move some theme templates in the subdomain and call them properly from your main theme templates. The same can be applied for the css and javascript templates.

    June 6th, 2010 at 10:37
  11. Okay, thats sounds good, so now i want to host my css and js in my sub domain, how should i call it? which file should i edit? sorry i’m newbie and asking so much question

    June 7th, 2010 at 02:31
  12. Tanmay

    Put the following
    link rel=”stylesheet” href=”your style-sheet location” type=”text/css” media=”screen” />
    replacing the existing one in the header.php.
    Similarly, apply that for javascripts location in that same template header.php.

    Never mind about that. Feel free to ask any question. We are happy to help you. You can subscribe to our RSS feed or Daily news letters from the top of the site. Keep coming.

    June 7th, 2010 at 10:15
  13. BTW I use picasa, Google has the fastest server :)

    June 7th, 2010 at 11:00
  14. Tanmay

    @Shekhar
    Frankly, I never tried picasa. I think saving assets in own server is always trusty. Thanks for your comment.

    June 7th, 2010 at 11:11
  15. Nice tutorial! I’m going to migrate my old blog to the new one. It helps me to make it easier.

    June 7th, 2010 at 12:53
    • Tanmay

      @Gojeg,
      Thaks. Keep reading our tutorials.

      June 7th, 2010 at 13:15
  16. Really interesting post. I have only just started using WP3 Cache to try and improve my page speed due to sudden increase in traffic however, if that doesn’t turn out well, I will give your images sub-domain suggestion a try and feedback to you.

    June 7th, 2010 at 14:11
    • Tanmay

      @Jay,
      Thanks for your appreciation.

      June 7th, 2010 at 23:38
  17. Nice, really good tutorial thanks a lot!

    June 25th, 2010 at 02:44
    • @Swapnil: Thank you for your appreciation.

      June 25th, 2010 at 15:58
  18. Wonder how this will work on a Multi-Network site using JJJ’s plugin…

    http://wordpress.org/extend/plugins/wp-multi-network/

    Think I’ll test it on the dummy network.

    July 1st, 2010 at 16:15
  19. @Eddi Hughes: Frankly, I didn’t test in Multi-network site. But hope it will work there properly. Feel free to let us know after testing in your dummy network. Thanks for sharing.

    July 1st, 2010 at 18:22
  20. xyzzy

    any idea how to do this for WPMU (WP 3 Network install)?

    July 4th, 2010 at 01:24
  21. lemmekillmister

    Hi Tanmay,

    I have implemented this subdomain and the CDN on a site that i built but right now, i am having a problem with the https.
    When the site is visited through https, i have all my images and javascripts pointing to http://images.demi.com/web/images/x.gif.

    The site loads but with an alert in IE asking for user confirmation because it has both secure and unsecure data on the web page.

    My question to you would be , is there an easy way to get around this problem and let the browser use https when it is https and http otherwise.. ( a relative url something starting with images.demi.com ,without specifying the entire path starting with http)

    I tried this and it does not work
    <img src="images.demi.com/web/images/x.gif" …
    but this works with http
    <img src="http://images.demi.com/web/images/x.gif" …

    Any help is really appreciated. Thanks in advance
    Lemme

    July 17th, 2010 at 21:26
  22. Tanmay

    @Lemmekillmis: Thanks for putting your idea here. By the way, I don’t know even if WordPress supports both http and https at the same address. But I’ll make a research on it. Thanks again for sharing. Hope I can help you on this matter.

    July 17th, 2010 at 23:48
  23. Tanmay -

    Thank you for your post! I was actually searching for another topic and discovered this. I think that I will implement this on a less important site to ensure I understand everything. Once I do, I will implement on my main site, http://www.AllAboutGratitude.com .

    Is there anyway to benchmark before and after load times (easily)? I have found that some plug-ins are the real culprits of degradation of page load times so I have deleted them. I should probably delete a couple still!

    Again, thank you. Sorry for the long comments.

    Be Well.
    Paul.

    August 9th, 2010 at 17:44
  24. Hi how to do this in wordpress 3

    August 18th, 2010 at 16:21
    • Tanmay

      The procedure for WP 3 is same as mentioned in this post. Follow the instructions and let me know if any problem arises.

      August 19th, 2010 at 18:35