In the early days of web design one of the few interactive things you could do with your readers was set up a guest book. At first this was next to impossible because almost anyone and everyone who had a website was operating on free sites like Geocities, Angelfire, or Tripod. There was no cgo access unless you paid for it, so there was no interaction beyond the simple mail form. Eventually most of them had heard the call for interaction and offered up ready made guest books. By that time it was really too late to do anything about it, blogging had been invented and was taking quick hold on sites like LiveJournal and Blogger. The world of interactivity was upon the average website owner, and we went from simple users to publishers.

The advent of blogging with threaded post and comments we respond to or at the very least should be responding to left behind the old guest book format. Users could now interact with authors directly over on subject specific ideas. Simply put the guest book was stiff, bereft of use, pushing up digital daisies, had run down the curtained screen saver, had emptied the recycle bin with ccleaner, overwritten multiple times with randomized ones and zeroes, and joined auto-starting background midi files as things Skippy should never put on a site. The guest book was and ex-webpage! That was until I figured out a use for it.

I know you are thinking this guy is ought of his bloody mind. Well I might be, but never the less I know how to make the guest book useful once again. Every blogger gets comment like ‘this is nice’ and ‘I like the post’. For those of us kind bloggers using a dofollow system this is annoying crap. However with a nofollow guest book and a move comments plugin we can preserve those comments, because some of them actually mean what they say and could give a damn about the backlink, and keep our blogs from being fodder for spammers.  The second plugin you will want if you wish to keep dofollow status is a conditional plugin that allows for conditional nofollow noindex posts and pages.

Once you have your plugin installed you can start by creating the guest book. If you are a nofollow blog the process is pretty simple, just create called guest book add a few lines of text and stick the post link in your menu. Alternately if your theme allows for comments on pages you can make it a page and it should automatically go into your navigation structure. Assuming you are a kind dofollow blogger honoring your readers comments, you are going to need to do a few things differently for the guest book to work like it should and not screw up the rest of your blog.

After activating the plugins the next thing you will want to do is make a copy of your single.php and rename it guestbook_template.php. This is the file we will edit.  Top the top of this file you will want to add the following code:

<?php
/*
Template Name: guestbook
*/
?>

Once this page is uploaded create a new page using the guestbook page template.  Say a few words of kind warning about the kind of comments that should go in posts and the kind that belong here.  Set the page to nofollow and noindex and you are ready to go.  Move your comments at will and enjoy your new found guest book.

Post 8 of 100 of Brad’s Tiny World Scribefire Challenge.

Sorry about the mess everyone.  I am making some changes around here this weekend and will looking at a few different theme designs to decide what I like and don’t.   If the theme changes on you mid read sorry for any disruption.

The current theme is the Freemium Theme by Ptah Dunbar.  Feel free to tell us what you think of it.

Brad

Update:

10-8-2008: We should be bck online here later today.  If you run a site about blogging I encourage you to check out http://www.bloggingfornoobs.com/topsites/

One of the least used and most powerful features of wordpress is the page template. The page template to make a long story short integrates non standard coding into your blog seemlessly. It is probably used most often as an archive page in free themes, but most of those free templates forget to tell their users how to use the template and therefore it goes unused. They can be used for so many other things than just an archive page though.

Darren Rowse of ProBlogger makes extensive use of page templates. If you look at the beautifully designed landing page you will find a lot of information all packed neatly into one space. If this were a standard freebie theme you wouldn’t be able to see much more than this. It is my esitmation that his home page is home.php rather than the standard index.php. (for more information see the the wordpress codex on) By making use of the home.php as a landing page in your theme you can then make a blog template that will display all of the posts in a nice chronological order. This is especially nice on multiple author blogs like ProBlogger. I know some of you are thinking isn’t this just an archive page? The answer is no. A good archive page should give you little more than a quick excerpt of the post. My preference for an archive page is nothing more a link to the posts.

Here are a few more places where I make use of page templates since I am having a hard time actually finding other good uses of them at the moment. This page makes use of the Pandora Internet Radio Widgets on a single page rather than a sidebar present throughout my blog. The contact form on the Free Online Music Articles site makes use of the Secure and Accessible PHP Contact Form by Mike Cherim & Mike Jolley. Most of the other pages on this blog utilize my standard article directory information with the automatic pulls from the blog’s information. It saves needing to write these over and over again for different sites utilizing that or similar template. Plop the info into a template and it puts in all of the correct information. Another popular or should be popular page template is the sitemap. If you look at it there is a sextion for my pages, not all of which are listed on the landing page header. You get a list of my categories with how many posts are in each category. Then there is a listing of the ten latest posts in each category. If there were mutlpile authors to this blog you would find a listing of the ten latest posts from each author as well. Notice, this page template has absoluetely nothing to do with your google xml sitemap.

In the end if you are capable of doing simple theme editing you can create a wealth of useful pages not possible in your standard blog layout. If you aren’t so handy with the coding, try looking for themes that provide you with more template oportunities. Not only wiil they create a better reading experience many of the them will improve your SEO.

