How to create a Custom 404 using Thesis

What’s the first thing you do when you see one of these?  If you’re like me you close the page and head back to Google and try again. 

404 Error Page

This is a really important opportunity for bloggers to gain a new reader, but you only have a few seconds to capture their attention.  So why not create a custom Page Not Found (404) and encourage them to stick around.

How to create a customized 404

Recently, I went to an SEO Academy organised by The Tots 100 and led by David from Distilled UK.  We spoke about 404 error pages.  They won’t hurt your site, but can affect your bounce rate (e.g. how quickly people leave).  404s can happen if you delete or move content around or if someone else incorrectly links to your blog.  If it’s an error on your behalf then you can always try and fix it.  If it’s an incoming link from another website/blog you can contact their webmaster and ask them to update the link or you can redirect them to your custom 404 page.  I will go into redirecting in more detail in another post as this is going to be a long one.

How to find the error pages

To find a list of your 404 errors, you will need to log into your Google Webmaster Tools > Your Blog>Health>Crawl Errors>

Crawl Errors

Click on the Not found Errors

Not Found

A list will appear at the bottom of the page.  Click on one of the links>Then linked from and it will show you where the link is coming from.

Webmaster Tools

How to Create The Customised 404 Error Page

I followed the following tutorial from Deborah Ager.  It was incredibly useful and this is where you should start as well.  However, there is a few things you should note.

  1. The plugin she refers to is no longer called Thesis Open Hook but is now Open Hook by Rick Beckman if you have trouble finding it.  I did!
  2. As the plug in has been updated, so have a few of the screens.  Below are screen shots of exactly how I set mine out.

a.) On the general tab select thesis

Open Hook Settings

 

b.)  Select thesis_hook_404_title from the drop down box

 

404 Title Open Hook

 

c.) Select thesis_hook_404_content from the drop down box

 

Paste your code in here

 

3.) Lastly, do not freak out if you can’t write code.  Neither can I, but I can copy and paste.  Always remember that you can use wordpress to set up your page, just like you’d normally set out a blog post in the normal Visual Tab adding text and images, aligning, formatting etc.  Just remember to save as a draft and not publish it.

How to write HTML Code

But then remember if you click on the Text Tab you will see all of the code.  Again, do not panic, just copy it.  Then head back over to the plug in settings and paste.

Writing HTML Code Using WordPress

 

So how did you get on??  Did it work.  Do let me know if I missed anything.

Now it’s time to redirect people to your fancy smancy new error page.

How to add YouTube Videos to Facebook Landing Page

This post assumes that you’re already familiar with adding Facebook FBML pages, if not take a step back and have a look at Making the Most of your Facebook Fan Pages, which will show you how to add one to your fan page.

To tart up your Landing Page on Facebook you may want to add a video like I did, Introducing My Family, to make it more welcoming to new visitors.  For the most part it’s straight forward.  You’ll need to copy and paste the following code into your FBML page but you will need to replace the xxxxxxxxx with your youtube video id.

<fb:swf

swfbgcolor=”000000″ imgstyle=”border-width:3px; border-color:white;”

swfsrc=’http://www.youtube.com/v/xxxxxxxxxx’

imgsrc=’http://img.youtube.com/vi/xxxxxxxxxx/2.jpg’ width=’340′ height=’270′ /></fb:swf>

For example

My youtube URL is http://www.youtube.com/watch?v=b7wSuWwQQps

So, I replaced “xxxxxxxxxx” with “b7wSuWwQQps” in both places (without the quotes), resulting in:

<fb:swf

swfbgcolor=”000000″ imgstyle=”border-width:3px; border-color:white;”

swfsrc=’http://www.youtube.com/v/ b7wSuWwQQps ‘

imgsrc=’http://img.youtube.com/vi/ b7wSuWwQQps/2.jpg’ width=’340′ height=’270′ /></fb:swf>

However, you will notice that the starting image is badly distorted and there’s not much you can do about it unless you are familiar with Photobucket.  If so, upload the photo and then insert the image code.  This is what mine looked like.  I hope you can piece it together.

<fb:swf

swfbgcolor=”000000″ imgstyle=”border-width:3px; border-color:white;”

swfsrc=’http://www.youtube.com/v/b7wSuWwQQps”

imgsrc=’http://i786.photobucket.com/albums/yy145/mediocremum/ScreenHunter_01Oct302018.gif’ width=’340′ height=’270′ /></fb:swf>

Good luck!  If you get stuck please do ask and I’ll try to help.

Making the Most of Facebook Fanpages

After Reading Emily’s (@MTJAM) guest post over at Blogger.ed about Making the Most of Your Fanpage I set about trying to apply some of the suggestions and to say the least it wasn’t that easy.  Emily suggested, along with a load of other great ideas, to get a Vanity URL for your Fanpage and then to create a ‘Welcome Mat’.   So, I thought I’d summarize for you what I did in the end to save you a lot of headache.

I like many others was guilty of having a very un-dynamic Fanpage with minimal interaction.  I’d set it up to automatically import my blog posts using RSS Graffiti and then left it at that, only popping by every so often.  So, all I had in the end was a wall covered in blog posts, which wasn’t very welcoming to new visitors.

1.) How to change your Facebook Fanpage URL

Once you have 25 ‘likes’ on your page you can change your Fanpage’s URL to something more meaningful. I’ve changed mine to www.facebook.com/mediocremumsfanpage . Do give the name some thought as you can’t change it later.

2.) Creating a landing page with a welcome message

If you’re not familiar with writing HTML code like me, I find Google a godsend for helping with code.  If you want to know how to make text bold; just type in HTML for bold.  If you want to know how to make a Header search for Header HTML, then all you have to do is a bit of copying, pasting and inserting your own text.

After I managed to get a bit of text on my welcome page I got a bit carried away and decided to add a video ‘Introducing my Family’ to my Welcome Page.  In an effort to keep this post shortish, click here to see how I did it in the end.

Thanks again to Emily for all her suggestions, I’ve learned loads.

Photo Credit