Posts

Showing posts from 2009

How to Add Blog Posts Automatically to Twitter

Image
You can automatically add links of your blog’s post updates on your Twitter profile whenever you publish a new post. If you didn’t knew about this then let’s see how to do it. First of all you need a Google FeedBurner account to enable this feature. Most bloggers use this service to manage their feeds. If you use Blogger and have not done it yet then set-up FeedBurner first. Next, sign in and go to “Publicize” tab.

How to Add Popular Posts Widget to Blogger

Image
Show the popular stories and articles of your blog in your sidebar. Give your visitors a reason to stay on your blog. Add popular posts widget in Blogger. It work on the total number of comments a post gets. So we can also call it as 'Most Commented Widget'. Many of you have expressed an interest in this widget, so I thought to give you the tutorial on it. See an example on Popular Posts page of my blog.

Add Follow me on Twitter Icon to Blogger

Image
You may like to add a “ Follow me ” button or icon to Blogger to increase the number of followers for your Twitter account. I will give you two types of tutorials. First tutorial is for a normal one and the second is for the fixed and floating button.

Add Two Sidebar Columns below Main Sidebar in Blogger

Image
I have told you about creating three columns in Blogger template. Many of us try to avoid this as it may sometimes look clumsy but we need widget sections to add some gadgets. Now if you want to add two small sidebar columns below main sidebar in your Blogger template, then I will tell you how to do it. So let's start!

How to Upload or Download Blogger Template (Video)

Image
In this tutorial we will discuss how to download and/or upload Blogger templates. It is a very simple process and can be done by a click of a button. Yes, you heard it right, see the video tutorials below. Sometimes you may need to back up your templates for certain reasons, like for example, if you are modifying your template then you may like to back it up if by chance anything goes wrong. Or you want to upload the old or a new custom made, stylish template that gives you what you need. Points to be noted For ease, login to Blogger, go to your blog’s Template tab and find “Backup/Restore” button on top-right corner. The Blogger templates are in XML file format, that is, the extension is .xml . Sometimes, templates which are custom made and that are available to download from other sites, comes packed in Zip (also .zip ) or RAR (also .rar ) formats. You need to extract them using software like WinRAR or 7-Zip (freeware).

Tutorial to Add Image to the Header in Blogger

Image
To add an image to the header of blogger, first go to Blogger’s Dashboard > Design > Page Elements tab. Under this tab you will find the layout of the template you are using. At top you will find the Header widget, click Edit. A pop up window will open. You will find that here you can change your title, description and image . Now upload your image from computer or put the URL of the image if you already had uploaded it. Check the box “ shrink to fit ” if you think that your image is greater in size than you header . At last save your widget.

2 Simple Ways to Get Traffic to Your Blog

Increasing traffic to your blogs and websites in not easy thing to achive. If you are owner then you do need visitors which is really very difficult for new blogs and that is also if the blog is similar to other competitive sites. If your blog contains absolutely something new that a visitor may find interesting then you are on “get, set and go” and traffic will automatically start to flow. But there also something that must be done to promote it and let others know too. Here are two simple ways that you can and must do to increase your blog’s traffic.

How to Add Retweet Button to Blogger and Customize it

Image
“The retweet button is for blog and website publishers who want to encourage their readers to tweet their content on Twitter.” This button also acts like a twitter counter. It not only allows your readers to tweet your blog posts to their twitter accounts but also shows the number of times your blog posts has been tweeted. You can easily get the source code from TweetMeme but here also need an explanation on how to add this to your blogger posts. Generally when you get the code for the full script, it will look like: <script type='text/javascript'> tweetmeme_url = ' http://yoururl.com '; tweetmeme_source = ' tweetmeme '; tweetmeme_service = ' bit.ly '; </script> <script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/> Now for an explanation: ' http://yoururl.com ' is the blog post URL, change it to ' <data:post.url/> ' ' tweetmeme ' is the twitter account, change it

How to Get Your Blog Indexed Quickly

