Free background for your blog: Red Ribbon Holiday

2 column

3 column

Click on the image to download the original size. Click here to see how to set your own photo for your Blogger blog’s background

Enable mobile template for your blogger blog

Many of you like to view blog posts on your smartphones. However, it can be difficult at times because of the small screen size. Today, Blogger Team announced that they launched of mobile templates for Blogger in Draft users. Initially available as opt-in functionality on Blogger in Draft, mobile templates will re-format your blogs for smartphones to enhance your readers’ viewing experience. To enable mobile templates for your blog, simply go to Dashboard | Settings | Email & Mobile tab, enable the mobile template option and then save settings.

• Preview: Get a glimpse of what your blog will look like by clicking on the Mobile Preview button. You can also see it on your smartphone by scanning the QR-code to the right of the options.
• Automatic redirection: All opted-in blogs will automatically be redirected to the mobile view when accessed from a smartphone.
• Template support: Blogger is initially supporting 6 variants of the Simple template and 6 variants of the Awesome template. If you have used one of these 12 templates through our Template Designer, your mobile view will be rendered in the same style as your desktop view (other template variants will be rendered as Simple). Some gadgets are also supported.

Free Christmas header images for your blogger blogs

Here are 35 free Christmas header images for your blogger blog in this Holiday Season. Click here if you don't know how to adding an image to your blog header.

Posting a video from YouTube to your blog

It’s as easy to add a video to your blog from YouTube. While you are watching a YouTube video, click “Share” button, and you will see Blogger as one of the places you can share the video to. Click on Blogger, and you’ll see the familiar BlogThis! mini post editor -- all you have to do is to select a blog (if you have more than one blog, that is), fill out some content, and then Publish the post.

More Control of Your Blog Feed

Feeds are a great way to reach a broader audience and keep your loyal readers up-to-date. In fact, it’s not uncommon for blogs to have more than a quarter of their traffic come from feed readers.

"The challenge with feeds is that it’s never been possible to control exactly how much content is delivered. Up until now, the options have been “Short” and “Full”. Short produces a feed that contains around the first 400 characters of the post, with HTML and images removed. Full produces a feed that contains everything in the post, including HTML and images. But what about those instances where you want to give your users a taste—an image or two with some introductory text—and then have them visit your blog to see the full post?" Today, Blogger team announced on their blog that they've launched a third option that lets you do just that using Jump Breaks.

To enable this feature, simply go to the Settings page for your blog, click on Site Feed, and then next to “Allow Blog Feeds”, change the drop-down value to “Until Jump Break”.

Next time you write a post and use a jump break, anyone reading the feed will get all the content, including images and HTML formatting, up until the jump break (if there’s no jump break, the feed will contain everything). If readers want to see the full post, they can click the “read more” link and they’ll be directed to your blog. This means you have full control over your feed. For example, want to include an image for your recipe but not the whole recipe? No problem! Put the image and part of the recipe before the jump break, and that’s all the feed readers will see.

Free Blogspot Template: White Clean Magazine

Preview: http://whitecleanmagazine-template.blogspot.com/

• From your Blogger dashboard, go to Design | Edit HTML
• Make sure to back up your old template before install this new one by click on the "Download full template"
• Check on the "Expand Widget Templates"
• Now copy/paste this code to replace all the code in the HTML code section
• Click Save Template button and you're done.

Adding recent comments to your blogger blog

• First of all, login to your Blogger blog.
• From your Dashboard blog, to go Design then click on Add a Gadget from Page Elements panel.
• Choose HTML/JavaScript and copy/paste the code below in it

<script language="javascript">
var numcomments = 7;
var numchars = 50;
</script>
<script src="http://yourbloggerblog.blogspot.com/feeds/comments/default?
alt=json-in-script&callback=commentDisplay"></script>

• Click on SAVE button and you're done.

* Remember to change the URL "yourbloggerblog.blogspot.com" to your blogger's domain name to show your recent comments. In this hack, you can change the number of comments that you want to display on your blog in the line "var numcomments = 7;" and the line "var numchars = 50;" will show the characters in each comment.

This looks better than Adding recent comments to your blogger blog by using Feed URL

Upload Image button added to Edit HTML mode

