I had another one of those “learn from experience” moments yesterday. If you tried to visit this blog any time over the last 3 days, you may have found my site down. It seems that my web host has been having some problems, particularly with their databases. When I finally called them last night to complain about my sites being down for the 3rd time in the day, they told me that they discovered that some of the databases had become corrupted, and they had to be deleted. When I asked if they had backups, they told me that the backups were corrupted as well (that is, they backed up the corrupted files, over the good files).

This made me realize just how important it is to provide myself a local backup of my data bases, just in case they happen to lose my data. I would hate to lose all of my blogs due to such a “bad luck” experience. I feel bad for the people who actually did lose their databases, because it means that they lost all the information from their blogs, and will have to start over!

So, I found a great plugin that will allow you to backup your WordPress blogs. You can find it by clicking here. Not only can you download the plugin, but you can find all the instructions for installing and using the plugin. But, don’t worry, it isn’t difficult. I am setting all of my blogs up to send me a back up by email every day. That way, I will never lose more than one day of data, which means only one or two posts on any given day.

If you don’t have a way to secure a local backup of your blog databases, make sure and get it set up. You cannot really rely on any web host to protect your data, as they can have the same problems as you and I can have. If they crash their servers, and their backups get corrupted, then you lose everything! So, just in case, backup your data locally, and then make sure to back up your backup! Call it overcautious, but it is better to be safe than sorry!

I have noticed quite a few hits over the last few days from people looking for how to make a header graphic for a WordPress blog. I wrote a couple of posts a few days ago about making your header graphic a link, and that has been showing up in Google for this search query. Anyway, I thought I would take a couple of minutes and show you how to set up your own header graphic in WordPress.

The first thing that you have to do is figure out where your header graphic is stored in your theme directory. There are a couple of ways to do this. The easiest way is to load the theme, and then load your site. Right click on the header graphic and choose “View Background Image” (in Firefox). This will open the graphic up in your browser, and show you the web address of your header graphic. You can save this to your hard drive and open it up in a graphic editor if you just want to edit the graphic that is already there (as the first example I give you below). You need to figure out the size of your graphic, as you want to keep your replacement graphic the same size (it is much easier this way). You can also get the location and size of your graphic from your CSS file…just be careful when messing around with this file, as you can mess up your whole blog very quickly by changing the wrong settings (yes, I speak from experience!)

The next thing you have to decide is what kind of graphic you are going to need. Whatever you choose, it has to fit in with the theme of your blog. For example, on this blog, I only made a small change in the header graphic. Originally, it appeared like this (click on the graphics to see a larger version):

I reworked the original in my graphics program to look like this:

On another blog, I wanted a completely different look, so I created a whole new header graphic to put in the place of the original header graphic. The original header on that blog looked like this:

In its place, I created this header graphic:

When you have your new graphic ready, you have to upload it into the same file that your original header graphic was in. To be on the safe side, first rename the original graphic. I usually just add a number into the name to preserve the graphic. You don’t want to overwrite the original graphic, just in case something goes wrong and you want to revert to the original graphic.

Next, save your new graphic with the same name as the original graphic, and upload into the same folder on your server as the original graphic. You must use the same name as the original header, or you will have to edit your CSS file to call in the right file. You can use the control panel of your web space provider, or an FTP program to upload the new graphic to your server. Once uploaded, if you have done everything correctly, the graphic should show up in the header of your blog!

If you don’t have a good graphics program for editing, or creating great web graphics and headers, check out Xara. This program has a lot of functionality (comparable to Photoshop) and at a reasonable price. You can get Xara Xtreme for only $89. This is what I currently use, and I like it a lot!

Good luck getting your header graphic set up just the way you want. This can change your whole blog’s look, giving it a unique appearance, which is exactly what you are looking for!

I learned a lesson the hard way this week.  I was working on another one of my blogs, Jake’s Outdoors, and decided that it was time for a face lift.  I spent hours searching for just the right theme, and then worked on altering it to make it unique to my blog.  I got all of my advertising set up and had everything looking and working just like I wanted it.  But, I noticed that I wasn’t getting any comments, and my hits on the site were going down steadily.  Finally, I opened the site up in Internet Explorer, and found that the theme didn’t work!  It looks terrible in IE, as everything is misaligned on the page, and my 3rd column (the reason I wanted to change the theme in the first place) was not showing up right at all.

This was a valuable lesson, as much of my traffic still uses IE.  I recommend downloading Firefox as it seems to be a better browser, and has a lot more functionality, but many people are still hooked on the Microsoft product.  Maybe I will try to make the case for Firefox in another post.

This problem had a huge impact on my site.  When I went back and looked at my statistics for the site, I found that about 60% of all of my visitors were still using IE, as opposed to only about 24% using Firefox.  The rest were a mixture of browsers such as Mozilla and Safari.  I don’t know how my site appeared to these users as I don’t have Mozilla installed, and I don’t have a Mac to test Safari.

The lesson learned is that you need to make sure that your sites look good in all browsers.  Make sure that your code works the same in both Firefox and in IE, as that will be what the majority of your visitors will be using.  Most of the themes for WordPress will work fine in any browser.  Somehow, I managed to find the one out of 5000 available that won’t work.  So, I don’t recommend the “Peace” theme for WordPress.  It just doesn’t work well in IE, and I don’t like to put any kind of disclaimer at the top of my blogs, such as “works best in…” or “looks best in…”

Most sites that have themes available for download also have a link for you to test, or demo the theme.  Be sure to check the demo in both Firefox and IE so that you don’t end up wasting all the time that I have over the last week!

Yesterday, I was trying to work on the design of a couple of my blogs, and ran into the problem of trying to make my header graphic a clickable link back to my homepage. I don’t have much experience with either HTML, or editing the CSS Stylesheet, so it was not surprising that everything I tried on my own failed. Instead of having a clickable graphic, I ended up with no graphic at all.

So, I did what any rational person would do…I Googled it! I came across a great site that gave me just the information I needed, and I was happy to find out that it wasn’t going to be too difficult to do. It turns out that there are only a couple of lines of code that have to be inserted into the code to make the header a link.

This is important to do because the graphics that come in most WordPress templates leave a lot to be desired. Most of the time, you will want to create, or have created for you, a graphic that you can use to customize the template to your theme. Most of the time, this means that you will not want the default text to show on your graphic, as you will probably design that yourself as well.

First, go into your Stylesheet and look for a block of code that looks like this:

h1 {
margin: 0px;
padding-top: 5px;
padding-left: 5px;
text-align: left;
font: 220% “Book Antiqua”, “Times New Roman”, georgia, times, serif;

Now, you want to enter one line of text immediately following the “{”. Type: “display: none;”. Make sure you don’t forget the semicolon! So now, it should look something like this:

h1 {display:none;
margin: 0px;
padding-top: 5px;
padding-left: 5px;
text-align: left;
font: 220% “Book Antiqua”, “Times New Roman”, georgia, times, serif;

Remember, your code may be a little different, as this defines the text that will appear on the graphic you have created. What this line of text does is tell the text to not appear at all. So, it will still show up as the title of the page, but will not actually appear on your graphic. Make sure and save your template before moving on to the next step.

Next, you will want to go into the “header” element of your template, and make another small change. You want to look for the line of code that says:

<div id=”header”>

You want to delete that line, and insert in its place:

<div id=”header” onclick=”location.href=’http://YourDomainName.com/’;” style=”cursor: pointer;”>

Make sure to insert your own domain name in the line of text so that it will link to the right place. On one of my templates, the “header” was named the “masthead”, so if you find something like that, just change “header” to “masthead” in the line of code above. Make sure and save your template, and now your header graphic should be a clickable link.

This will improve the look and functionality of your site tremendously. You can use a template that is used all over the internet, but if you make some changes to personalize it, your blog will stand out from all the others!

Though this is pretty easy to do, you may want to go over to 1Cat.biz, and see the video that was created to walk you through the process. He also has a cool WordPress plugin that you will want to get and use…I will be adding that to my “to do list” for my blogs soon!

WARNING:  If you are new to editing templates, make sure to copy all the code from your template and paste it into a text document.  Save that document so that you can always go back, copy it into your template, and have it to revert to if anything goes wrong.  It is always better to be safe than sorry!

There are a few things that every blogger should know when it comes to publishing posts that will make their pages look better. As I have been surfing around today, there have been two things that have stood out to me. These two things will either affect the aesthetics of your page, or cut down on the readership of your page.

The first one is failing to word wrap a picture. I have seen pictures inserted in the middle of text, making it very difficult to follow. It is evident that the blogger did not know how to word wrap the text around the graphic. I am no expert on html, but I have learned a couple of things, so perhaps this will be of benefit to you.

The code for word wrapping a graphic is pretty simple…it has to be if I can do it. It is:

<img src=”http://www.imagelocation.com” align=”right” border=1 hspace=10 vspace=10>

You can adjust how closely the text comes to the graphic by increasing or decreasing the hspace and vspace variables. The higher the number, the more distance there will be between the graphic and the text. If you want to link that same graphic to another web address, then you can use this code:

<a href=”http://www.linklocationhere.com” target=_new><img src=”http://www.imagelocationhere.com” align=”right” border=1 hspace=10 vspace=10></a>

You can align the picture to the left or right by changing the “align” variable. Simply change the “right” to “left” and the graphic will be aligned to the left hand side of the page.
The second big problem that I see on a lot of pages is also addressed in the second string of code above. Notice, in the link code, after the link location close quotes, there is a “target” tag. In this case, it is “target=_new” This tells the browser to open the link in a new tab (for Mozilla, or IE 7) or a new page for a version lower than IE7. This is important because you don’t really want people navigating away from your page to visit another, and then forgetting about you. If you use this tag in all of your links, your page will stay open behind the new page, thus giving your visitor the opportunity to come back and look around a bit more. Outgoing links can be good, but you want that reader to come back and finish what you have to say, after they look at whatever you wanted to link.

Both of these design elements are important. I think a page that has pictures and graphics scattered around haphazardly looks very unprofessional. It is possible to place them exactly where you want them–exactly where they improve the look of your page. As for the links, just think how often you surfed away from a page through an outgoing link, and then never returned to the original page because it was no longer available without clicking your “back” button 20 times!

Now, let me give you a couple of examples for what I am talking about. First, notice that the graphic in this paragraph is seated neatly to the left of the paragraph, with the words wrapped around it. This makes it fit in, and become a part of the “story”. It is easy on the eyes, and looks as if it belongs (even though it has nothing really to do with the post!) As you can see, there is plenty of space at the right side of the graphic, as well as below it. It fits in nicely, and does not distract the reader from the article. If the graphic is a link, you should make it to open in a new window, as we have said before. You want to make sure that all of your graphics are assigned a place in the layout of your story, so that they can add to what you are writing. Under most circumstances, if the graphic does not add to your purpose in some way, you should just leave it out!

Now, what happens if I don’t align my graphic correctly? It stands out like a sore thumb. It detracts from the purpose of my article itself, and it causes the paragraphs to be aligned poorly. This ends up looking terrible, and makes it clear that you don’t know how to make the graphic look good. If you did, you’d never leave it like this!

Now, look at the links themselves. Here are 2 links, the first will open in a new window, and the second will open in the same window. I know, if I use the first, the reader will have to come back to my site. Even if it is only to close the window eventually, he will still have to put his eyes back on my page–which may make him read something else that I have written. Who knows what that will eventually lead to. If your site is selling different products, you may make multiple sales, where you would only have made one if your link opened in the same window!

First Link
Second Link

Now, if that second link actually led away from my site, I know you’d never be back. If I were trying to sell you something, I’d have lost the possibility of a second sale. So, remember how important these things are as you are writing your posts, and creating your websites!

The best news is that if you are using the latest version of WordPress, all of this is built into the composition tool. Simply click on the insert graphic button, and then enter your source code for the graphic location. Put in the alignment that you want, along with the border, vspace, and hspace. If you want to link the graphic, simply click on the picture to select it, then click on the “link” button. Enter the location of the link, and choose to open in a new window. Make sure and add alternate text, and then you are done. WordPress will put the graphic into your post, and add the link. You don’t even have to know any html. So, if you aren’t running WordPress for your blog, check it out!

I just updated WordPress for one of my other blogs, and found that they changed their link on the Dashboard that records incoming links from Technorati to Google Blogs. I am sure that this is due to some arrangements between the two companies, but I am not too happy with it. For one thing, Technorati is much quicker at identifying the incoming links to your blog than is Google. Right now, Google is only showing about a third of the links coming into my site that Technorati shows.

This is pretty aggravating, but it does present an opportunity to point out how valuable Technorati, or other sites like them, can be. Incoming links, especially when not “traded”, are very valuable in page ranking. One of the best things you can do to help other website owners, or bloggers out is to blog about their site, and give them a couple of links (especially if your site is of a higher page rank, and related in topic).

I am, otherwise very happy with the newest version of WordPress. There are a lot of new features that make posting a lot easier. Many of the things that had to be entered in by HTML code in previous versions can now be done by the click of a mouse. If you run WordPress and have not yet upgraded to version 2.3.3, then do so today to take advantage of the newest features. If you aren’t running WordPress, then you should check it out. I have found it to be the best blogging software out there so far. It is pretty easy to install and configure. There are also a ton of really great templates that you can use to build a unique blog (with a little tinkering with code of course!)

So, make sure to check out Technorati. Look up your own site URL, and bookmark it so that you can easily keep an eye on those valuable incoming links. Don’t forget to share the love, and pass those links on when you can. It really can make a difference!