If you are having trouble to get your blog indexed by search engines or you are unaware of it, then you must be thinking to do something very quickly. Indexing by major search engine is really important to get visitors your blog if you want it to be read by others. In this article I will tell you the simple steps that every blogger can do to get your blog indexed by Google, Yahoo and Bing as quickly as possible. First of all, check whether your blog is already index by searching for site:www. example .com in search boxes of respective search engines. If you think you are not happy with the results then here is a check list.

How to Add Social Bookmarking Icons to Blogger

Image
If your blog post is just awesome then adding social bookmarking icons or buttons below Blogger posts will let your readers to bookmark and share your posts with their friends. People are becoming social, sharing things on Facebook, Twitter and other social networking sites. I have seen that there are many times when I get more readers for my blog from social networking sites whenever someone shares my posts with their friends. You may also like to get social by adding bookmarking and sharing buttons, so I made and have updated this tutorial with 14 best bookmarking sites including a feed icon of your blog's feed. Demo Advantages of Adding Custom Sharing Icons It is more flexible than official Blogger share icons due to: Use of custom images which can be of your choice with different styles and sizes. More social networking sites to share your posts. It is faster than other sharing scripts. And many more as it can be customized.

Add Floating Back to Top Icon Button to Blogger

Image
You can tell you readers to go to the top of the page by adding a floating “ back to top ” icon image. It is simple and very easy to add to Blogger powered blogs. For those who don't know, it is an up icon which indicates to directly go back to the top of page the reader is reading. This can be found floating mainly in bottom right-hand corner and in some blogs at bottom left-hand. A simple but effective way.

How to add Read More option - Officially from Blogger

Image
If you are looking for a hack to add Read more to Blogger to hide full posts, then stop searching because Blogger has now officially announced this option for us which is also known as Jump Break . Now you don't have to add any separate hack in your template. What you have to do is enable some options in your Blogger settings and you are ready to use this feature. Thinking what are the options you have to enable! Well, let us find out. While posting a new post, write a paragraph, use the "jump break" option and continue writing again. This is the option which will add the read more link to your posts on your homepage.

Create your own Contact Form with Kontactr for Blogger

Image
Kontactr is one of the simplest, fast, light weight and effective contact forms that I ever came across. It is not only easy to create but is also like a breeze to add it to Blogger. I have already told the main features but it does not end here. It has got CAPTCHA protection to stop all those spam massages and the best of all is it’s free. You need to follow some easy steps and you are ready to receive all those important emails. Step 1: Visit Kontactr and signup. Step 2: After confirmation, login and copy the codes given in “AJAX Widget”. Step 3: Login to Blogger and create a page form Pages tab (also known as “ static page ”) from your blog's dashboard . Give the page a title, like, “Contact me” or anything that you like. Step 4: Paste the copied code (as told in step 2) and Publish the page. That is it. However, you can also customize it so that it matches the background color of your blog. There are some other options too, for example, instead of a form, you can hav

Hide Number of Posts Shown Beside Particular Label

Image
You must have seen that when you add a label widget in Blogger, it’s showing the number of posts each label contains. Well, you may don’t want to show it. To hide the number of posts showing per label in Blogger, you have to enable some settings and to do that you need not to edit your template for it. Go to Design > Page elements tab and click the edit button under the label widget. Now uncheck the “Show number of posts per label” and save it. View your blog and you will find that the number that is shown beside each label is gone.

How to Add Labels Cloud to Blogger

Image
Blogger introduced a new feature. It’s called Labels Cloud . Now you don't need to find for hack and JavaScript to add labels cloud to blogger. All you have to do is go to Design > Page elements and add a Labels gadget and check the Cloud option. Now while adding it, select the “ cloud ” option. A label will appear bigger if it has more posts tagged under that label and will appear smaller if it has less posts, more like a cloud of labels. Try it in Blogger.

All about Social Bookmarking

Image
What is Social Bookmarking? Social bookmarking is a way for web users to explore, store, organize and deal with the bookmarks of sites and webpages on the web with the aid of metadata. Users save links of the pages that they would like to remember and/or share. These bookmarks are commonly public, and could be kept privately and shared only with specific people or groups or can be shared only inside certain networks and domains. Why do I need it? For bloggers and webmasters, social bookmarking is a useful way to access a combined set of bookmarks

