How To: Prevent Images from Being to Large

Have you ever had an image show up on your website which is to large, causing problems for your WordPress theme?   This is especially common for WordPress blogs that have multiple authors, where some authors or guest posters may not know how big they can make the images.

Fixing this is incredibly easy with this CSS hack!    All you need to do is take the following code and place it in your stylesheet, setting a maximum width for your images:

.postarea img {
max-width: 500px;
height: auto;

In the above code snippet, you’ll want to replace postarea with whatever div ID or CLASS your theme uses for the content.   You can also adjust the 500px to the maximum width you’d like for your images to be.

Note: This hack may not work on some versions of Internet Explorer.

  • Leave a Comment
  • Copyrighted Images – and the Ideal Solutions

    I recently wrote my first guest post for WP Hacks, which didn’t really go as smoothly as planned. I made an honest mistake about copyrighted images, which lead me to think that the readers at Hack WordPress could use a good lesson from my blunder and not fail where I did.

    I’m now ashamed to admit it – yep, I’ve used copyrighted images before. This is dangerous in the sense that your reputation can end up a bit banged up (hehe…), but can also result in legal action. Whoa, if you’re not careful what image you use, you can get sued? Yep. But in this day and age, there’s a ton of non-copyrighted images out there that are published under Creative Commons that can be used.

    The Solutions

    Not to worry – I’ve got a solution for you. My primary solution, YotoPhoto, is down at the moment (and has been for a while now) – so I ended up actually having to do some research to find some alternative resources.

    I chose to bring up image search engines instead because I feel that as bloggers, none of us have enough time to browse around entire stock image sites. For those that have time, I personally find to be a great stock image site – best of all, it’s free! Also, some photos on Flickr published under the Creative Commons license can be used freely. If you’ve got any other free stock image sites to suggest, feel free to list them in a comment.

    ReadWriteWeb’s got a great set of reviews on YotoPhoto and four other alternatives – Xcavator which searches as well as six other photo providers, everystockphoto which searches through licensed Creative Commons images, PicFindr which runs through free-to-use stock images but also Dreamstime images if you prefer, and FotoSearch which examines pay images . Click here to read the article.

    I personally also enjoy using the Photo Dropper WordPress plugin, allowing you to search through Flickr Creative Commons licensed images right from your blog’s dashboard.


    If you’re looking for stock/creative commons-licensed images to take your post content to the next level, then why not give these search engines a try? However, if you want to take advantage of image SEO, then I won’t guarantee these will make the cut for you.

    This guest post was written by Herbert of Digital Media Break, where he writes about the latest digital technology.

  • Leave a Comment
  • Increase Traffic by Choosing the Right Images for your Post

    I’ve always loved WordPress Hacks for the practical advice they offer, a recent example of which would be changing WordPress Permalinks to be more SEO-friendly. Thus, I guess you can say I was inspired to talk about my own experiences with SEO. I’ll explicitly say this right now – I’m no qualified SEO expert, and the stuff I’m about to offer you isn’t going to work 100% of the time. I pulled off many of my traffic spikes by choosing the right images for my posts. With almost every post, I try to include relevant images. Some are screenshots that I’ve created myself, but most are images I take from other places on the web. I have personally discovered that the images that bring in the most traffic are usually already found on the first page of Google Images and are perfectly timed.

    What’s so great about using images as opposed to worded listings?

    Let’s think – why the heck would you want to use images to draw people to your site in contrast to worded listings? Firstly, every blog author out there would be thinking to target words that the chances of one particular blogger (us, in this case) making it to the front page is slim to none. Also, in many cases, there are much bigger sites and blogs that target the same niche that we happen to be in which have higher PageRanks and incoming backlinks, making the chances for us to appear on the first page even slimmer. Secondly, WordPress makes it soooo easy to optimize your images for search engines that it’d be impossible for you to not try out.

    Alright – what do I have to do?

    Firstly, resolve to add maybe around 2-3 images for every post you make from now on. I’m not going to lie – this isn’t a one-image thing that you can nail, but rather like all SEO, it is a process and good habit that you can commit to. Those 2-3 images could be from a variety of search engines I suppose, but I’ve only given Google a try. Search for a picture of whatever you happen to be writing a post about, then try to select images from the first page on Google Image results, and copy the URL of the image and paste it right into WordPress’ Insert Image tool. Yep – it’s fine to do that, but you have to remember to give credit (I do this in italicized text right below my image).Whoops, a special thanks to David Robertson for pointing it out, it’s actually not fine to use just any picture on Google Images – you have to ask for the author’s permission or use an image that’s not copyrighted (when in doubt, use Yotophoto or Speaking of credit, this is where most people make the mistake when it comes to using images effectively. When inputting image options, be sure to actually input an image description in the “Image Description” field. As an amateur, I used to input the source URL into the description. As you can figure, I didn’t get any hits at all from those images. The image description is actually the text that will appear on the search listing (surprise – well it was for me!). For example, if you are using a Final Fantasy XIII image, I suggest using “Final Fantasy XIII” or “Final Fantasy XIII Character” as the description instead of a credit “Source:”, which I suggest relocating underneath the picture. A little blurb about timing – when Microsoft was bidding for Yahoo!, I had written a series of posts tackling the subject. Sensing that this would make for great SEO, I used my cunning to input Yahoo!’s logo into my posts (to be honest, it was dumb luck that time). The next morning, I was shocked to see hits flooding into my blog via that link – wow, I had learned the power of image SEO. I recently ended up writing about how Sony turned their fortunes with the PS3 around, and fitted in various games I thought would end up fixing their fortunes. Thus, I found a picture of Final Fantasy XIII, and wow – tons of hits from that one. I believe that was my most successful one ever, actually. Simple WordPress tweaks result in great Image SEO!

    Of course, the hits continued for a few days, but after the Yahoo! buzz and Final Fantasy XIII hype cooled, I didn’t receive many more hits.

    A grain of salt..

    Is there any particular reason why the images aren’t always targeted? Yep – and here’s why: from firsthand experience, when was the last time you Googled an image – and actually ended up looking at the site material? You can’t remember, right? Neither could I. Thus lies the weakness in image SEO – the traffic-to-reader conversion is very low. I’m sure that of the thousand visitors I had received, a couple would have stopped and read some of my other material, and I’m grateful that they would do that. As a relatively new blogger in the blogosphere (a mere year!), I really don’t have as much traffic as other blogs such as Engadget, Gizmodo, and Hack WordPress, so I found image SEO to be a Godsend to me. If you’re looking for ways to get more traffic, image SEO is a great way to add to statistics. But, the last thing you expected up my sleeve was…

    A little trick to counter that grain of salt

    Of course, I had to figure out a little solution to this grain of salt thing. After all, I couldn’t leave you hanging there, could I? I remembered the last time I stopped to look at a site for a random image, it had a huge header at the top with the text “If you came from Google Images, read this!” I then ended up spending a few minutes to glance at that bottom frame – I never actually returned, but they had me for a few moments there. This is a minor landing page strategy, and might not be embraced by all in the blogosphere, as it does take away from the quality of your original post. I don’t know about you, but usually I don’t have the time to change it because I am either already working on another post or because the spike is over by the time I notice (a couple of days later, usually).


    Image SEO is a great way to draw spikes of traffic to your blog, and if you’re good at it, the same people might end up coming twice on different image results and as a result, stop to read your blog. Look at it this way – even though the traffic-to-reader conversion rate might be a bit smaller than usual, at least you’re getting an extra couple of readers. And all it took was finding someone else’s image and some luck (now that I put it that way, it sounds easy, right?). Either way, if you want to give it a try, do it over a period of time – say, a month or so. That gives you around thirty (on average) posts with 2-3 images, some bound to be quality ones. That gives you around 60-90 images out there in Google Images – I believe that at least one of them will end up drawing huge amounts of traffic. How about you? Have you ever experienced a spike in traffic due to your simple image SEO? Or are you feeling a bit skeptical? I welcome everyone to comment – I’m looking for constructive criticism, but also for discussions (please, no flaming).

    Edit: Check out this followup post by Herbert Lui: Copyrighted Images and Ideal Solutions.

    This guest post was written by Herbert of Digital Media Break, where he writes about the latest digital technology.

  • Leave a Comment
  • How To: Prevent Google From Indexing Your Images

    For most of us, traffic is the driving force behind our blogs and motivation to blog. Therefore, it may seem silly to think that you would want to prevent a lot of potential traffic from Google’s image search.

    However, some bloggers like to post personal pictures, or custom make their pictures and don’t want others to take them when possible. If you fit into this category, you can easily prevent Google from indexing your pictures by placing the following code into your blog’s header file above the < /head > tag:

    <meta name="robots" content="noimageindex">

    If your site has a problem with people taking your content (including the pictures), then there is a chance Google will still index them when they index that person’s website. Another route you can take is to place images into a folder then add a disallow to your Robots.txt file. For WordPress users, this is fairly easy as by default, we already have pictures in either our Images folder of our theme, or the uploads folder (unless you’ve assigned a custom path for your images). You can add something like the following to your Robots.txt file:

    User-agent: *
    Disallow: /images/


    User-agent: *
    Disallow: /uploads/


  • Leave a Comment