Blogging

2009-10-22T19:19:00.001-07:00

Install Blog Template

2008-12-29T03:54:00.000-08:00

If you want to try UPDATING your blog’s template, first make SURE you backup your current template (you should always do this when planning to change to a new template). And how do you do this? Check the image below!! This way, if something goes wrong, you can always reupload your current template!!
How to install.

Unzip the file you downloaded.
Log in to Blogger dashboard.
Go to your blog’s Layout –> Edit HTML
Click the button “Browse”.
Browse the XML file you have saved and upload it.
You are done!

Free Blogger Training Videos

2008-12-27T06:53:00.000-08:00

Using Blogger can be confusing especially with the limited documentation available by Google. If you’re like me, you prefer visual tutorials vs the traditional documentation method which makes learning more enjoyable and interactive.

There’s a website called Recognized Expert which provides over 7 hours of free Blogger training videos covering the basics and also some more advanced techniques. It’s a very helpful way for those of you who are beginners looking to better understand how Blogger works.

The content is created by two brothers by the names of Bob and Josh Sommers who do a great job explaining Blogger step-by-step. I highly recommend you checking out their collection of videos as I’m sure you’ll learn something new just by watching a couple of them. Here’s the high-level list of the videos available on their site:

Getting Started with Blogger
Navigating Blogger
Text and Links
Uploading Images to Blogger
Video In Blogger
Post Options
Managing Posts
Page Elements
Post Options
Gmail Account
Uploading Audio
Working With Your Template
Blog Settings - Basic
Blog Settings - Publishing
Blog Settings - Formatting
Blog Settings - Comments
Blog Settings - Archiving
Blog Settings - Site Feed
Blog Settings - Email
Blog Settings - Permissions
Google Gadgets
Slideshows
Credit Cards and PayPal
Converting Your Blog Into A Website

Let me know what you think and if these videos are helpful for Bloggers of all levels. It’s really great of the Sommers brothers to provide all this content for free! Watch the videos now.

How To UnZip A Downloaded Template

2008-12-26T07:23:00.000-08:00

Any Blogger template or WordPress theme you download from our site will be in a .zip format. In order for you to get the template or theme in a usable state, you’ll need to unpackage or unzip the “template-name.zip” file.

So what exactly is a .zip file anyways? A good analogy is to think of it like mailing a letter. You always fold up the paper before putting it in the envelope because just dropping the paper in the mailbox wouldn’t be as compact or efficient (besides the postman not delivering it). Well, that’s how we package our files — by putting them in a safer and more download-friendly format. It’s a very common file format whenever you transfer large files or want to package up several files into one.

Ok, let’s get your file unzipped and you moving along already

Step #1 - Select and Download A New Template

Select the template you wish to download from our site and click on the big blue “Download Now” button. In this example I just downloaded the beautiful Day Blogger Template and saved the beautifulday-blogger.zip file to a folder on my desktop.

Step #2 - Unzip Your New Template

Browse to the location where you downloaded the .zip file from our site and right click on it. Now depending on what version of Windows you’re using will depend on the next step you take. I’m using Windows Vista which comes with a built-in zip software and makes it very easy. If you see a menu option “Extract All” after you right clicked on the .zip file, then you’re in luck. This is the built-in .zip file extractor that comes with newer versions of Windows. You can see what this looks like from the following screenshot.

With Windows XP and older versions of Windows, you might need to download a free trial copy of WinZip or 7-Zip instead. WinZip offers a free trial version and 7-Zip is open source software which is free. I personally prefer 7-Zip because it’s light weight, easy to use, and free. After you download and install either of these programs, you’ll go through the same step as above to unzip your file. You’ll need to right click on the beautifulday-blogger.zip file and select “Unzip” or “Decompress”. Then select a location as to where you’d like to put the unzipped files and/or folder.

Step #3 - Find Your New Unzipped Template File

Hopefully you paid attention when you were unzipping your file. Wherever the location you selected to unzip it is where you’ll find the unzipped template file or theme folder. Usually it’s in the same location as where your .zip file. If not and you forgot, I always just go back and unzip the file again (this time noting where I’m unzipping it to).