The question of whether you should make theme adjustments is always a difficult one to answer. It is even be harder to do and not negatively affect your onsite readers. That being said here are my thoughts.

• Limit major theme changes to no more than once a month. Anymore than once a month clearly defines you as a noob. A complete theme change is sometimes necessary especially as you are learning, but should be done with caution.

• When building or choosing a new theme make sure that it is easily tweaked later on. Having a CSS class that will allow the quick insertion of more banners or advertising will save you countless hours of work down the road.

• Work out all changes before hand on a test blog with actual posts and pages. I prefer to run a local server using Apache, mySql, and php management on my windows PC

• Make changes when the fewest people are reading your blog and with a very clear head. A pot of coffee by your side while making these changes isn’t a bad idea either. Only make the changes to your real blog after you know they work perfectly on the test blog. Upload the entire theme under a new name if it is a variation of your current theme. If you need to switch back to your old theme quickly, because the test blog and the real blog had some difference or something got distorted in the FTP transfer having your old theme will save you a lot of time, panic, and cursing.

• Make minor tweaks as necessary, but keep them small and do them one at a time. As noted before always have a backup of your current theme or you can really screw yourself.

With these tips in mind you should be able to make changes with the smallest possible impact on your readers. Good luck and never stop improving the functionality of your blog anytime you can.

I am in no way an expert in Blogger or BlogSpot, but I am passing along to your a nice free article on how to write a theme there since I know some of you blog there.

How To Create A Blogger/Blogspot Theme by Brad

This tutorial will cover the steps needed to create your own blogger template. Many people have used blogger to run blogs and have wondered how they can make their own theme to use with it. There are a very few hard to find guides on how to do this, so I’ve decided to take up the task to help as many people as I can, create one. Incase you are skimming over the content, this article is teaching you “How to create a blogger / blogspot theme“

To create a blogger template, you will need a graphic editor (Such as Photoshop, GIMP, or even Paint will do) to create images for backgrounds, post headers, sidebars, etc.. We will get to that later. You will also need an idea or vision about what you want to create. Without that, you are just wasting your time and electricity. Lastly, you will need to know about C.S.S (Cascading.Style.Sheets) and how to operate them. If you do not know how to do that, you cannot apply interesting effects to your newly designed template (Such as: Positioning pictures or text, creating repeated backgrounds, moving around pictures and text and more). A great guide on how to get started with this is available here.

Once you have got everything you need, you should start the C.S.S Framework by putting properties such as

body[ background-color: #000000; margin: 0 auto; font-family: “Trebuchet MS”, Arial, Helvetica, sans-serif; font-size: 14px;}

#title [ font-size: 32px; color: #000011; }

so-on and so forth. A basic list of these tags that were taken from Blogger’s simple white theme are available here: (PDF File) XML Tags Blogger List Of CSS. An easier way to do this would be to find a theme that you like and copy and paste the C.S.S, editing it along the way so that time is saved. The only problem with doing that is that every theme is engineered differently so the tags will change.

After configuring your CSS Stylesheet, you must piece it together in HTML. This can be achieved using similar structures.

<div id=’main-wrapper’> <b:section class=’main’ id=’main’ showaddelement=’no’> <b:widget id=‘Blog1′ locked=‘true’ title=’Blog Posts’ type=Blog’/> </b:section> </div>

Do not forget to reference blogger templates that have already been created for the required widgets that you are supposed to put in certain spots. Without doing this, you could not complete making your own template.

Now comes the grueling part that you can either do yourself which could take hours to finish, or copy from another site and edit accordingly. Blogger is configured using widgets. All your posts are just one big widget hence the code up there. An Example of the code that you could type yourself or copy is:

<div class=’post-footer’>
<p class=’post-footer-line post-footer-line-1′><span class=’post-author’>
<b:if cond=’data:top.showAuthor’>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span> <span class=’post-timestamp’>
<b:if cond=’data:top.showTimestamp’>
<data:top.timestampLabel/>
<b:if cond=’data:post.url’>
<a class=’timestamp-link’ expr:href=’data:post.url’ title=’permanent link’><data:post.timestamp/></a>
</b:if>
</b:if>
</span> <span class=’post-comment-link’>
<b:if cond=’data:blog.pageType != “item”‘>

<b:if cond=’data:post.allowComments’>
<a class=’comment-link’ expr:href=’data:post.addCommentUrl’ expr:onclick=’data:post.addCommentOnclick’><b:if cond=’data:post.numComments == 1′>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span> <span class=’post-icons’>
<!– email post links –>
<b:if cond=’data:post.emailPostUrl’>
<span class=’item-action’>
<a expr:href=’data:post.emailPostUrl’ expr:title=’data:top.emailPostMsg’>
<span class=’email-post-icon’> </span>
</a>
</span>
</b:if>

<!– quickedit pencil –>
<b:include data=’post’ name=’postQuickEdit’/>
</span> </p>

<p class=’post-footer-line post-footer-line-2′><span class=’post-labels’>
<b:if cond=’data:post.labels’>
<data:postLabelsLabel/>
<b:loop values=’data:post.labels’ var=’label’>
<a expr:href=’data:label.url’ rel=’tag’><data:label.name/></a><b:if cond=’data:label.isLast != “true”‘>,</b:if>
</b:loop>
</b:if>
</span> </p>

That code translated into human terms controls what goes at the bottom of every post…In this case its the author, time, comment link and labels. To extract the code from other templates, just click the “Expand Widget Templates” button and it is below the stylesheet on a certain template.

Most of creating a template is just trial and error. If you look at the code and try to piece it together bit by bit.. you will eventually succeed and reap the rewards of creating one. I hope this tutorial has covered everything that you will need and comments/suggestions would be greatly appreciated as it would be great if this tutorial would become a one-stop source for all of the Blogger CMS(Content Management System) users.

About the Author

This post was created by Brad. This article is from Brad Blogging.com, which is also where he blogs about tips to make your blog better, through personal experience. If you run a blog, or will be considering about creating one in the future, this blog may be the ultimate resource for you to achieve maximum success!!

BlogBoy Notes:To me everything looked quite sound, but I am not expert on blogger or BlogSpot so make sure you back up your current themes and templates.

Sphere: Related Content

]]> http://bradtheblogboy.com/theme/bloggerblogspot-themes/feed/ http://bradtheblogboy.com/theme/them-building-part-2/ http://bradtheblogboy.com/theme/them-building-part-2/#comments Wed, 09 Apr 2008 03:57:57 +0000 Blogboy http://bradtheblogboy.com/?p=24