Add Three Columns in Footer to Blogger

Image
Keeping you sidebars clean makes your blog look good. This is where the role of the columns in footer section comes in. Also it will give your blog a new style. For example, see at the bottom of my blog. This simple tutorial will explain how to do create and add three sidebar columns to footer section in Blogger templates.

Hide Post from Appearing on Homepage of Blogger

Image
Hiding a post appearing on first page or better say homepage of Blogger is really a simple trick. It’s a trick which is all about posting a blog post to a certain date. Sometimes it may so happen that you may do not want any blog post to be seen on the homepage and it’s not a static page on Blogger . So you need to hide it. To be true, you cannot hide any posts if you have published it but you can back-date it while publishing so that it does not appear on the homepage.

Show HTML/JavaScript Codes within Blogger Posts or Comments

Image
Have you faced any difficulties to show some particular codes or snippets within Blogger Post Editor or within the comment section? I hope, most of you did and still do. Well, I have the perfect solution to this. While writing you will notice that every time you use "less than" sign ( < ) or "greater than" sign ( > ) to show JavaScript or HTML codes and snippets, either in Blogger Post Editor (in HTML mode) or within comments, it does not get published or better say, not visible. This happens because Blogger recognizes it as codes that should be used for formatting purpose only. The only solution is to encode them. So to show JavaScript or HTML codes within Blogger posts or comments, use &lt; instead of < and &gt; instead of > . Now if there are big codes then search for online tools to encode your codes. This is the simplest method to show JavaScript and HTML codes within Blogger comments or posts

How to Add Favicon in Blogger

Image
Today we will learn how to add favicon to blogger . "Favicon" is the short name for favorites icon, also known as a website icon and is a recognition tool for your readers to identify your blog. Browsers displays it within address bar and/or next to the blog and pages' name or in the list of saved bookmarks. For blogs on blogger platform, you will see blogger's default orange favicon. This can be overridden with your own favicon. To add favicon in blogger, make yourself a blog logo image in "16x16" or "32x32" pixels in ".png", ".gif", or ".ico" format. Upload it in any image hosting site and get it's direct URL. Go to Design > Edit HTML and add the below code after <head> : <link rel="shortcut icon" type="image/x-icon" href=" http://image URL "/> Replace the image URL with your hosted image and save your template. Now view your blog, you will find out that the default f

List of Tutorials for Blogger

Image
I have made a list of Blogger tutorials that are posted in my blog. You can find many tutorials on editing and customizing Blogger templates and make your blog unique and beautiful. So let's browse through what can we find. It's divided into segments. To go to each segment just click the links below to scroll to that.

How to Add Sidebar (Widget Section) to Header in Blogger

Image
Add a new widget section by creating sidebar within the header section in your Blogger template and see how a simple looking header goes up to the next level and turns into something new and stylish. It is really a simple tutorial and adjusting it according to your style, you can add search box, subscription buttons or anything you want to be viewable beside your blog's tile, within blogger header. Now let's have a tutorial.

Hide Full Posts, Create Post Summaries - Expandable

When I started blogging I found out that full posts are visible on first page. Now that does not looked good on my first page. How am I gonna hide full posts, create posts summaries and add a "Read more..." option in my blog? Well by default, blogger doesn't provide one. So you have to make it yourself. So lets have a tutorial on it.

How to Create Three Column Blogger Template

Image
You must have seen many blogs having three columns. You may also want to make your own three column Blogger Layout Template and give your blog a new level in style. So let's do it with a simple tutorial. You can see in Design > Page elements that you already have two column, one for the main body and the other is the sidebar. So you need to create and add an extra sidebar column. Adding the Third Sidebar Column in Blogger Template

How to Make Footer Increase in Width in Blogger

In previous tutorial I have told you how to expand Blogger Header the width of the Browser . Now apply this same rule to increase the Blogger footer section the width of the browser. Let's have a tutorial.

How to Hide or Remove Blogger Navbar