Blogger team has added the Upload Image button to Edit HTML mode for users who are using Blogger in Draft for blogging as they announced on their blog:

We heard lots of feedback recently about how you’d like to be able to upload an image in the post editor’s Edit HTML mode, so we’ve added it into the new post editor’s toolbar with today’s release. You’ll see it right now if you go into the post editor. Hopefully this saves you a few extra clicks next time you need to add images to your posts.

More fonts for your Blogger blog

Today, Wongoo Lee from Blogger team announced that they have added 40 new more fonts for bloggers who are using their Blogger blog service.

Self expression is a beautiful thing. It’s one of the best things about having a blog—a place where you can control the look and feel of your message and how it’s presented. Today we’re excited to announce another amazing way to make your blog truly you—Web Fonts.

The Web has traditionally been pretty limited when it comes to font selection, especially for non-Latin alphabets such as Cyrillic and Greek. But great strides have been made in this arena by our friends on the Google Web Fonts team, and finally there are more choices out there than just Arial and Times New Roman. In fact, there are now 40 new fonts on Blogger in Draft for you to choose from. And we’re just getting started—lots more to come!

Simply go into the Advanced tab of the Blogger Template Designer, select the type of text you’d like to change (Post Title, Page Text, etc.) and pick from a number of exciting, new fonts such as Reenie Beanie  or Neucha (Cyrillic) or GFS Didot (Greek) or even Hanuman (Khmer). You will be spoilt with choice!

How to create a "Random posts" list on your blog

Like its name, this hack will help you show your blog posts by random and help you to increase the number of page impressions from readers.

Creating a "Random Posts" list on your blog is very easy.

Login to Blogger with your account.

• From your Blogger dashboard, go to Design then click on Add a Gadget, choose HTML/JavaScript Add
• Copy/Paste the code shows below to Content section
  

  <script type="text/javascript">
  var randarray = new Array();var l=0;var flag;
  var numofpost=10;function randomposts(json){
  var total = parseInt(json.feed.openSearch$totalResults.$t,10);
  for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
  if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');
  for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];
  for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";
  document.write(item);}}
  }document.write('</ul>');}
  </script>
  <script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>

• Click on SAVE button to save your work and you're done.

* You can change the number shown in red any time you want to change the number of posts will be displayed on your own list.

Free Blogspot Template: Facebook Lover

Preview

• From your Blogger dashboard, go to Design | Edit HTML
• Make sure to back up your old template before install this new one by click on the "Download full template"
• Check on the "Expand Widget Templates"
• Now copy/paste this code to replace all the code in the HTML code section
• Click Save Template button and you're done.

Free Blogspot Templates: Blog Theme

Preview

• From your Blogger dashboard, go to Design | Edit HTML
• Make sure to back up your old template before install this new one by click on the "Download full template"
• Check on the "Expand Widget Templates"
• Now copy/paste this code to replace all the code in the HTML code section
• Click Save Template button and you're done.

How to adding Facebook button after every of your Blogger posts

The Faceook Like button lets a user share your content with friends on Facebook. When the user clicks the Like button on your site, a story appears in the user's friends' News Feed with a link back to your website.

When your Web page represents a real-world entity, things like movies, sports teams, celebrities, and restaurants, use the Open Graph protocol to specify information about the entity. If you include Open Graph tags on your Web page, your page becomes equivalent to a Facebook page. This means when a user clicks a Like button on your page, a connection is made between your page and the user. Your page will appear in the "Likes and Interests" section of the user's profile, and you have the ability to publish updates to the user. Your page will show up in same places that Facebook pages show up around the site (e.g. search), and you can target ads to people who like your content.

Here is how to adding Facebook button after every of your Blogger posts:

• From your Blogger Dashboard, go to Design | Edit HTML
• Check on the Expand Widget Templates
• Scroll and find the code <data:post.body/> then copy/paste this code after it:
  

  <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>

• Click Save Template and you're done.

Magazine Style Drop Caps

Dropcaps like in a fancy magazine is what you see in this post. If you like this tip, just follow this guide step by step.

Go to Design | Edit HTML in your Blogger Dashboard, and then paste the code below to your CSS-definitions between the HEAD tag.

.dropcaps { float:left; color: $headerBgColor; font-size:100px; line-height:80px; padding-top:1px; padding-right:5px; }

Now in every of your posts, you need to put the fisrt letter between the tag SPAN like this: <span class="dropcaps">D</span> in Edit HTML section. The result is very nice: a large capital that stretches over 5 lines in your post.

Remember that you can change the font size bigger or smaller or setting the color in different from the code above if you want.

* Tips: To make it easier, Post Template will help you save your time by pre-formatting the post editor with text or code that will appear each time you create a new post.

• In your Blogger Dashboard, go to Settings | Formatting then scroll down and you'll see the Post Template section at below of the page.
• Copy/paste your text or code that you want to edit here.
• Click Save Settings to save your changes.

Here is an example for Dropcaps hack in this article:

Free background for your blog: Happy

Header

Background

Click on the image to download the original size. Click here to see how to set your own photo for your Blogger blog’s background

Adding recent comments to your blogger blog by using Feed URL

It's easy to add your blog's recent comments to your blogger blog by using Feed URL for now.

• From your Dashboard blog, go to Design | Add a Gadget in Page Elements panel
• Choose Feed then paste your Feed comment URL here: http://yourbloggerblog.blogspot.com/feeds/comments/default. Remember to change this URL to your own domain name.
  
  
  
• Click COUTINUE and choose any options that you want to display on your blog: number of comments, authors, dates
  
  
  
• Click SAVE to done your work

Enjoy! :-)

How to change the date or time of your post?

The date and time settings for a post are beneath the post-editing field, just click the "Post Options" link:

This will reveal some more settings for your post, including the date and time, which are on the right-hand side. Once you've selected a new date and time, be sure to publish your post.

With automatic date and time, your posts will now be timestamped with the date and time that they’re published, not the date and time when you first opened the post editor (as has been the case). You can of course still explicitly set the date and time by opening Post Options and switching to Scheduled at instead. Once a post is published, it will keep its date by default, even if you go back even if you go back to edit the post and re-publish.

How to put Facebook Badges to your Blogger blog

Facebook can easily be integrated into almost every aspect of your life, from mobile phones to personal Web sites. Put your badge on a site and it will be automatically updated and visible to anyone (even non-Facebook users). This is great for signatures on a forum or as a sidebar on your own Web site.

Now, it's easy for you to put your Facebook badge on your own Blogger blog.

• Login to your Facebook account
• Go to the Facebook Badges pages
• Choose the badge you want to put on your Blogger blog
• Click on the Blogger icon on Preview page to put it on your blog
• You're done

Create a Custom Badge

• After choosing a badge to put on your blog, click on "Edit this badge" on Preview page
• Set the basic layout and format
• Add any items from the drop-down menu that you want to include in your badge. Click the "Add Item" button to add it to your badge. You may add more than one item. With no template, you can add anything you want to your badge. It will preview as you make additions.
• Hit the "Save" button to complete your badge and get the necessary code to post it.

There're 4 Facebook badges for now:

• Profile Badge Share your Facebook information on other websites
• Like Badge Show off your favorite Pages on your website or blog
• Photo Badge Share your Facebook photos on other websites
• Page Badge Share your Facebook Page information on other websites

Blogging from iGoogle and Gmail

The Blogger Posting gadget makes it easy to post to your blog from the convenience of Gmail or your iGoogle homepage.

To add the Blogger Posting Gadget to your iGoogle page, simply click this button:



Then click the blue "Add to Google" button. Make sure that you're signed in with the same Google account that you use for Blogger. Once you've added the Blogger Posting Gadget you will see the gadget on your iGoogle page:

To add the Blogger Posting Gadget in Gmail, you'll first have to enable the Add Gadget by URL lab feature from your settings:

Once you've enable this Labs feature, then you can add the posting gadget by simpling entering its URL into the Gadget tab in your Settings. Here's the URL:

http://www.blogger.com/gadgets/post.xml

In the top right corner of the gadget you will see the title of your blog. If you have more than one blog, there will be a drop-down menu in the corner so you can select the blog you'd like to post to. You can then enter a title and write a post. You also have the option to add labels to your post as well. Once you have finished writing your post, click "Publish" to publish your post or click "Save Draft" to save your post back to Blogger without publishing it.

Tips:

• The gadget supports editing the HTML of title and body.
• If you start writing a post and decide you want to upload images or use other rich text features, just click "Save Draft". The gadget will save your post, then give you a link to directly edit the post in Blogger.
• The gadget works in Firefox, Chrome, Safari 3, Internet Explorer and on the iPhone.

Free Blogspot Templates: Blogger Addicted

Preview

• From your Blogger dashboard, go to Design | Edit HTML
• Make sure to back up your old template before install this new one by click on the "Download full template"
• Check on the "Expand Widget Templates"
• Now copy/paste this code to replace all the code in the HTML code section
• Click Save Template button and you're done.

Stats Gadgets

After launched the Blogger Stats to Blogger in Draft, Blogger staff has created two new gadgets that you can add to your blog to show your readers interesting stats from your blog: Blog’s stats and Popular Posts gadgets.

The data for these gadgets is automatically taken from Blogger Stats. To use them, go to Design | Page Elements, and click on “Add a gadget.”

The Blog’s stats gadget displays total pageviews* of your blog. The gadget comes in different styles and also features an optional sparkline graph.
(* The pageviews are counted from when Blogger rolled out the Stats feature, not from the first day your blog was created.)

The Popular Posts gadget helps your readers quickly find out which of your posts have been viewed the most by your readers. The gadget also comes with several different styles and configurations.

The new Stats gadgets are available now on Blogger in Draft, so you can go ahead and give them a try now.

* Tips:

In the Blog's Stats gadget, you can choose the time window of your pageview counts (All Time, Last 30 days, Last 7 days)

In the Popular Post gadget, you can now choose the number of posts you want the gadget to display.

Free Blogspot Templates: Vintage Romance

Preview

• From your Blogger dashboard, go to Design | Edit HTML
• Make sure to back up your old template before install this new one by click on the "Download full template"
• Check on the "Expand Widget Templates"
• Now copy/paste this code to replace all the code in the HTML code section
• Click Save Template button and you're done.

Free Blogspot Templates: "Travelling Logbook"

Preview

• From your Blogger dashboard, go to Design | Edit HTML
• Make sure to back up your old template before install this new one by click on the "Download full template"
• Check on the "Expand Widget Templates"
• Now copy/paste this code to replace all the code in the HTML code section
• Click Save Template button and you're done.

Set your own photo for your Blogger blog’s background

In your Blogger Dashboard, go to Design | Template Designer | Background, click on Background Image, and you’ll notice the “Upload image” option, which will allow you to select and upload your image.

For images that fill the entire background, we recommend using a resolution of 1800 pixels wide and 1600 pixels high, and file size less than 200KB to minimize the loading time of your blog pages. Google only supports JPEG, GIF, and PNG format images.

After uploading a photo, you will see additional options that are not available for the built-in images: Alignment, Repeat, and Scroll options.

• Alignment: You can adjust horizontal (left, center, right) and vertical (top and bottom) alignment of your background image.
• Repeat (Tile): If you have a small image, you can have it repeat horizontally and/or vertically to fill the page. Otherwise, we recommend that you choose a page background color that blends in with your background image.
• Scroll: By default, your image stays in place while readers scroll the page contents. By selecting the “Scroll with page” option, both the background image and page contents scroll together. We recommend that you use an image that blends into your background color or set your image to tile vertically if you choose this option.

This feature is only available on Blogger in Draft for now.

How to promote your FeedBurner feed on your Blogger blog

One of the ways to promote your FeedBurner feed on your Blogger site is by using FeedBurner's Publicity Tools to select a "chicklet" image to display a link to your FeedBurner feed from your blog's homepage.

1. Click the Publicize tab. A list of publicity-related services appears.

2. Locate and click the Chicklet Chooser service.
   
   The form shown below loads into the right side of the screen:
   
   
   
   
   This form contains several options for buttons that promote (and link to) your FeedBurner feed.
3. Click the radio button next to the button you want to display on your site.
4. From the drop-down select "Blogger", then click Go! to add the chicklet as a widget.
.

5. Blogger will open in a new window. Follow the prompts there to continue to add the new widget.