The First thing you need to do when thinking about a theme is deciding who you are designing it for. There are a number of tools that will tell you what your visitor’s monitors resolution is set to and this is a key factor to consider. As often as not these days new computers come with a wide screen monitor and most of the older 17 and 19″ 4:3 monitors were capable of 1280×1024. Like I said use one of the many site tools to figure out what size people are viewing your blog at.

For me 1% were using 640×480, that is just too small to design an effective money making blog. 9% were doing 800×600, which can be done, but 90% of my viewers were using something more, so I chose to go bigger. Only 25% had resolutions above 1440, meaning If I went higher than that 75% of my people would lose something and I Almost certainly would love that low res 10% crowd.

I settled for going with a width of 1000 pixels for the theme. Some of the other considerations that went into this size were the fact I knew as I grow I will attarct more and more people using legacy resolutions and didn’t want to alienate them. 1000 pixels fit on most everyone desktop and didn’t waving me looking around for information all over the screen. In consideration for the low res crowd I made my text window which has all the posts and pages visible on their full screen.

If you take a look at http://www.bradstinyworld.com you can see how it looks since it is the newest theme I have done, even if it is based on an older design. I build a single continuous banner in Photoshop and began to slice it up after I knew how I wanted the final lay out to work. I used the method described on Photoshop Candy to design the graphics after having looked through several interesting Photoshop sites.

There are those who dislike the notion of a big graphical banner when you enter a site, but for me I think it gives a great vision of who you are and the mood you are trying to set. There are some SEO considerations though since at most all a spider has to read in an image is the alt tags and the links if you used separate images. I solved this problem by using some CSS tricks which we can get into later. On Brad’s Tiny World you get a full package of text in that header, but the average viewer is never going to see it. I matched the color and made it transparent which is enough for most browsers, but for good measure I made it only 1 pixel high. Google will read it all the same, but as a designer I get the satisfaction of putting together pretty graphics unmarred by ugly text.

In the next part of this we will discuss whether you should widgetize or not.

The first thing you notice about any blog is the theme. If you have played with as many of them as I have you start to recognize where they came from too. Most of them I see unfortunately come from stock sites leaving very little in the way of personalization. I run one basic design, a post/page column and a single sidebar with pull down menus at the top. While all three of my blogs have the same fundamental layout, they don’t lack for personalization.

I will get into the actual process of creating a theme in the next post but I am assigning homework.

• Find 10 blogs and decided what you like about them visually.
• Decided what you want to incorporate with your blog and why.
• There is extra credit points if you bring me a cool widget I have never seen before!

Since I have already been asked twice why I am still using the WordPress Default theme, I suppose I should be answering that question.  I Don’t have one yet.  Since the concept for this blog is less than 2 days old and the gerbil that turns the wheel inside my head was taking his turn striking a very large hammer at the back of my eyeballs, I just don’t have one yet.  Yet is the operative word here.  I have some ideas and frankly why put it all up at once when I can blog about how to build one for yourself…

WordPress 2.5 seems to be more particular than early releases to coding errors.  One possible result is the loss of sidebars and footers.  Elezend asked about this very problem on Lorelle on Wordpress, then again at Brad’s Tiny World.  Elezend’s footer which contains MyBlogLog and Blog Catalog displays just up and disappeared upon upgrading.  Personally I think upgrading on day one of any software upgrade is a bad idea, but that is from years of going WTF and looking at frozen computer screens.

This is going to be a multistep fix and some trial and error So lets get started.

1. The first thing I want to try to make sure this is not a general theme problem is to remove the MyBlogLog and Blog Catalog coding
2.