Image
Let’s remove the Navbar to give your blog a more professional look. At the top of Blogger blogs, you'll see a bar in blue or transparent colors which enables you to sign in, search, go to next blog, customize, etc. It is known as Navbar . This can also be found under the Layout tab (on top-right corner) under Blogger’s Dashboard. I have removed it due to some reasons. Neither did I find it to be much useful nor it was not going with my template design. If you think that these reasons are enough for you too to remove Blogger Navbar then follow anyone of the tutorials as told below.

How to Make Blogger Header Expand the Width of the Browser

Image
So in this segment, we will customize and expand the blogger's header section to the width of browser. Increasing the Width of Blogger Header in Simple Way

Subscribe to Simple Blogger Tutorials

Image
If you would like to receive updates of articles posted on Simple Blogger Tutorials, please subscribe to the feed. Visit Blogger Tutorial List to find the tutorials you needed.

Create Your Own Free Blog with Blogger

Image
Launched in 1999, Blogger , a Google Service, is a great way to create your own blog for a starter. Blogger is totally free with free hosting. Blogger is for: To share your thoughts, photos, and more with friends and world. Easy to post text, photos, and videos from the web or your mobile phone. Unlimited flexibility to personalize your blog with themes, gadgets, and more. First we going to learn how to create your own blog with some simple steps below:

After Uploading Blogger Templates

Upload your template form blogger 's dashboard > Design > Edit HTML tab and check " Expand Widget Templates ". All you have to do is edit the links. So find for: http://www.facebook.com/Blogger.Tutorials http://twitter.com/blogger_raju http://www.youtube.com/ And replace these with your Facebook and Twitter IDs. Now for the navigation bar, find: <ul> <li><a href='/'>Home</a></li> <li><a href='#'>Products</a></li> <li><a href='/p/about.html'>About</a></li> <li><a href='/p/contact-me.html'>Contact Me</a></li> <li><a href='#'>Edit</a></li> <li><a href='#'>Edit 2</a></li> </ul> You will find that it's a list of links formated in "ul" and "li". All you have to do is change and add your links as shown in the example below: <ul>

Permissions Settings of Blogger : Blogspot Basics

Image
The Permission Settings for blogger can be found within the Settings tab. Let's have a glimpse on it. Blog Authors: You can add authors for your blogspot blog in this setting. Click “ ADD AUTHORS ” and invite him/her by typing in the authors email. The author will receive an email about the invitation with a confirmation link. Blog Readers: Here you can set the readers for your blog. If you want your blog to be publicly readable then select “ Anybody ”, “ Only people I choose ” is for selected members and if you want your blog to be readable only by you and your blog authors and no one can visit your blog then select “ Only blog authors ”.

Email and Mobile Settings for Blogger : Blogspot Basics

Image
For Blogger's email and mobile settings go to Settings > Email & Mobile . Show mobile template: This is a new settings which will enable mobile version of your blog. Select "Yes" if you want it otherwise "No". BlogSend Address: You can enter upto 10 email address to send your blog posts as notification. Email Posting Address: Also known as Mail2Blogger , which can be used to directly publish your blogger posts from your email address . First you have to set a pass-code as username.your-passcode@blogger.com and select weather to “Publish emails immediately” or “Save emails as draft posts”. Mobile Devices: You can also add your mobile device to publish your posts to Blogger on the Go. Click “Add mobile device”, a pop-up window will open with a verification code which will asked to resend to go@blogger.com . Learn more about using mobile devices for blogger .

Advance Settings of Site Feed for Blogger : Blogspot Basics

Image
It's very important to setup blogger's feed in proper way. This can be found on Settings > Site Feed tab. You will find every basic thing there itself so let’s switch to Advance Mode . Blog Posts Feed: Select “Full” to syndicate the full content of your post. Select “Short” if you only wish to syndicate the first paragraph, or approximately 255 characters, whichever is shorter. The new settings "Until Jump Break" allows your feed to be shown to that particular position you have used "Read More" option . Blog Comment Feed: It’s the total number of comments for your blog. Same rule will be applied to the blog comments like Posts Feed. Per-Post Comment Feeds: It’s the comment feed only for the particular posts. The same rule goes as above. Post Feed Redirect URL: If you are using FeedBurner to manage your blog feeds then you may like to know how to Redirect Feeds and Setup FeedBurner for Blogger . If not using any feed manager then leave it blank.

