Welcome to this installment of Bloggy Thursdays, where I share with my fellow bloggers tips and tutorials to maximize and better your blog. While I do not consider myself an expert, I do like to think that after 10+ years of blogging — in addition to my technical knowledge — I know more than the average blogger when it comes to making your blog more appealing to readers.

Do you have any comments, questions, or topics you’d like to see covered here? Please send me a message via my contact form. Enjoy!

What is hotlinking, and why is it bad?

Hotlinking occurs when other sites link directly to the files (usually images) hosted on your site from their own blog, message board posts, and such.

While there are legitimate uses of hotlinking such as YouTube videos, the problem with unauthorized hotlinking is that it is essentially bandwidth theft. Hotlinking increases your server load — especially if the hotlinked image was posted on a popular website — and decreases the loading speed of your own site.

Additionally, if you use original images for your blog (e.g., you are a photographer or an illustrator), hotlinking can be especially annoying because in almost all cases, the person who hotlinks does so without obtaining permission first.

Luckily, there are different ways that bloggers can prevent hotlinking of their images.

Option 1: Edit your .htaccess file

The first, and probably the most difficult method, is to edit your .htaccess file. To find out if you already have an .htaccess file, navigate to your blog’s root directory using an FTP client and simply look for it. (Note: you may need to select an option that allows you to view hidden files first.) If you don’t have one, you can easily create one by using a text editor to create a blank document, naming it .htaccess, and uploading it to your blog’s root directory.

Important: Before making any changes to an existing .htaccess file, be sure to save a copy of it first!

The next step is to copy and paste the following to your .htaccess file (if there’s already stuff on your .htaccess file, add it to the bottom of the file):

RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yourdomain.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?anotherdomain.com/.*$ [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ http://www.yourdomain.com/hotlink.gif [NC,R,L]

Now this is where you substitute what is on the code above with your own information:

Lines 3 and 4 are specifying which domains should be exempt from your hotlinking rule. So you want to replace the words in blue with your own domain (don’t include the www because that’s already included in the code).

Then, you want to replace the words in orange with any other domains that should be able to hotlink to your images. This should include feed aggregators like FeedBurner. If you have more than one domain on this list, simply copy & paste the same line, replacing the orange URL with your desired domains.

The words in pink are stating which file extensions should be included in your hotlinking rule. Most people will not need to edit this part, but feel free to delete and add to it as you wish.

Lastly, the words in green is a URL to an image that should be displayed when someone tries to (unsuccessfully) hotlink to your site. For example, the graphic that I use for my hotlinked images is:

Alternatively, if you just want an error 403 Forbidden instead of an image, you can replace the last line with the following code:

RewriteRule \.(jpg|jpeg|png|gif)$ – [F]

So, using all the rules above, this is what I have included in my .htaccess file:

RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?geekinheels.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?feedburner.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?feeds2.feedburner.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yahoo.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?msn.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?bing.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?facebook.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?pinterest.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?bloglines.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?feedly.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?netvibes.com/.*$ [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ http://www.geekinheels.com/images/hotlinking.gif [NC,R,L]

Notice that I have included all other sites I would like to allow hotlinking back to my blog, such as Facebook and Pinterest. Can you think of any other sites I should add to this list?

Option 2: Use cPanel’s Built-In Hotlink Protection

This next option is much simpler than using .htaccess, but it has two drawbacks:

1. You have to host your blog with a company that gives you access to cPanel
2. You have a bit less control

If you do have access to your cPanel (the URL to your cPanel is almost always yourwebsite.com/cpanel), navigate on over to the “Security” section and click on the “HotLink Protection” icon.

From there, you need to enable hotlink protection by clicking on the “Enable” button at the top of the page, fill in the fields as directed, and hit the “Submit” button at the bottom. You can see that if you carefully compare this method and the .htaccess method above, there are definite similarities.

And, because the full list of URLs I’ve used is not viewable in the above screenshot:

http(s)?://(www\.)?bing.com
http(s)?://(www\.)?bloglines.com
http(s)?://(www\.)?facebook.com
http(s)?://(www\.)?feedburner.com
http(s)?://(www\.)?feedly.com
http(s)?://(www\.)?feeds2.feedburner.com
http(s)?://(www\.)?geekinheels.com
http(s)?://(www\.)?google.com
http(s)?://(www\.)?msn.com
http(s)?://(www\.)?netvibes.com
http(s)?://(www\.)?pinterest.com
http(s)?://(www\.)?yahoo.com

Option 3: Use a hotlink protection plugin

Once again, this is where WordPress comes in handy. Just doing a quick search for “hotlink” in the WordPress Plugins Directory returns several plugins that can help you achieve what I have outlined in options 1 and 2. The three most popular ones seem to be:

• Automatic Image Hotlink Protection
• Configurable Hotlink Protection
• PictPocket

Please keep in mind that I have not tested these plugins myself, so please use them at your own risk.

Additional Information

The final step in setting up hotlink protection is to test it. You can do that by visiting one of many sites that allow this, such as http://www.htaccesstools.com/test-hotlink-protection/

If you do not run a self-hosted blog, there’s a good chance that you do not need to worry about bandwidth theft since most platforms like WordPress.com and Blogger do not place bandwidth limitations.

However, if you would still like to keep the media on your blog accessible via your blog only, you can host the files in a separate file hosting service and change its privacy settings accordingly. For example, Blogger users can set their blog media folder in Picasa to private. Another great way to help discourage hotlinking — as well as intellectual property theft — is to watermark your images.

 I hope that was helpful and informative. Please let me know if you have any questions!

A few years ago, J casually said to me, “You know, you should really make your blog more mobile device friendly.”

“But that might ruin the design! And you know how hard I worked on it. Besides, less than 1% of my visitors are using a mobile device when they browse on over.”

Did I mention that J is a software engineer and tester? That he not only once worked for the big G, he is always up-to-date (and most of the times, ahead of the curve) on the latest web trends and companies — e.g., signed up for Yelp and Twitter long before anyone else I knew even heard of them, correctly predicting that they would “blow up” — and is the go-to guy in our social circle for any web/tech-related questions?

So of course, being his wife, I completely ignored his advice.

Flash forward to now. “Responsive” is currently the hottest word in web design. Web Design Ledger predicts:

Eventually, we’ll all stop talking about responsive web design – not because it will go away, but because it will become what’s expected.

And wouldn’t you know it? Currently, about 20% of my blog’s visitors hail from a mobile device.

So what does J do when I tell him that I’m thinking about a more responsive design for my blog?

“Responsive web design? Isn’t that an old concept?”  

I hate it when he’s right.

How responsive web design should work — see how the content shifts
depending on what type of device you are using to view the website?
(image source)

So, in order to keep this blog current and more user-friendly to those who visit using tablets or mobile phones —

And because I’m already hankering for a change after just seven months with this current design —

I have decided that a site redesign is in order.

I want to get this done as quickly as possible (i.e., within the next month) before J’s parents go back to Hong Kong and I will have no help with the two kids.

And here is where YOU, the readers, can help!

There are currently two logistics to this redesign I have not yet quite figured out.

The first: I am seriously thinking of displaying partial posts for the front page of the blog. The reason for this is because my posts tend to be long, and/or feature large or multiple images which significantly slow down the loading speed of the site. Having partial posts on the front page will not only ensure faster loading time, but will also allow users to more easily scroll down and see additional content.

However, I personally hate it when the sites I visit do this because I would much rather see everything on one page.

What do you think? Do you prefer partial posts on the
front page, or full posts as I have now? Please vote below!

(Please keep in mind that my RSS feeds will not be affected by this change. Subscribers will still be able to see full posts when reading from Google Reader or other RSS feed aggregators.)

 Loading ...

The second issue involves the logo. Although I have extensive experience with helping others with their logos and branding, designing a logo is not my strong suit. And I strongly believe that a good logo is important to any brand.

I also believe that a good logo can help me with the redesign of this site by providing a certain “look and feel” and pointing me in the right direction.

So I have decided to make the investment by hiring someone to design a new logo for Geek in Heels.

I have already posted an ad on oDesk, but I was wondering..

Are you, or someone you know, interested in
designing a logo for Geek in Heels? 

Since I am short on cash, I can only pay the designer $100 USD. However, I can also offer on top of that a full year’s 160×100 or 160×200 (your choice) sidebar banner ad for FREE. You can look at my site stats on my sponsorships page.

My only requirements are that the applicants should have examples of logos they have designed in the past, and that the final logo should be provided to me in EPS format.

If you are interested, please leave a comment to this post, or shoot me a message via my contact form.

As always, thanks for reading, and I can’t wait to unveil to my readers my new logo and site redesign!

Welcome to this installment of Bloggy Thursdays, where I share with my fellow bloggers tips and tutorials to maximize and better your blog. While I do not consider myself an expert, I do like to think that after 10+ years of blogging — in addition to my technical knowledge — I know more than the average blogger when it comes to making your blog more appealing to readers.

Do you have any comments, questions, or topics you’d like to see covered here? Please send me a message via my contact form. Enjoy!

While doing some research for today’s Bloggy Thursdays, I stumbled upon an interesting piece of information: LinkWithin, one of the most popular “Related Links” widgets — and certainly a tool that many of my blogger friends use — is not recommended for SEO purposes.

Why? Essentially, LinkWithin is a parasitic widget. The way it works is by redirecting your traffic through their own site, effectively linking to themselves from all over your site and then 301 directing the user back to your site, thus stealing your internal link juice.

(To find out why internal links are important in SEO, check out “The Importance of Internal Linking” at Dragonfly SEO.)

Some of the websites that wrote about this issue stated that LinkWithin has started to do away with this practice, but I still saw it in effect on this blog, under the “Referrers” tab of my stats page:

See all the views from “widget3.linkwithin.com” and similar?

Aside from SEO issues, I also did not like the fact that LinkWithin’s extra step of redirecting traffic may cause visitors additional delays.

So what’s a blogger to do?

If you are using WordPress, one easy step is to install the popular Yet Another Related Posts Plugin (YARPP). However, the biggest drawback to this plugin is that while it does provide templates, it can still be difficult to configure and customize the output, especially if you aren’t familiar with PHP and/or CSS.

Another good option is Outbrain, which is used by some of the most popular sites on the web, but this service requires that you receive more than 500,000 visitors a month.

This is when I came across nRelate’s Related Content widget.

(And for non-WordPress bloggers, nRelate is also available for Blogger and Tumblr! They are also in the process of rolling out versions for Drupal, Typepad, and others!)

Installing nRelate is as simple as installing any other WordPress plugin: just download, install, and activate. And unlike LinkWithin, nRelate has an extensive options panel built right into WordPress’s admin.

And here is where you can experience the best part about nRelate — all the customizations! You can:

• change the size of your thumbnails
• easily change the title for the related content box
• specify a default image for when the post does not have any images
• choose your level of relevancy
• choose to exclude certain categories
• …and much, much more!

You can also choose from a list of seven different styles for your thumbnails, which you can further customize via CSS, or create a completely customized style yourself.

nRelate also has an optional advertisement program that can earn you some money by inserting custom ad spaces within your related content. The best part is that it allows you to configure not just how many ad spaces to include, but also the location such as before or after your own related post content, or have the location randomized. (I will not be employing this at the time, but I may consider it in the future.)

Another great product that nRelate offers is its Most Popular widget, which does exactly what its name implies by displaying thumbnails (or even just text links) just as its Related Content widget does.

nRelate needs at least 2 hours to index your site and for its widget to start appearing — and since I currently have 1,625 posts on this blog  — it hasn’t started to show up on my site yet. However, you can see an example via their site, or just by Googling “nRelate examples.”

If what I have read online is true, the Related Content widget will start working flawlessly as soon as nRelate finishes indexing my site. I will definitely post a follow-up to this post if I find nRelate unsatisfactory in any way!

Welcome to this installment of Bloggy Thursdays, where I share with my fellow bloggers tips and tutorials to maximize and better your blog. While I do not consider myself an expert, I do like to think that after 10+ years of blogging — in addition to my technical knowledge — I know more than the average blogger when it comes to making your blog more appealing to readers.

Do you have any comments, questions, or topics you’d like to see covered here? Please send me a message via my contact form. Enjoy!

I have stated in an old WordPress Plugins post that I use WP-DBManager to backup my blog.

Well, times change and so do preferences. My current backup plugin of choice is BackWPup, which, according to their site, does the following:

• Database Backup
• WordPress XML Export
• Optimize Database
• Check\Repair Database
• File Backup
• Backups in zip, tar, tar.gz, tar.bz2 format
• Store backup to: 
• Folder
• FTP Server
• Amazon S3
• Google Storage
• Microsoft Azure (Blob)
• RackSpaceCloud
• DropBox
• SugarSync
• Send Log/Backup by Email
• Multisite Support only as Network Admin

Why do I prefer BackWPup to WP-DBManager? There are two reasons:

1. It has the option to automatically back up my files to any of the various cloud servers listed above (I use Amazon S3, but I think most people prefer DropBox).
2. It backs up both your database AND files.

Let’s back up a bit here. I’m sure some of you are thinking, “But what’s the difference between your database and files? Aren’t they the same thing?”

Not necessarily. In simple terms, your database refers to your blog posts, metadata, and comments. Your files refer to everything you’ve uploaded — including pictures and other media.

Can you imagine if you believed you were diligently backing up your blog all this time, only to have something horrible happen…and discover that while all your old posts are safe, your blog theme and all the pictures you’ve uploaded over the years are gone?   I shudder just thinking about it.

As you can see in the above screenshot, I have one “Job,” which I (very creatively) named “Weekly Backup.” I have set it to run every Sunday morning at 3:00am EST — when blog traffic is usually very low so that the servers won’t get too worked up — and it is configured to back up my database and files, in addition to optimizing my database tables (optimizing your database ensures fast and smooth communication between your web server and the database).

This is all set up under my own personal preferences, of course. You can se it to run every day if you’d like, perform whichever functions, and there are even options to exclude certain folders from your backup (like plugins and themes, for example).

And if that weren’t enough, you can create multiple “Jobs” so that BackWPup performs different scheduled tasks at different times. You can even set a job not to run automatically, and only run it manually when you’d like.

Each backup location option lets you specify a maximum number of backup files, with the oldest files getting deleted first, so that your backup files do not take up too much space. (This is a great feature for people like me who use Amazon S3, because the more data we store, the more we pay!) Additionally, you can have a log get emailed to you so that you know right away if there were any errors.

I’m sure there are many other backup plugins and methods available for WordPress, but this was the first I’ve tried that actually WORKED on my humongous database and file size, in addition to it being practically effortless once set up!

Do you have other recommendations for backups? I’d love to hear them!

Welcome to the very first installment of Bloggy Thursdays, where I share with my fellow bloggers tips and tutorials to maximize and better your blog. While I do not consider myself an expert, I do like to think that after 10+ years of blogging — in addition to my technical knowledge — I know more than the average blogger when it comes to making your blog more appealing to readers.

Do you have any comments, questions, or topics you’d like to see covered here? Please send me a message via my contact form. Enjoy!

I know that I said I will not be covering content in Bloggy Thursdays, but I have decided to make an exception for this particular topic. Because not only does it cover a (small) personal pet peeve of mine, it also goes back to the basics of writing — and in this case, blogging — on the internet.

Back in 1999, right after the web really took a stronghold in American society and everyone was IM’ing and chatting away on message boards, an author by the name of Timothy Campbell created a small website called The Internet Writing Guide. (The site, unfortunately, is no longer online.)

It was not a fancy site by any means, and taking a look at it via the Internet Archive Wayback Machine, you can see how simple and unobtrusive it was.

(Did anyone else notice the use of HTML frames? Oh, the horror! )

However, this small, 8-page site quickly became a favorite reference guide for millions of internet users, especially moderators of message boards whose job was to not only keep users in check, but to remain an example of proper internet writing.

I will not be regurgitating The Internet Writing Guide here. Rather, I will take from it a few key points which I believe help tremendously with a blog’s content — points that I try my best to employ every time that I sit down to write a post.

(image source)

Now, some of the bloggers reading this may be thinking, “But I’m a blogger. I already KNOW how to write.”

Yes, you may. And you may even be an excellent writer. But what you fail to realize is that writing for academia, work, and such is usually different from writing for an online audience.

The main difference in online works is that the average reader’s attention span and concentration shorten significantly online. Not only is your content competing with other online content, it needs to deal with real-world distractions too. Additionally, the glare of a computer screen is much more tiring on the eyes than paper.

So what exactly do you need to do to combat these problems?

1. Keep it short and to the point. The Internet Writing Guide has an entire section devoted to brevity. I myself am guilty of this as I like to write verbose pieces that articulate exactly how I feel about a particular topic in the way of verbal diarrhea. (See what I did there? ) But always ask yourself — does my audience need to hear this?
2. Break up blog posts with images and/or lists. This will give the reader’s eyes and mental processing a much-needed break, especially when the post is a long one. I always try to include at least one image with each blog post for this reason. (It also doesn’t hurt that it makes the post more visually appealing too!)
3. Keep your paragraphs short. This is the small pet peeve mentioned above. I know that I’m not the only one who finds it hard to read loooong paragraphs online, especially when they are right next to each other. Once again, bear in mind that it is more difficult to read text on a screen than on paper. If you need to use long paragraphs, try to use a short paragraph — even if it consists of one brief sentence — right after it.
   Along the same line, the use of one-sentence paragraphs can really help emphasize your points.

Other tips in The Internet Writing Guide, such as proper capitalization, spelling, and grammar, is a no-brainer. And I must admit that sometimes, being polite ALL the time does not always make for good blog content. But the rest — while written with message boards in mind — are very applicable to blogging.

And if you need more tips on writing? Go check out Strunk & White’s The Elements of Style. This book should play an essential part in any writer’s arsenal. As for online sources, you can’t go wrong with ProBlogger (check out their “Writing Content” category for more focused pieces on this subject).

I know that the contents of a blog are entirely up to its author and the author can choose to write whatever and however they see fit. But I guarantee that these small tips will help your blog posts be more appealing and better understood. And if you already use these tips? Good for you!

Do you have any additional blog content tips that should be added to this post?