Now that you know where it’s unzipped to, browse to that location and look for the .xml file (in my case it’s beautifulday-blogger.xml) and you’re done. Sometimes after you unzip it, you’ll see a folder named something like “beautifulday-blogger” and it’s going to be inside there. If you downloaded a WordPress theme you should have a new folder of the theme name and inside the theme files and an images folder.

How to Enlarge Photos on Your Blog

2008-12-26T07:19:00.000-08:00

Here is what you do:

Go to the "Edit Html" screen when you are ready to create a "New Post":

...then find the section of code that looks like this:

...change "s400" to "s640"...
...then click "Save Now" and head to the "Compose" screen. You should see your photos enlarged. When you click on "View Blog", you will see a noticeable difference in the size of your photos. All those cute pictures of your projects, your children, your home, etc. will look all the better!

A couple of notes:

1. If your html says "s200" instead of "s400" then change the size of your photos to "s400" to start. See how you like it and then upgrade to "s640" if desired.

2. You will most likely have to change the parameters of your blog (and blog banner) to accompany the larger photos. Changing your "outer wrapper" to say 900 or 1000 should do it. Also change the size of your "main wrapper" to about 700.

Good luck!

How to Setup Your Recent Posts and Recent Comments Blogger Page Elements

2008-12-26T06:43:00.000-08:00

In order to enable the Recent Posts and Recent Comments page elements in your recently downloaded Blogger template, you need to follow a couple simple steps.

These lists aren’t going to show up when you first install the template so we’re going to bring them to life now. They are actually both RSS Feed widgets so we’ll need to paste in your feed and comment rss feeds to make them work.

Let’s start with the Recent Posts page element so click to edit it. Then paste in your RSS feed url which will most likely be in this format http://YOURSITE.blogspot.com/feeds/posts/default . Make sure to replace “YOURSITE” with your actual blog url

There’s no need to change the title (unless you want to call it something else) so then hit “Save Changes”. Then save your blogger layout and go over to your other browser window, refresh and see the Recent Posts appear in your blog’s sidebar.

Now you’re going to do the exact same thing with the “Recent Comments” page element but you’ll instead use this feed format http://YOURSITE.blogspot.com/feeds/comments/default . Again, make sure to replace “YOURSITE” with your actual blog url. Save and make sure it’s working properly. If it doesn’t appear on your blog, chances are you don’t have the correct feed url or you might not have any comments yet.

Add a Cool Slideshow of Picasa Photos

2008-12-25T10:32:00.000-08:00

Abdullah recently asked a question in our blog forum

about how to add a Google Picasa Web Album Slideshow to his blog. This was a great question so I thought other people would be interested in how to do it as well.

Picasa is a free photo management product by Google that I actually use for all my photos. The software organizes and can adjust your photo albums on your computer and then easily uploads them to your Picasa account. I love the ability to quickly upload pictures from my trips, etc and just send the url to my friends and family.

So if you already have a Picasa account and have pictures you’d like to include on your blog, you should check out this widget. If you don’t have Picasa yet, I highly recommend you download it for free by clicking on the link below.

After you select the photo album and settings you want to use, it gives you some code to paste into your site. You can either paste it into your post or add it to your sidebar by creating an html/javascript widget. Then just paste the code into the widget and save.

Here’s a screenshot of the widget being setup:

Notice how easy the setup process is. It provides the code to paste into your blog and then you’ll have a flash slideshow rotating through all your photos! Pretty cool. I was going to include a working demo but once you login to your account and start building a slideshow, it shows you real-time how it works. It’s worth checking out….enjoy!

Blogger Video Tutorials on YouTube

2008-12-25T06:56:00.001-08:00

If you’re tired of trying to browse Blogger’s Help Center in hopes of finding an answer to your question then this recent announcement from Blogger might be just what you’re looking for. Google Blogger has setup a YouTube channel specifically to show users step by step how to use Blogger features. This is a great especially if you prefer a visual tutorial vs having to read through an article.

Since the channel is so new there’s only three videos available. I’m surprised they decided to officially launch without stockpiling a few dozen videos first. They do claim that more videos will be added in the coming months so hopefully the inventory of tutorials will increase rapidly. I watched the three videos currently listed and it’s really easy to understand and walks you through how to create a blog with Blogger, setting up a custom domain, and adjusting your privacy settings.

You can view the complete Blogger Buzz post here.

Make Your Own Cool Web Buttons

2008-12-25T06:39:00.001-08:00

Many of us have blogs and templates we’d like to customize but we just don’t have the skills or software to do it. It also takes time to make design elements in photo editing software so why even bother right? Well, thanks to a cool new website I found called My Cool Button, you can easily create your own Web 2.0 buttons in only 4 steps!

You’ll select the size, color scheme, icon (if you want one), font size & type, and then enter your button text. It’s as easy as it can get. You then click on the “apply changes” button and you’ll see what your button looks like. Then download it to your computer and put it on your blog!

If you were an early user of eBlog Templates you’ll remember the template download buttons looked very similar to these. That’s because the first buttons used on this site were made from the My Cool Button website! I needed something quick and dirty and I didn’t want to spent a lot of time designing buttons in Photoshop so the buttons I made served their purpose but have since been replaced.

Here’s a couple of buttons I made in literally less than 30 seconds. Pretty amazing huh. No need for photo editing software knowledge or to hire a designer!

This is a picture of what the site looks like if you haven’t already seen it from the link above. As you can see it’s only 4 easy steps (3 if you don’t want in icon) and you’ll have your new button in no time.

So head on over to My Cool Button and start whipping out cool Web 2.0 buttons for your blog today! It doesn’t cost you a thing and you can’t beat the speed.

Drive New Traffic to Your Blog

2008-12-25T06:23:00.000-08:00

Are you someone who always submits your blog posts to Digg hoping it gets enough “Diggs” to make their front page? Well, here’s a new site that takes all the work out of having to submit your post each time. Spotplex is a free service that dynamically provides an instant, impartial ranking of popular web content based on unique number of page views. That means the more people that read your blog posts, the more popular your content is and it will rank higher on Spotplex.

By inserting a single line of HTML code into your blog, you can instantly track the number of post reads. This will then be dynamically updated on the Spotplex site which is essentially like the Digg.com model, except you don’t need to vote or “Digg” a post. The voting is done dynamically by how popular your blog posts are.

Their free service also provides you detailed analytics of your blog as well as potentially driving new traffic to your site. Spotplex also offers bloggers downloadable widgets to instantly analyze viewer traffic and to list other popular articles on your blog, increasing reader retention over time. Here’s an illustration as to exactly how the Spotplex model works.

It’s fairly easy to install for both Blogger and WordPress and is only one line of javascript code. All you need to do is enter your blog url and Spotplex will automatically find your rss feed and provide you with a few options for installing it. The sidebar Spotplex widgets seem like a pretty cool addition as well but I didn’t bother using them.

You’ll then be asked which type of blog platform you’re using (supports multiple types) and if you want a Spotplex image or not. You can also easily add it to your Blogger blog by clicking on the “Add Widget” button. This way you don’t need to muck with the template code. I prefer to not use a widget and just paste the javascript code (without the buton) right into my template somewhere in the section.

WordPress users can add it as a sidebar widget or also just copy the .js code and paste it into their header.php file.

If you are tired of “Digging” each one of your posts and your site gets a lot of traffic, this might be a great alternative for you. Spotplex is nowhere near as popular as Digg (at least not yet) but it doesn’t hurt using both services especially since Spotplex requires no manual post submissions. Give it a try and let me know what you think

Blogger Navbar - How to Remove It

2008-12-24T09:01:00.000-08:00

First off, what is the Blogger Navbar?
The Blogger Navbar appears by default at the top of every Blogger-powered blog. It is available in several colors, and is configured in the Template tab in Blogger’s interface. If you are using a classic template, you’ll see a menu from which you can select a color. For blogs using Layouts, just click the “edit” link on the Navbar page element. Blogger gives a more detailed explanation of this here.

There are several reasons why I think it’s important to remove the Blogger nav bar but I’ll name my two most important reasons. First one being that it’s an eye sore and makes your blog look less professional. Secondly, when you click on the “next blog” button you never know what type of blog you might stumble upon. There are so many spam blogs with adult content or other information you don’t want young people to read. When you do block the navbar on your own blog, you prevent others from also easily leaving your site and accidentally heading to one of these spam sites.

Unfortunately Blogger doesn’t give you the option to remove the navbar easily but this simple modification to your template allows us to hide it. The good news is that it’s not against Blogger’s TOS so it’s not illegal to do. I read a post recently by Blogger Support that stated

While it’s not officially against our TOS, we discourage folks from removing it because we think it’s a great feature with more improvements to come. Follow the above instructions at your own peril, as Blogger controls the TOS and has been known to change it.

So the change you want to make is to the stylesheet. First make sure you backup your current template just in case you make a mistake. Click on the “Download Full Template” link ( go to “Template” => “Edit HTML”) and save it locally. Next, from within your template code you want to scroll down until you find ]]> and stop. Then you’ll want to add this line of code right above this line.

**** #navbar-iframe {height:0px;visibility:hidden;display:none} ****

So once you’re done, it should look like this:

**** #navbar-iframe {height:0px;visibility:hidden;display:none} ****
**** ]]> ****

After that, save your template and view your blog. The top Blogger navbar should have disappeared! Looks much better now doesn’t it? If you ever want to add the navbar back, it’s simple. Just remove the line of code we just added. Also, if you ever switch templates, make sure to follow these instructions again because it needs to be done with each new template you use.

How to Install a Blogger XML Template

2008-12-24T07:56:00.000-08:00

This article was written to provide a step-by-step guide on how to correctly apply a new xml Blogger template to your blog. This process can be tricky depending on several factors (quality of the code in the new template, your existing widgets, etc) so you need to be careful when changing your template. Don’t worry though, just follow our step-by-step instructions below and we’ll hopefully get you through it without much pain.

Many people make the same mistake when installing a new blogger template. Most problems when installing a new template are caused by the blogger widgets (Page Elements) that you’ve spent time setting up in your previous template. Almost all Blogger Template available for download on this site are in the new Blogger xml template format so if you’ve downloaded the template from us, it’s going to be much easier to follow our instructions.

Step #1 -Backup Your Current Template

Backup your current Template just in case you make a mistake. This is very important so you can always go back (click on the screenshot to the left to see exactly how this is done). You’ll want to navigate to the “Template” => “Edit HTML” section of Blogger and then look for the “Before editing your template, you may want to save a copy of it. Download Full Template“. Click on the “Download Full Template” and save it somewhere easy to find later on your computer. We are not responsible for any mistakes you make in applying your new Blogger template. Once you have saved this .xml file onto your computer, move on to step #2.

Step #2- Take a Screenshot of Your Page Elements

This next st ep isn’t necessary but I like to do it anyhow. Take a screenshot of your “Page Elements” page just so you know exactly what widgets (Page Elements) you had before applying the new template (an example of the exact page you should take a screenshot of is in the image to the left). If you blow away all your widgets and you don’t remember which ones you had, this screenshot will at least help you remember. If you’re unsure as to how to take a screenshot, then check out this quick tutorial (MS Windows).

Step#3 - Upload Your New Blogger Template

Now it’s time to upload the new Blogger template from your computer. You’ll want to navigate to the “Template” => “Edit HTML” section of Blogger and then look for the “Upload a template from a file on your hard drive:” text. To the right of that you’ll see two buttons. First, you’ll click on “Browse” and navigate to the new .xml Blogger template on your computer and click “Open”. Then you click on the “Upload” button and cross your fingers.At this point Blogger is attempting to apply the new .xml Blogger template to your blog. After it’s done, you’ll get a message stating that the upload and new template was applied successfully (in that case you’re done!) or more likely in my case, you’ll get a red error message that states something like:

Widgets are about to be deleted

Please confirm that the following widgets should be deleted. All the widgets’ configuration data will be lost.

Text1
BloggerButton1
Poll1
Profile1

Now if you’re like me, you don’t want to lose all those widgets (Page Elements) you spent lots of time configuring and arranging on your blog. If you don’t care and really don’t have anything you’ll be upset losing, then go ahead and click on the “Confirm and Save” button that looks like this:

Just remember, that you’ll need to re-add any page elements that you had previously setup in your old template. If they were simple or just recently added then I’d recommend

just re-adding them instead of having to follow the next steps. If you decide you want to keep your widgets (Page Elements) then write down (or take another screenshot) the list mentioned above that are going to be deleted. You’ll use this list later when we migrate over your widgets.

Step #4 - Transfer Widgets to New Blogger Template

This process is going to take some careful cut and pasting within the template code so if you’re not comfortable doing this, then I’d recommend just ending on the previous step. First things first, click on the blue cancel button (you should still be on the previous step) that looks like this:

This will cancel out of the new Blogger template you were just trying to upload. Next, we’re going to essentially make a temporary placeholder for your widgets (Page Elements) within your current template. You should still be in the “Template” => “Edit HTML” section of Blogger so if you’re not, go back to that section.

You’re going to actually edit this template code now so pay close attention. Look for the following piece of code which is all the way at the bottom.

*** /body> ***

Now you’re going to replace that code with the following bit of code:

*** b:section id='widgets-placeholder' showaddelement='yes'/> ***

Save your template and you’ll see this message (which is a good sign):

What did we just do?













We created a brand new widget (Page Element) in

your current Blogger template so we can move all your widgets over to

keep them safe! Next navigate over to the “Template” => “Page

Elements” section of Blogger and you’ll see a blank new footer section.

Drag all your widgets (Page Elements) that were going to be deleted (we wrote them down or took a screenshot in step #3). The order doesn’t really matter as long as you’ve moved them all down into the widget (top image on left). After you’re done, it should look something like this (bottom image on left):

Now click on the “Save” button and the temporary placeholder for our widgets will be saved. We’re not done quite yet but if you’ve gotten this far already you’ve done great! The hardest part is over. Now we’re going to copy the widgets we just protected over to your new template. Hold off on that bathroom break and let’s keep going.

Next, go back to the “Template” => “Edit HTML” section of Blogger and scroll down in the template code and look for the line of code you added before:



This is a list of all your widgets (Page

Elements) that we just moved into the footer. You want to select all

this code and copy it. We’re going to paste it into our new Blogger

template code which will complete the transfer safely.

Now open your new Blogger template xml file in a text editor (you

can use Notepad, just right click -> Open With -> Choose

Notepad). Once you have it open, scroll all the way down to the bottom

of the code and look for the following code:Now open your new Blogger template xml file in a text editor (you

can use Notepad, just right click -> Open With -> Choose

Notepad). Once you have it open, scroll all the way down to the bottom

of the code and look for the following code:



You’re going to replace this code with the

new code you just copied above. Make sure you only replace that one bit

of code otherwise you might run into some problems. Save your new

Blogger template and you’ve finished transferring your widgets (Page

Elements) into the new Blogger template!

Now after all that work just to save your precious widgets, let’s

hope the new template works ok in Blogger. Go back to step #3 above and

upload your new template like you attempted to do before. If all goes

well, your new template will properly save and your blog will be

updated!

Step #5 - Move Your Widgets Back To Their Original Spots

I’m assuming your new template installed without and problems and you’re ready to move your widgets (Page Elements) back to their original spots. This is just the reverse process of what we did before by going to the “Template” => “Page Elements” section of Blogger and moving them out of the footer and back into the sidebar (or wherever you originally had them in your old template).
After you arrange them to your liking, make sure to save and view your blog. If all went well then your blog should be looking the way it did before the new template was applied (well, except for the new beautiful design which is the main reason for this hassle in the first place right?).