Archive Settings for Blogger : Blogspot Basics

One of the most important settings can be found on blogger's Settings > Archiving tab. It will let you to configure how to archive your blog post. Archive Frequency: Set the frequency of your blog posts that should be archived. “Monthly” in better option . Enable Post Pages: This will enable to have a more search engine friendly address for your blog posts rather than having dynamic URLs (it will add no keywords to post titles) which is bad. If you need traffic, turn this to “Yes” which is recommended. If selected “No” then you may not get the desided traffic and the embedded inline comment form to blogspot template. Save settings.

Comments Settings for Blogger : Blogspot Basics

Image
Let us have a look how would you like to setup your comment settings for blogger . Go to Settings > Comments tab to configure it. Comments: Select “Show” to show the comments in each posts. Select “Hide” if you want to hide the existing comments, it will not delete the old comments. Who Can Comment: Select specifically who can comment to your posts. Comment Form Placement: Select the type of comment form you want. Full page - opens a new tab (window) Pop-up window – a pop-up window will appear Embedded below post – better known as inline comment form for blogger Comments Default for Posts: The options are “New Posts have Comments” which will automatically add the comment option to “Allow” as default for each and every post that you will publish, in your post editor. “New Posts Do Not Have Comments” will “Disallow” the commenting option by default. Backlinks: Show or hide backlinks for each posts. Backlinks Default for Posts: you may like to read the help file about

Formatting Settings for Blogspot

Image
Let’s discuss about the Formatting settings found on the first page of Settings and that you may want to know and have to Blogger. Show at most: Select the number of posts to be seen on your blogspot homepage. Less is better, so select 5 to 7 posts for your homepage as this will decrease the load time for your blog. Date Header Format: Select the format for the date that will be visible for the posts titles. Archive Index Date Format: Select any one format you want to show your archive list (if you have added an archive widget to sidebars, this can also be changed from the widget itself). Timestamp Format: The time (when you have published the post) that will be seen below post title or after posts (depending on template design). If you don't want it then select “No”. Time Zone: Select your country’s time zone. You can also set it to other time zone if you want. Language: Your preferred language of your blog. Convert line breaks: This option will automatically add &l

Basic Settings for Blogspot

Image
New to Blogger? After creating your blog don't just start blogging because you need to know and configure some settings for your newly created blog on Blogger Platform. From your blogspot dashboard, click “Settings” which will lead you to do some basic settings and tweak your blog. Under the Settings tab, the first thing you need to do is a basic setup for your blog. So let’s discuss the options. Blog Tools: Here you can Import your blog, Export to another blog and Delete your blogger blog. It comes handy because you can backup your blog by clicking the “Import blog button” . Title: Give a title for your blog. It will be better if you choose a title that matches your blog’s niche. Description (Optional): Don’t forget to give a nice and brief description with some keywords in it. But I prefer to leave it blank as you may don't want to have same description for the posts that you write for SEO reason. Add your blog to our listing: This will add your blog to Google

Things you Like to Know About Your Blogger's Dashboard

Image
If you are a newbie then you must know what includes within blogger's dashboard. After logging in to your blogspot account, you will come to Blogger’s dashboard. Here you will find the number of blogs that you maintain and write for, number of followers you have and some more options that you may find interesting. The options that you will mainly find are to write a new post, editing older posts, settings you like to have to your blog, go to you layout directly to edit and style your template and to monetize your blog. Another feature that you will find is the number of comments needed to be moderated, which I will explain later. Scroll down below and you will find another nice feature. Here you will be able to add blogs you would like to follow and see updates of the blogs that you’re following, which is made available by Google friend connect.

How to Add Widgets in Blogger

Image
Some of you may be too new to blogger and might find difficulties in adding and moving widgets and gadgets in Blogger. For them, there’s a small tutorial. First log in to your blogger account by visiting http://www.blogger.com and go to Layout tab. Under this tab you will find Page Elements. Now, to add widget or gadget to Blogger find for “Add a gadget” and click it as shown in the picture below: