If you’re looking for a great make money online Blogger template then I’ve got news for you. Blogging Pro is the latest and greatest web 2.0 template built just for that. This is another exciting cutting-edge Blogger template that we’re giving away for free and all we ask of you is to keep the footer links intact. You might see some other conversions of this template out there but I promise you’ll find ours to be top-notch and feature-rich. Check out our live Blogging Pro for Blogger demo to see and interact with the template before you even download it! This template was originally designed for WordPress by Design Disease and converted to WordPress by Blogging Pro. We loved this template but were disappointed we couldn’t find a good conversion for Blogger users so guess what? We converted it to Blogger ourselves! It’s a rounded corners, web 2.0, three column, orange and shaded blue beauty with some great features and widgets you’d normally only find with a WordPress theme. Here’s a list of what’s included: You can see from this screenshot that the actual editor is nicely setup so you don’t need to scroll or try and figure out how to click on the “edit” widget links. Most templates that you download make it tough to edit — not this one! Now before you can get fully up and running with this new Blogger template, you’ll need to properly set things up. Please follow the steps below and read items carefully. The same questions are usually asked over and over by people posting comments, yet the answers are usually right in front of them. This is especially true for why the post date might not be working on your blog.Let’s start from the top of the template and work our way down each item. Don’t be too surprised when the template doesn’t look like the screenshot when you first load it up. You’ve got some configuring to do first! This is actually pretty easy since the top tabs are a link list. You don’t need to alter the template code. Just go into your Blogger page layout and click on the “edit” of the “top tabs” widget. Start adding new links and then save. A “home” link will automatically appear once you setup this widget so you won’t need to add one. Save and refresh your blog to see the pretty new tabs you just created. Here’s what it should look like (different names of course) This section is actually setup to dynamically work except for the Feedburner link. You’ll first need to have a FeedBurner account. If you don’t already have one, please read the “How to Setup FeedBurner on Blogger” article and then come back. Once you’ve got your FeedBurner account, you’ll need to edit this template code and replace a few parts. Search your template code for the following text: After you’ve changed this link save your template and check to see if it works. If you’re having trouble finding your feed name or id, please read our article above or see FeedBurner’s help section to locate it. This is a great location for showing ads and we really like how the designer laid everything out. The default ads are just a placeholder but of course feel free to use them until you find a replacement. You’ll need to again edit the template code to swap out the ads. Search your template for Remember, when you paste in your own ads you will need to convert the ad code into a workable Blogger format otherwise you’ll get an error when trying to save it. Use our free AdSense Code Converter to change it automatically for you. You can also look at the existing ad code included in the template and use it as a model. This is a very important step and one that most people think is broken when they install the template. It’s not folks. You just need to go into your Blogger settings and make a small change before it will work. After you install the Blogging Pro template, go to your Blogger’s “Settings” => “Formatting” and look for “Timestamp Format”. Make sure you change it to this format: “Tuesday, January 25,2008? as shown below. This needs to be set in this format otherwise the date won’t show up properly on each of your posts! Actually the date will most likely be blank and you’ll think the template is broken. Remember to change the TIMESTAMP FORMAT (fourth item down on the page) and NOT the Date Header Format option. This is actually a really cool widget put into the sidebar by default. If you have never heard of Amazon’s “Deal of the Day” then you’ve been missing out! Basically each day Amazon has one special item they drastically reduce in price. Before you’d have to visit their site to see the deal but now it gets delivered directly to your Blogger site! If you want to replace or remove this widget you’ll need to edit the code and look for the following text “amazon-widget”. The line of code below that is the actual Amazon widget so just remove or replace it. I really love this part about the template. In the past, your footer was an overlooked piece of real estate on your blog. With this template, it makes good use of your footer like many of the other pro bloggers out there today. This one is easy to setup since we’ve already written an entire article dedicated to this. Please see “How to Setup Recent Comments and Posts Widgets” to configure these two widgets. These two widgets will both appear in the footer once you configure them properly. It’s a very good use of space and provides search engine spiders an entry point into your blog content. This is the other footer element which comes already setup with our recommended money maker links and programs. This idea came from the ProBlogger.net web site and we included it in our template. You are welcome to keep the links intact or feel free to replace them with your own. You will need to edit the template code to swap them out and also have affiliate accounts setup with each vendor. It’s easy if you don’t have any accounts. Just click on each footer link to setup a new account. Search your template code for “Recommended Money Makers” and you’ll see the links below that. This is a really cool feature within this template and the best part is you don’t need to do anything to setup it up! There are some further options if you click on “options >>” on your actual blog page under the widget but that’s it. This is a sample of what it will look like once you start generating some traffic (or more traffic) to your blog. You should now have the template all setup and ready to go. I hope you enjoy this beauty and please make sure to keep the footer links intact since numerous hours of my time and the original designer were put into making it. That’s all we ask for giving away this template! Enjoy! Thanks again to Design Disease and the Blogging Pro guys for making this wonderful template available for free. It was a great challenge converting it to Blogger but it was well worth the trouble. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Top Tabs Setup
Configure The Three Header RSS Links
YOUR-FEED-NAME-HERE . Replace the text with your FeedBurner name (i.e. eBlogTemplates is ours)Header AdSense Setup
Individual Post Date Setup
Amazon Deal of the Day Widget
Footer Recent Posts and Comments Widgets
Recommended Money Makers Section
Live Traffic Feed Sidebar Widget
Blogging Pro Template
Dilectio Template
Here’s a nice three column modern artistic Blogger template with some nice bells and whistles. It has a cool search box and “About You” section with a red/orange background along with a custom date/time stamp for each post. This template is only the second one ever to include javascript tabs within the sidebar. That means instead of the page reloading each time you click on a tab, it dynamically clicks over! Check out the live demo to see it in action. This free Blogger template is also setup for you to easily add Google AdSense and make money from your blog. If you don’t already have Google AdSense, you should read more about how to make money from Blogger and sign-up. The ad format and colors you should use to best match this template are illustrated below. The 300 x 250 rectangle with #fff3e2 for the border and background, #cc0000 for the text, and #856d65 for the title and url. This will make your ad block blend in nicely with the light pink second column. You’ll also need to setup the header tabs before they appear. Just edit the “top tabs” widget and create the tabs you want. The “Home” tab automatically appears once you create your first tab. To setup the recent posts and comments cool dynamic tab section you’ll need to paste in your rss feeds. Read this article on setting up your Blogger recent comments and posts section. The rest of the configuration is pretty straight forward. If your individual blog post date stamp doesn’t show up, you’ll need to make one more change. Go into your Blogger’s “Settings” tab and then click on “Formatting”. Next, change the “Timestamp Format” (it’s the 4th one down) to this format => “Wednesday, February, 2008″. Make sure you change the “Timestamp Format” and NOT the “Date Header Format”. Many people in the past have told me it didn’t work only to find out they were changing the wrong field. This template was originally designed by Design Disease for WordPress and was converted into Blogger by Blog and Web. eBlog Templates decided to take it one step further and enhance it to include the dynamic header tabs and javascript recent posts and comments tab section. 1/6/08 - Fixed the post image alignment issue. If you’ve downloaded the template prior to this date, you can fix this by editing your existing template. Read this post for instructions. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Revisions
Ocean Dancer Template
The Ocean Dancer is a free xml template for Blogger. This template consists of one menu bar, a 474px width box for blog post (so it is suitable for your 468 x 60 ad), a two column sidebar plus one single sidebar column which is capable to load three 125px width images. You can put an entrecard widget together with one of the 125 spaces, use an ad site like Project Wonderful, or any widget you desired. Both sidebars also have enough size for you to manage your widget freely and easily. The top tabs are hard coded into the template so you’ll need to edit the template code and update them as needed. This template was submitted by Tukang. 3/31/08 - Fixed the 2nd column headers. Previously they were not being formated like the other column. Download the latest to get this fix. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Revision History
Yellow Puppies Template
Calling all dog fans, come get the latest and greatest Blogger Yellow Labrador puppy template! This template is an original from your favorite template site, eBlog Templates. It’s a cute dog loving template with three yellow lab puppies wearing red collars posing outside on the grass. The header also includes dynamic tabs so you can easily add new pages or links to your blog. These won’t show up when you initially install this template. You’ll need to go into the template layout mode and edit the “linkbar” link list widget. The Blogger template is three columns so there’s plenty of room to add new widgets, ads, or pictures of whatever you want. There’s only one image for this entire template and it’s hosted on our image server. That means you don’t need to separately download any images — just install this new template on your blogspot site and you’ll be sporting the new puppy look! This template was originally designed by Elque and enhanced for dog enthusiasts by eBlog Templates. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Business Blue Template
Business Blue is a clean three column new Blogger template with a simple, yet soothing blue and white header image. Blue is dominant color throughout this design and it’s widget ready so you can customize it however you like. The top tabs are setup to be easily configurable within your page layout window. Just edit the “top tabs” widget and add all the tabs you want. The “Home” tab and rss feed icon will automatically appear once you add and save your first tab. This template also has the cool FEEDJIT widget pre-installed so you’ll be able to tell real-time who and what country your visitors came from. There’s plenty of space for banner or button ads so it can easily be used for a make money blog. This template was submitted by “Oz” and it’s a nice one. 3/31/08 - We’ve updated this template to include a search box, the FEEDJIT widget, dynamic tabs, and fixed the blog description so it shows up now. A new demo site has also been setup so you can get a real feel as to how this template actually works. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Revision History
YOUR BLOG NAME HERE
After hours of code editing and tweaking, I’d like to welcome WP Premium Red to the eBlog Templates library. This gorgeous and powerful three column fixed width template originally designed for WordPress, can now be yours for free (all I ask of you is to please keep the footer links intact as a token of our hard work making this for you). I’m sure most of you have seen this premium free theme before and wished it was available for Blogger. Many WordPress users were shocked to see this theme available by R.Bhavesh for free, including myself. I love the simple yet nicely laid out design. It reminds me a lot of the ProBlogger site which is in a league of it’s own. I’d also like to note that there are no javascript external file dependencies in this Blogger template. Most free templates you download with javascript features link out to an external .js file and while the template might work well at first, it’s only a matter of time before it breaks. All of the template images are also hosted on our Pro Photobucket account which has unlimited bandwidth. For you that means the images will always be there and not suddenly disappear at the end of the month. You might want to copy these images to your own server regardless just so you’ve got complete control of them. This Blogspot template includes all the features of the original WordPress theme (even the javascript side bar tabs!) and all you need to do is configure them. Features include: This template was built to make it easy for you to setup without touching much of the code. Most sections were built using widgets so you’ll just need to edit each one accordingly. Follow the steps below to correctly setup the template so it will look like the screen shot above. Before we begin, I want to point out the very cool sidebar tab switching feature. You probably didn’t notice it right away so look at the search box on the right side. Notice the second tab called “Categories” and click on it. Assuming you’ve got at least one category, you’ll instantly switch without the page reloading. Pretty cool huh? This was part of the original design for WordPress and eBlog Templates specially converted it over to Blogger using Javascript. When you first load up the template, you won’t see any tabs. Don’t worry, it’s working properly and you just need to add new tabs. Unlike other Blogger templates, you don’t need to edit the code to add or remove tabs. Just go into the page element area and click on “edit” within the “Top Tabs” widget. Surprise, it’s a simple link list widget so just add as many tabs as you want with ease. This section you actually need to edit the code to make it work properly. It’s wired up to work with Feedburner and all you need to do is pop in your id. Edit the template code and look for this section: Replace the YOUR-FEED-ID-HERE and YOUR BLOG NAME HERE with the appropriate values given to you from Feedburner. If you have an Feedburner account, you’ll want to setup your RSS feed as well. Right above the section you just edited, you’ll find this code: This section is just an html widget so you can either delete it or paste in a few ads. The default ads will disappear once you fill the html widget box so don’t worry about touching the code. There’s nothing special about the ad formatting. The current ad code looks like this: Next we’re going to move down the sidebar and setup the recent posts and recent comments widgets. Instructions have already been written in another article so please read “How to Setup Your Recent Comments & Posts” post. These are just simple link lists so feel free to remove them or add links to them. There’s plenty of sidebar space since there’s two sidebar columns. This small html widget defaults to a Text Link Ads button as an example. Once you put something in the html box, this default ad will disappear. If you haven’t heard of Text Link Ads before you might want to take a look. It’s a great site which allows you to sell links on your blog. Read more about Text Link Ads for Blogger. Just like the original WordPress design, this template also has the option to add footer links to match the top tabs. Unfortunately there isn’t a way in Blogger to automatically print out the same set of tabs so if you want to use this feature you’ll just need to enter the exact same tabs in this link widget. This is what it should look like once you’ve added a few links. Some people don’t bother even using this widget so feel free to remove it or just not add any links to it. Thanks to R.Bhavesh for the amazing design and deciding to give it away for free. I’d also like to thank Ivan over at Zona Cerebral for which portions of his template were used in creating this enhanced version. Template was converted into the new xml Blogger format by eBlog Templates. Update (2/15/08): This template has been updated to include the Blogger page element layout editor missing scrollbar fix. I’ve added several new css elements like Update (2/17/08): A bug was found in the search widget of this template (thanks Kenneth) which has been fixed. Anyone who downloaded this template prior to 2/17 will need to either re-download the template or make an easy one character fix to their existing template. I recommend backing up your template before you make this change. The fix is as follows: Search your existing template for the following bit of code and replace the “s” with a “q“. After you make this change, save your template and the search box should now work properly. Sorry for the bug but at least it’s an easy fix right? Update (2/18/08): A new bug was found in the individual posts section (thanks Nick). The date was being shown twice in the post header. If you downloaded this template prior to 2/18, you can easily fix this without downloading it again. Go into your template layout editor and edit the blog posts module. Uncheck the 3rd box down and save. It should now be fixed. Update (4/22/08): The previous 100 x 100 ad spots weren’t very popular and have been replaced with 4 of the more standard 125 x 125 size banners. The default comes with four great ads which you can either keep or replace with your own. I recommend keeping them if you currently don’t have any ads to use. Then click through and sign up with each of the 4 ads and put your own version on your blog instead. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Configuration
Header Tabs
Subscribe to Feed Via Email
100 x 100 Ad Spots
Recent Posts & Comments
Topics and Blogroll
Ads Widget
Footer Link Widget
Revision History
body#layout CSS selector to add CSS styles that adapt templates to the editor.
Blog Oh Blog V2.0 Template
Blog Oh Blog v2.0 is a very clean and useful new Blogger template. It’s been enhanced by eBlog Templates so it’s more functional and easier for you to setup! It comes with 3 columns and the following widgets. Recent Posts, Recent Comments, Search, RSS Feed, Link List, and tabbed navigation. It’s easy to update the tabs once you install the template. Actually you won’t see any tabs when you first set it up. You’ll need to go into template edit mode and edit the “Top Tabs” page element. There you can create all the tabs you want. The “Home” tab gets automatically created after you setup your first tab. There’s also a header Ad html box which you can either remove or update with your own banner ad. It’s a perfect spot for a 468×60 banner such as Google adsense, etc. Once you edit the page element, the default Text Link Ads banner ad will go away. The about box in the top right area is easy to edit as well. Just enter whatever text you want in the widget box. Also, you’ll need to setup the Recent Posts and Comments widgets. Read this post for instructions on how to configure them. Thanks to Blog Oh Blog for designing this template (originally for WordPress) and to Jacky Supid for converting it to the new xml Blogger template. Update 5/11/08 - Added Feedjit sidebar widget & fixed layout editor page so widgets align properly. Also added live demo site. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Revision History
Aspire Template
Medieval, parchment, and scroll blogger templates seem to be very popular these days so we’ve taken the liberty to find another great one called Aspire. This three-column Blogger template comes dressed up with all the goodies a knight of the round table would want for his blog. You get a search box, recent posts and comments widgets, a custom built date stamp for each post, and more. In order to get the recent posts and recent comments widgets working, you’ll need to read “How to setup your recent posts and comments” post. Not to worry, all the images are hosted via our Pro Photobucket account so you won’t experience the “End of the month blogger blues” which happens to thousands of Google Blogspot Bloggers every month. The dynamic date on each post is handled by a custom written javascript function which is embedded into the template as well. Most other templates you download link to an external .js file so at any point the date might stop working on your blog. If you like this template you might also enjoy the Parchment Blogger template as well. Thanks to Info Creek for designing this great theme and also porting it over to the new xml Blogger template for you Blogspot users! 4/13/08 - Fixed individual post date so it is center aligned in the date box. Also added new demo site, fixed the layout blogger screen, and added several cool widgets. 5/17/08 - Fixed the “next” and “previous” posts buttons at the bottom of the page. If you downloaded this template prior to this date you can easily fix it yourself. Just search your template code for “.navigation” and then remove the “position:absolute;” entry. Thanks to Allen for finding the bug. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Revision History
Sun Flower Template
This is a simple 3 column Sun Flower Blogger template based off the rounders template. It’s perfect for a flower-type theme or a personal blog skin. Nothing fancy here and it’s an easy to setup and install template. Thanks to Template Panic for converting this into the new xml Blogger template. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Curious Cat Template
Here’s a new template based off the original Cutline WordPress theme which is a sophisticated and very functional Blogger template. The best part is it’s extremely flexible and can be used for any type of blog. It allows you to switch out the header image which means the type of theme you can have is unlimited. It also comes with an integrated search box, rss feed icon, and 3 columns for adding any widgets you like. Here are 10 cool header images the original author has provided for you but like I said, you can swap out and use any image you already have. Just make sure the image you use is 900px in width by 200px otherwise it will look funny. The default image is the blue clock. So if you want to either use one of the other header images above or insert your own 900px in width by 200px image, you’ll need to follow these steps. Edit the header page element and select “Image from the web” and NOT “From your computer” otherwise the header image will come out funny. Next enter the actual image url you want to use (it needs to be on the web already like one of the 10 images above). If you decide to use one of the image above, just click on it to enlarge and copy the url from your browsers’ address bar. It will look something like this : http://i254.photobucket.com/albums/hh92/eblogtemplates/greypress/pedestrians.jpg Paste that into the “image from the web” text box and then hit save. The new image should be loaded up and you’re good to go! Thanks to Dan S for converting this cool WordPress theme into a new Blogger xml template! Also many thanks to Pearsonified for creating the original design! Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
How to add a different header image
Cats Template
Are you an animal lover especially for cats or kittens? If so, then this is the ideal Blogger template for you. This cute and fuzzy blog skin comes with four furballs of love that sleep all day and occasionally watch over your blog posts. Not only is this a cute template but it’s quite functional as well. It’s based off the “Tastelessly” Blogger template and includes the following cool widgets:
- Header tabs
- Search box
- Recent posts page element
- Recent comments page element
- Ads page element
When you first load up this new template, the recent posts and recent comments page elements won’t show up. You need to go to the page elements section and follow the directions on this post “How to Setup Your Recent Posts and Recent Comments Blogger Page Elements“.
Also, you’ll want to configure the tabs across the top. By default, it only comes with a “Home” tab but it’s easy to add in new ones. The widget page element is a link list so in your Blogger “Template” => “Page Elements” section, just go edit the “Top Tabs” widget and add new links and your additional tabs will magically appear! You don’t even need to mess with the template code like most other templates you download.
The ads page element defaults to a Text Link Ads 180 x 60 button which will disappear once you plug in your own. The page element is HTML so just paste in the code you want to use or delete the ad page element altogether.
All the images are hosted using our Pro Photobucket account (unlimited bandwidth) so your images will work all the time unlike other sites that offer this same template!
There’s not many Blogger templates out there with cats or kittens so this one is special!
This template was designed by Free CSS Templates and converted and enhanced into a Blogger template by eBlog Templates.
Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program!
Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger He
Pizza Template
Don’t let this pizza header fool you. This template is full of nice features and you can just change the header image to create whatever theme you want. But of course, if your blog is about pizza or Italian food, then there’s no need to change the header image. The sidebar lists your most recent posts along with the other standard page element items. You’ll need to change the links within the code so just edit and look for this section within the template code: Update the a href from # to whatever link you want to use. Also change the link name to a more realistic one. Enjoy! Original design by Free CSS Templates and converted into Blogger by Blog and Web Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Tastelessly Template
I’d like to welcome this latest converted Blogger template to our family. Tastelessly is a really cool three-column new Blogger template with lots of built in features. The header image is a cool spider web with morning dew glistening in the light. Some of the features include: When you first load up this new template, the recent posts and recent comments page elements won’t show up. You need to go to the page elements section and follow the directions on this post “How to Setup Your Recent Posts and Recent Comments Blogger Page Elements” You’ll also need to change the tabs at the top. Edit the template code and look for the following: Then change the a href and titles of each link (except the home link) to properly set it up for you. The ads page element defaults to Text Link Ads and Google AdSense 180 x 60 buttons which will disappear once you plug in your own. The page element is HTML so just paste in the code you want to use or delete the ad page element altogether. This template was designed by Free CSS Templates and converted into a Blogger template by eBlog Templates. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Daya Earth Template
This rounded style template with a nice header image of earth from space is called Daya Earth. It’s originally based off the Rounders Blogger template but evolved into this earth version. It’s got 3 columns so plenty of room to put your page elements or advertisements. Original design by Abdul Munir but the modified header was done by yours truly. Update 5/2/08 - Created demo site and added new sidebar widgets. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Revision History
WP-Polaroid Blogger Template
I’m very pleased to announce the release of WP-Polaroid for Blogger! This template is full of cool features and took me a long time to convert from the original WordPress theme (by Adii) so I hope you appreciate it. This template is very popular with WordPress users and for good reason. It’s stylish, nicely laid out, and very web 2.0. Not only that, it’s also got the following sidebar page elements built in. You just need to configure them (follow the directions below) in order for them to work properly. Make sure to read through all the steps below in order for the template to function on your blog properly. I tried to make it as simple for you as possible by using the Page Elements instead of embedded code but if you have any questions, please post them below. I usually get back to everyone within 24 hours so please be patient! Also, please be aware that in order to correctly setup this template you’ll need to be comfortable with editing the template code as well as some experience with photo editing software (see step #9). I’d hate for you to spend a bunch of time trying to get this template working only to hit a road block towards the end. Now I’m going to be honest with you before we begin. When you use this template you’ll most likely have to wipe out all your existing page elements and start from scratch. Not only is this easiest but it also gives you a clean slate. Now this isn’t always the case but I just wanted to warn you upfront. You might even want to setup a new blog within Blogger to test this template out before you really start using it. It’s easy to do — just go to your Blogger dashboard (top right corner link) and “create new blog”. Think of it as a testing area before clobbering your existing blog. Another option is to try and backup your existing page elements which is explained in my “How to Install a Blogger XML Template” article. Disclaimer: I am not responsible if you mess up your Blogger site. This template and set of instructions is free but does not come with any sort of warranty. I’m sure you already realize this but I just wanted to cover my butt regardless. (this is the fine print) The following 10 steps assume you’ve installed the new WP-Polaroid Blogger template and are now ready to configure the page elements. If you had trouble installing the template, try applying it a second time and saving. Blogger is buggy and that’s actually what I had to do when setting up a demo blog for this writeup (Update - you might want to start with step #10 and then come back to step #1 since it involves editing the actual template code before setting up the page elements). You can also download the original Photoshop .psd from Adii’s site if you’d like to modify the images. He also provides some steps on setting up the template but for WordPress only. Open your blog site in a new browser window so you can see how it currently looks. I’ve put some placeholder text in some areas (which we’ll replace in the steps below) to give you an idea as to how it’s supposed to look. Now in a separate browser window, head on over to “Template” =>”Page Elements” and we’ll start setting up your new Blogger template. First we’re going to customize the header and we’ll start with the Header-Text-Box-Left page element which you can see marked with a red square in the image. Now when you edit the page element you’ll see “Header-Text-Box-Left” as the title which you can change to something like “MORE ABOUT ME…”. Then add whatever text you want in the text box which will end up appearing below the title (like the white text in the image). Ok, save your page element and you’re done with this box. Do the same with the “Header-Text-Box-Right” page element and you’ll be finished with the header text boxes. Save and then refresh your other Blogger browser window to see what it looks like. We’ll take care of the header links and center puppy image later on since it requires editing of the template code. Let’s move on. These lists aren’t going to show up when you first installed 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 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. Pretty cool huh! 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. These two page elements are basically link lists where you can links to any sites. Did you know that you can actually sell links from your blog? It’s a very popular and growing business on the web since the number and quality of links to ones’ site increases their rankings in Google and Yahoo. If you want to learn more about selling links on your blog, check out Text Link Ads for more information. I use them and they do a 50/50 revenue split which is great since they handle the advertising & transactions. Anyhow, to setup the link page elements, click on edit of the My Sponsors page element and then enter the names and urls of the sites you wish to link to. Feel free to add a link to my site so other’s know where you got this wonderful template! Now do the same for the Link Love page element to get additional links added. If having both link page elements is too much, feel free to delete one from your page layout. This page element should have been working from the moment you installed this template. The only problem is it probably didn’t look right because the page element style needed to be set to “Flat List” so let’s do that now (if your blog archive list is already set to flat, then you can skip this step). Edit the page element and change the default of “Hierarchy” to “Flat List”. You’ll see it change in the preview window so you’ll know it worked. Click “Save Changes” and then save the page layout. Now view your blog which you have open in a separate browser window to see how it looks now. It should be correct. Now this is one of the unique and cool features about this template. It’s integrated with MyBlogLog which is a cool tool for showing pictures of visitors to your site. If you don’t already have an account, you need to set one up first before completing this step. Once you’ve setup an account, claimed your blog, then you can create a widget. I’m going to assume you’ve done those steps and are now ready to plug in your widget. You should be on this screen now within mybloglog.com. We’re going to make this very easy so don’t worry about any of the colors, width, etc and just click the “Preview and Get Code” button. I know this sounds strange but just stick with me here. So the next screen you’ll get a page with the blocks of code you can use. It will look like this: The only piece of that code that we need is the part I’ve marked in red. This is the mblID code which is the unique id just for your blog. you’re going to copy this entire id code (I covered some of the digits in the screenshot on purpose) which should be 16 numbers, and put it somewhere safe (like open notepad and paste it there for now). Then take this javascript code above and replace the “PUTYOURCODEHERE” with the 16 digit number you just put somewhere safe. Next, you’re going to edit the “Recent Readers” page element and paste this new code into the text box. It will look like the image below but it won’t wrap (I just did it for illustration purposes). Click “Save Changes” and go preview it in your blog. This will replace the current set of mybloglog pictures you see on your site with your set of visitors. Now don’t get too excited because there’s a good chance this section will be empty for a while (almost for sure if you just signed up for a mybloglog account) since you haven’t had any visitors yet so don’t worry. Give it a few weeks before you’ll see some pictures appear. I don’t know about most of you but I like to try and monetize my blogs. It’s a great passive income stream and fun to see how much you can make. Don’t expect a lot to pour in but at least get some ads on your site to make a few bucks. If you haven’t already read my “How to Make Money From Your Blog - Tip #1” article about setting up Google AdSense on your blog, I’d advice you to read it. You can create 125×125 ads within Google and place them in these spots, for example. Now let’s go edit the page element. You need to have three 125×125 ads ready to pop into this spot otherwise it’s not going to work. The images also need to be hosted somewhere so make sure you’ve got everything ready before moving forward. Here’s an example of what your code will look like: This is the actual code currently being used in your blog template. It’s placeholder code but important to keep so continue reading to understand why. It’s very important you keep the formatting of this section intact otherwise they won’t appear properly. I’m mainly speaking about the If you don’t have any ads to use yet, feel free to keep the placeholder ads there. I recommend clicking on the three ads and setting up accounts with them so you can make money with your blog. If you don’t want the ads you can just delete this page element from your page layout. Yes, you’re probably wondering why there’s a picture of a cute puppy on your blog. The good news is I actually put it there as a placeholder so it’s easier for you swap out and add your own image. The bad news is you’ll need to have some photo editing skills in order to get the image setup correctly. So first let me tell you how to change the image and then second, explain how to add your own instead. The puppy image code is in the .css part which looks like this: This is where you’ll need to put the link to your new image. If you don’t want an image at all (or at least for the time being) then just delete the url and the default black polaroid picture will appear. The puppy picture is just positioned on top of the default black picture. So before you can add a new photo, you’ll need to properly size Due to popular demand, I’ve made the polaroid header image straight so it’s easy to add your personal photo without having to rotate it. It’s included in the latest version so just download and you’ve got it. This sets up the photo to the right size to fit back on top of the polaroid background. Next, save the image you just modified (You can save the photo in any of the standard image formats like png, gif, jpeg, etc) and upload it to a place online where you can link to it. There are free image hosting services like Photobucket, Googlepages, or ImageShack just to name a few. I personally use Photobucket but any of those will do. You’ll need to setup a free account and then you can upload your images. After you’ve uploaded your new image, you need to get the url where the image is now located. If you decided to use Photobucket, your new url will look something like this: Take that url and replace the puppy.png url I showed you above. Save your template and reload your blog. Your new picture should now be on your home page! If not, then double-check and make sure you correctly uploaded the photo and it works. If you see your photo on your home page but it’s just not aligned properly, then you’ll need to go back to your photo editing program and tweak it some more. Another option is to edit the .css file and search for UPDATE: If you also want to remove the “Polaroid of Me” text across the default polaroid picture you can. You’ll need to edit the template code and replace the existing polaroid image on line 219 with this one. Search for “rotator.png” then replace it with “blank-polaroid.png” and you should be good to go. (Thanks to Lindsay in the comments below for the suggestion!). The latest download version now comes without the text on the polaroid picture. This will make your new links aligned neatly instead of being squished to the left. You can style them even further (color, size, etc) but you’ll have to do that on your own. Update 4/22/08 - Several people requested to have real 125 x 125 ads instead of the blank placeholder ones so this has been done. A new screen shot shows how this looks as well as the live demo. You can swap out the ads or keep them there indefinitely if you don’t have any ads to use. Update 5/17/08 - Fixed the individual post image right align issue. You can easily fix this yourself if you’re using this template prior to 5/17. Search your template code for “.postmetadata” and then change the padding element of “15px” to “20px”. That will push everything down and align the images correctly. Thanks to Ricardo for his help on this. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
Step #8 - Configure the Three 125×125 Ad Spots WP-Polaroid Blogger Installation
Step #1 - Configure the Header Page Elements
Step #2 - Setup Recent Posts and Recent Comments Page Elements
Step #3 - Setup My Sponsors and Link Love Page Elements
Step #4 - Configure the Blog Archive Page Element
Step #5 - Configure the Recent Readers Page Element
class='last' tag at the end of the third 125×125 ad. If that isn’t included in your code, it will look funny on your site. This is a hard step so hopefully you got this far.Step #9 - Change the Puppy Header Image
/*=== Change this header puppy picture to one of yours ===*/
#polaroids-pic{
background: url(http://i254.photobucket.com/albums/hh92/eblogtemplates/polaroid/puppy.png) no-repeat;
and rotate it. So open your picture in any photo editor like MS Paint, Adobe Photoshop, Paint.net (free download), GIMP (free download), or Picasa. If you don’t have software already installed, you can always use one of the free online photo editing sites instead like Picnik, Phixr, or FotoFlexer. Whichever photo editing software you decide to use, get ready to make the following two changes.Rotate the photo 4 degrees counter clockwiseUpdate (2/1/08)
http://i254.photobucket.com/albums/hh92/yourname/newfolder/yourpicture.png #polaroids-pic { . There you can the position, height, width, etc for fine tuning. You really shouldn’t need to mess with those settings though.
Styleicious Template
Styleicious is a cool web 2.0 style Blogger template with tabs across the top right. The header is a soft aqua blue and the body contains 2 or 3 column, a nice footer where you can put your post archives, and a search box to boot. To change the tab urls and names you need to edit the template code. Open the .xml file in a text editor and then search for this: Now you can change the hrefs and tab names to whatever you like. All images are pre-hosted on our photobucket.com pro account which has unlimited bandwidth. That means you don’t need to worry about the images not showing up which can happen to other Blogger xml templates. This theme was originally designed by Tom over at thaslayer.com and converted into this Blogger template by Francisco from Blog and Web. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
The Globe Template
This tan colored template starts off with a globe image in the header and has rounded modules throughout the body. It’s a web 2.0 looking Blogger template and easy to change the header image and colors within the code. There is also a subscribe feed module that you need to update if you want it to work properly. I would recommend that you delete the feed urls that you don’t have setup yet or just setup an Feedburner account instead. This “How to Setup Feedburner on Blogger” post will explain how to get one easily setup. This template is based off the original “Rounders4″ template by Douglas Bowman and was modified and renamed to “The Globe” by Template Panic. Ready to super charge your blog? Check out our professional premium blogger templates or make money by joining our blog affiliate program! Want to make your blog stand out from the crowd? I recommend giving your newly downloaded Blogger template a unique and personalized look. Read our Free Blogger Header Images article and find yourself a great custom header image!
