As the Followers Gadget has been integrated with Google Friend Connect. So now onwards you can add all the gadgets available in Google Friend Connect to your blog very easily..
Event Gadget is one of them. It gives information to your readers about any event you decide. The description, time, location, map is included. Viewers can join the event and see who else has joined the event. See picture at left. Other gadgets like Members, Comment Wall and Social Bar gadget can also be added.
:: Follow the Steps to add the event Gadget ::
Login at Blogger.com and check the Remember Me box while doing so.
Go to Google Friend Connect. You will see all your blogs listed in left sidebar under 'Sites'.
Click your Blog Title and it will expand to show submenu below it.
Click on 'Social gadgets' link
Click on 'Event Gadget' link.
Under Options select and choose the various options like Page, and fill in your Event's Title and Description. Choose the start and end dates and the Timezone. Fill in the Location, address and Media URL which is link of the picture or logo of your event.
Coose the gadget's size to fit your sidebar or you may have to increase blog width.
Lastly click Generate Code button.
Copy the code given and paste in a HTML gadget in your blog.
Similarly you can add any of the other gadgets available like Members gadget and Comment Wall gadget. You can see these gadgets in action at top of third column in this blog. The social Bar gadget is at the top of the blog.
Now, Blogger adds a third option: direct integration with Amazon Associates to search Amazon’s product catalog and add links to products that earn you commissions when your readers buy products you recommend with monetize button.
With this feature, you can search Amazon directly from the Blogger editor and add pictures and links to Amazon products right into your posts. Your readers will earn you commissions whenever they buy the products you recommend, and if you don’t already have an Amazon Associates account, you can sign up for one for free without leaving Blogger.
If you’ve ever written a blog post about a book, recommended a gadget, or reviewed a toy you bought for your kids, you’ve likely gone through the process of drafting the post, opening up a separate window to go to find a site that sells the product, then going back to Blogger to paste the link to the product into the post editor.
Starting today, you can search the Amazon product catalog without leaving the Blogger interface and insert links to the products you find into your posts. Not only is the process of linking to products more efficient, but Amazon makes it easy for you to earn money whenever your readers actually buy the products you write about. This is known as an “affiliate program”, and it’s designed to let you recommend products you like to your audience — if they buy the product, you’ll earn a commission on that purchase. (For more on affiliate programs in general, here is a good overview at ProBlogger from this summer, and Darren’s “11 Lessons Learned” post about Amazon Associates is a good review of how to get the most out of the program.)
To get started, click on the Monetize tab for your blog and click “Amazon Associates”. Walk through the setup wizard, and add the Product Finder once you’re done.
Now for the fun part: when you are writing a post on Blogger, you’ll see an Amazon gadget to the right of your post editor (the “Product Finder”). You can search the Amazon product catalog from within Blogger — type in the name of the product you are writing about, and insert a link to the product, an image of the product, or an iframe containing the image, price details and a “buy it now” button. Every link that’s created contains your unique Associates ID, ensuring that Amazon will credit you for any purchases that result from readers clicking the link on your blog.
If you’re an existing Amazon Associate, completing this setup simply makes the Product Finder available on Blogger for you — you continue to earn the same referral rate from Amazon. New Associates receive the same referral rate from Amazon that they would have received if they signed up directly. If you’re not interested in earning a referral, you can still install the Product Finder: from the “Amazon Associates” page under the Monetize tab, click “I'll do this later — show me more Amazon options” and then click “Add the Product Finder” button.
A quick note about trust: affiliate programs work well when readers trust you. You should avoid promoting products simply because of the referral fee you might earn — readers may lose some of that trust if they sense your posts exist solely to make you money. You may also want to disclose to your readers that you will earn a commission on their purchase — some readers even prefer knowing that you benefit from their business.
There’s more information about this integration at Amazon.com, and the Amazon Associates blog has some more details.
To change or remove the header Image, you shall go to Layout -> Page Elements and click the “Edit” link at the bottom right corner. Remove/Change the picture and click on save.
If some unlucky , for whatever reason the image cannot be removed, Go to Template -> Edit HTML and scroll to these lines:-
Change the above codes to the below codes and save the template:-
Now ,Go to Template -> Page Elements and you can see a option to Add a Page Element in the Header.
Click the “Edit” link in the Header, select “Remove Page Element”. The Header together with the image will disappear.
Reinstate the Header by clicking “Add a Page Element” at the Header area. Near the bottom of the list is the “Page Header” element. (You are entitled to have one Page Header. The previous Header has to be removed before you can add a new one.)
Enter the Title and Description and upload your new picture if you'd like. Save when done. You should see a new Header and/or Header image.
When you post anything to your blog, your Old posts got back in Archive ,no ?
Yes. But some posts might be important in content, and you might think them to appear at the top in archive.
Now you have the option to bring back your older posts to the hompage whenever you want. This is especially useful in seasonal events, when a post written in the past must be present on the homepage. But publishing a new post with the same content will cause content-duplication problems, so you can simply edit your previous post to change the publishing date and bring it back to the top. So to do this,
open the post-editor and click on Post Options link present in the bottom of the page.
Now Set date and time to present or any future date.
Finally save the post and your work is done (You can of course undo the changes, to send the post back to its original place).
Note: URL Doesn't Changes.URL keep the same as Old
We do not want the gadget to appear on every page. We want it to appear only on the 'Blog Members' page. For this we use the power of conditional tags. The first step is to get the permalink of the Blog Members post published in Step 1 above. Look in the Blog Archives gadget as the post was backdated. Click the post link to open the post page. Copy the link from the address bar. It looks like this in my example :
Then we have to modify the widget code. Login at Blogge.com and click Layouts link on dashboard. Then click Edit Html subtab of Layout tab. Click on Expand Widgets Template checkbox at top of Template Code box. Wait for page to refresh. Scroll down to the code for the Blog Members gadget. It will look like something this :
Put in the two lines in bold as shown above. In the first line :
Look for the existing footer code near the end of your HTML. It might look something like this:
if you already have contents in the footer, the code should be longer.
Copy and paste the code below immediately under the footer . This code will create 3 new gadget containers (one for each column) under the existing footer container.
Copy the code below and paste it in CSS section, before ]]>.
.new-footer ul { list-style-type:square; margin-left:15px; }
Save the template and go to Layout > Page Elements. You should have the 3 empty footer containers added at the bottom of the layout.
You can now drag and drop the gadgets from the existing footer or sidebars into the new footer containers. The end result should look something like this.
If the columns are not distributed evenly, try adjusting the width in line 3 and right margin in line 5 of CSS code (in step 6).
Once satisfied with the result, if you want you can go back to the old footer code in step 4 and delete it (from
In the default Blogger templates, you might see at the words “Newer Post”, “Home” and “Older Posts”. Really these buttons are very helpful to users. But some Blogs are really acting like as Professional websites, that means , they didn't contain these types of links.This tip surely help them.
After Sign In to Blogger , Go to Dashboard
Then Click on Layout
Go to Edit Html and tick mark on Expand Widget Templates
Find this code in your template code :
#blog-pager-newer-link {
float: left;
}
#blog-pager-older-link {
float: right;
}
#blog-pager {
text-align: center;
}
After wards replace with this code:
#blog-pager-newer-link {
display: none;
}
#blog-pager-older-link {
display: none;
}
#blog-pager {
display: none;
}
Yyou wish to return to the original state, simply reverse the process.
Suppose, i have two blogs with not bad amount of visitors ,But i can't manage them, so i would like to make it out one.So i need a redirection purpose.That means if any one enter into my old blog, he will automatically redirect into my new blog :) how is it ?
So, how to do this?
If you are using a NEW BLOGGER TEMPLATE, do this:-
1. Go to blogger dashboard.
2.Click on the layout link> Edit html
3.Copy the below html code and Paste it anywhere between the head tags.[look at the below screenshot]
Don't forget to replace the newblogaddress in the code with your destination url(address)
4.SAVE THE CHANGES.
If you are user of CLASSIC BLOGGER TEMPLATE,Just follow this:-
1. Go to blogger dashboard
2. Click on the template link next to your blog name.
3. Copy the below code and paste it below the head tag as shown in the below screenshot
Don't forget to replace the newblogaddress in the code with your destination url(address)
We're kicking off our video series with a quick tutorial on how to add your blog's feed to your Facebook profile. That way, every time you publish a new blog post, Facebook imports it as a Note and notifies your Facebook friends. Hosted by me (Andy) your in-residence TypePad scientist:
If you are far from computer and your blog, don't be worry, Take your mobile phone and have blogging,with most easy and safety method.
Blogger introduce Mail-to-Blogger Feature.
To post your blog,you need to configure your Mail-to-Blogger email address.Then onwards you can have blogging on your Mobile itself.
The Mail-to-Blogger feature turns any email account into a blog-posting application.
In Settings | Email you can create a Mail-to-Blogger address which you will use to send posts via email to your blog:
To post to your blog via email, you need to configure your Mail-to-Blogger email address in Settings | Email:
The format of the email address is username.secretword@blogger.com. Note that this email address must be kept secret. Otherwise, anyone who gets it will be able to post as you.
Also be sure to specify whether or not you prefer your email posts to publish automatically. If this option is not checked, then your posts will be saved on your account but will not appear on your blog until you log in to Blogger.com and publish them yourself.
Once you have saved your Settings, you can send email to your blog. The subjects of your email letters will be the titles of your posts, and the body of the emails will be the posts themselves. To include an image in your post, you can attach an image to you your email.
Notes: Sometimes email programs append text to the bottom of each sent message; to make sure this cruft doesn't get posted to your blog, put #end at the end of your post.
Upload your image to a photo hosting website likePhoto Bucket.com. With Photobucket, you can upload photos as well as videos, and you can blog direct from Photobucket.
First of all You should create an account in photo bucket.After you have uploaded your photo to Photobucket, you can use the <img src="photo URL" width="W"> tag to publish your photo to the blog, where W is the width of the photo you want displayed in your blog, or you can blog direct from Photobucket. If you take the first alternative, you will need the URL of the hosted photo. This you can get from your Photobucket account. See screenshot
Now its very easy to upload pictures to your blog .Better use new updated Editor for more functions.
Yopu can upload picture with three touch !!.Yes.
You can now upload photos to your blog(s) using Blogger Images;
just click the image icon in the post editor's toolbar.
When you click this icon, you'll get a window that allows you to select an image or multiple images from your computer.
Click the Browse button to locate the ones you want. Alternatively, you can enter the URL of an image that's already online and insert it into your post.
If you click the link to choose a layout, you can customize the way your images will appear in your post:
The left, center and right options determine how the text of your post flows around the pictures.
The size option lets you scale the pictures to different sizes within this posting area. Note that the picture will still be uploaded in its full size; this option just determines how it's scaled within the content of your post.
Label helps you to categories all your posts.It makes your visitors to catch the topic very easily,when they are enough posts.
Add Label to your Post :
When you're writing a post, you'll have a space at the bottom of the form marked "Labels for this post."
Enter whatever labels you like, separating them with commas. You can also click the "show all" link to display a list of labels you've used previously.
Then just click on the labels to add them.
When you publish your post, the labels will be listed with it.
Clicking any of the labels will take you to a page containing only posts with that label.
Advanced Use
You can easily change the formatting used here by editing your blog's layout. You can also add a list of all your labels in the sidebar of your blog, sorted alphabetically or by frequency of use.
Labels are handy if you blog about a lot of different subjects, since readers can then choose to view all of your posts on, say, dancing at once. Or politics, or knitting, or whatever you happen to be writing about. If you have a team blog, you could also give each member their own label, so you could easily read all the posts by any one of them. Feel free to come up with other creative new uses as well!
The following characters cannot be used in labels: &<>@!,
Enter your blog's web address in the "Ready to Burn?" form found on FeedBurner's homepage and at the bottom of the pages in the Blog and Podcast sections. If you plan to publish a podcast with your Blogger feed, check the "I am a podcaster" box. Click Next ».
The Identify Feed Source page should appear.
On "Welcome", make sure the title and FeedBurner address (URL) of your new feed are values you prefer.
The Create or Sign In To Your FeedBurner Account page should appear.
Also on this page, create a FeedBurner account by picking a username and password and supplying your email address.
When you've supplied all the required information on this page, click Activate Feed ». A "Congrats" page should appear.
Read all of the information on "Congrats", then click Next » to continue with the setup process.
If you selected "I am a podcaster" on the homepage, configuration options for our SmartCast service will appear. Here you can supply categories and other information for iTunes, append a copyright message, and submit your podcast to Yahoo! Search.
When you are finished, click Next ». Configuration options for FeedBurner stats services should appear.
On the stats configuration page, select the level of feed stats detail you want.
Click Next » to finish the setup process and enter our feed management interface.
You're now ready to make your FeedBurner feed available on your Blogger site!
Tracking 100% of your feed traffic: Redirecting your Blogger feed to your FeedBurner feed
Blogger can make sure all feed traffic for your blog content goes to your FeedBurner feed. This ensures your FeedBurner stats are comprehensive and accurate; even subscribers to the 'Original Feed' are routed through FeedBurner. To redirect your feed:
From the Blogger Dashboard, click the Settings link for the blog you want to promote.
The Settings page for your selected blog should appear.
Click the Site Feed link under the Settings tab.
Type your complete FeedBurner feed address into the Post Feed Redirect URL text field. Make sure you type in your entire feed address including the "http://" portion.
Click Save Settings.
You should see the message "Settings were Saved Successfully".
Blogger will now redirect all feed traffic for your blog to your FeedBurner feed.
Note: If you are using the redirection feature within Blogger to send all of your feed traffic to your FeedBurner feed, you may want to modify the code we provide in order to keep your subscribers with you, even if you leave FeedBurner.
Is your blog is spam labelled , or is it not shown now a days ? .We found that many blogs are blocked as spams blog.Now blogger team are very strict in these area.Some of my friends seen that "Return to Blogger" error while they try to open their Blog.To solve this problem,
The import and export features on Blogger give your content a whole new range of portability and freedom, allowing you to create copies of your own blogs as well as import them into other existing ones. Best of all-we've made this a very simple process!
Import as a New Blog
To import content as a brand new blog, click Create a Blog from your dashboard.
Then under Advanced Options, click the Import Blog Tool
Finally, choose the Blogger export file (.xml) from your hard drive and fill out the word verification. Click the Upload arrow and your new bog will be created instantly!
Import Into an Existing Blog
To import posts and comments into an already existing blog, start by clicking Import Blog from the existing blog's Settings | Basic tab.
Note: Your template will not be affected by the imported content.
Next, choose a Blogger export file (.xml) from your hard drive and fill out the word verification beneath. By default, all of your imported posts will remain unpublished until you publish them from your dashboard later. However, if you would rather have all posts published immediately, make sure to check the box next to Automatically publish all imported posts before you click Import Blog.
If you did not choose to have your posts publish automatically, you will need to manually publish them from the Posting | Edit Posts tab before they will appear on the web. You can either publish all the posts at once by clicking Publish all imported posts, or publish individual posts by selecting them and then clicking Publish Selected.
Exporting Your blog
To export your blog, simply click Export Blog from the Settings | Basic tab. Finally, click the Export Blog button. You blog will be stored as a Blogger export file (.xml) file which can be kept as a backup on your hard drive or imported into another blog.
Many bloggers needed their blog more graphically professional.To this idea,i added here another css script to create horizontal menu bar with drop down facility.Now create drop down menu bar within ten seconds!!. Last week i posted a horizontal menu bar code. You need just
Copy this code paste it to "HTML/SCRIPT" gadgets.
Then hit on save.
Done!!!
<style type="text/css">
/*Credits: Blogxool.blogspot.com */ /*URL: http://www.blogxool.blogspot.com */ .menu{ border:none; border:0px; margin:0px; padding:0px; font-family:verdana,geneva,arial,helvetica,sans-serif; font-size:14px; font-weight:bold; color:8e8e8e; } .menu ul{ background:url(http://www.cssmenumaker.com/menus/062/images/menu-bg.gif) top left repeat-x; height:43px; list-style:none; margin:0; padding:0; } .menu li{ float:left; padding:0px 8px 0px 8px; } .menu li a{ color:#666666; display:block; font-weight:bold; line-height:43px; padding:0px 25px; text-align:center; text-decoration:none; } .menu li a:hover{ color:#000000; text-decoration:none; } .menu li ul{ background:#e0e0e0; border-left:2px solid #f68618; border-right:2px solid #f68618; border-bottom:2px solid #f68618; display:none; height:auto; filter:alpha(opacity=95); opacity:0.95; position:absolute; width:225px; z-index:200; /*top:1em; /*left:0;*/ } .menu li:hover ul{ display:block; } .menu li li { display:block; float:none; padding:0px; width:225px; } .menu li ul a{ display:block; font-size:12px; font-style:normal; padding:0px 10px 0px 15px; text-align:left; } .menu li ul a:hover{ background:#949494; color:#000000; opacity:1.0; filter:alpha(opacity=100); } .menu p{ clear:left; } .menu #current{ background:url(http://www.cssmenumaker.com/menus/062/images/current-bg.gif) top left repeat-x; color:#ffffff; }
This sample contain only one model,If you want more models with more variety , Click here. This webseite contain all types of Menu bar that match with your Blog.
On the behalf of Blogger 10 anniversary,new updated post editor launched.Which helps you to make your post very easily without any more troubles.
To enable this New Updated Post editor.
Dashboard
Settings (Basic)
Select Updated Editor radio button (See the picture).
Then hit on 'save'.
-: An overview : -
Improved Image Handling
When you upload an image to the new post editor it will appear as a thumbnail in the image dialog box. That way, you can upload several images at once, and then add them into your post at your convenience. The thumbnails will be available until you close the post editor. When you add an image from the dialog into your post it will be placed at the insertion point instead of at the top of the post. If you don’t like where an image is in your post, you can drag it around to another spot. If you drag it towards the left side of the editor it will float to the left, likewise for the right, and if you leave it in the center it will be centered. You can drag the image between paragraphs and other block elements. Unlike in the current editor, dragging in the new editor preserves the link to the full-size version of the image. You can easily resize or remove an image with the image size “bubble.” Click on the image (Firefox 3 users may need to double-click) to bring up the bubble, and resize the image instantly. You can resize any image, including ones added by URL, but if you resize an image that was uploaded through the post editor we resample the image on our servers to keep the download size small.
Improved Raw HTML
If you use Edit HTML, especially to add tables and other advanced HTML to your posts, you should find that the new editor has a number of enhancements to make the experience less frustrating, or, dare we say it, even pleasant. By default, the current post editor replaces any newlines in your post with tags. This can cause problems when you want to use newlines to make table or list HTML clearer, since the inserted s will mangle the formatting significantly. The new post editor does not introduce s within tables, lists, scripts, styles, preformatted blocks, or objects. Since they won’t destroy the formatting, the new post editor adds clarity newlines to the HTML that’s generated by Compose mode. For example, if you create a list in Compose mode and then look at it in Edit HTML, you’ll see that there are newlines before each of the <li> tags. For posts made with the new editor, the blog-level “Convert line breaks” setting (from Settings | Formatting) is ignored. Instead, newline behavior is controlled by an Edit HTML setting under “Post Options,” which affects how newlines and tags are displayed in the Edit HTML editor. This means that, unlike “Convert line breaks,” you can change newline behavior when it would be useful for a given post without affecting the display of all the other posts on your blog. We’ve also added a Compose mode setting to let you choose what happens when HTML tags are typed in to the Compose editor. The default, “Interpret typed HTML,” matches the current post editor’s behavior: typing “bold” into the editor would look like this in your post: bold. If you change the setting to “Show HTML literally” instead, you’ll get: bold. The Edit HTML and Compose settings, along with the choice of whether to show Edit HTML or Compose by default, are saved per-user, per-blog and are updated when you save a post. The Edit HTML setting defaults to the value of the blog’s “Convert line breaks” the first time you open the new editor.
Other New Features
Add your location to your posts with geotagging
Posts are now timestamped at the date and time they are published, not when they were orignally created.
Vertical resizing. You can now change the height of the post editor by dragging the resize handle in the lower right (near the labels field). The size is saved in a per-user, per-blog preference.
Easy link editing in Compose mode. Just click a link and you’ll have the option of changing its URL or removing the link
Full Safari 3 support on both Windows and Macintosh. The old editor is pretty quirky on these browsers, but the new editor works as you’d expect.
New Preview dialog that shows your post in a width and font size approximating what you’d see on a blog.
where the URL is that of the background music you wish to use. This method works perfectly well, but visitors to your site will not be able to switch the music off if it becomes distracting.
So instead, you may prefer to use this method instead, which is compatible with all browsers (press the play icon to start music):This is achieved by including the following code somewhere in your template (eg: the sidebar):
You can change some of the variables to suit your needs:
autostart: set to "true" to make the music begin as soon as the page is loaded, or "false" to ensure the user has to press the play icon
loop: set to "true" to have the music play over and over, or "false" so that it plays only once.
height: if this is set to "40", only the play options will be visible. You can make this larger if you prefer, in which case blank space will be visible.
Using either method, you can link to .mp3, .mid or .wav music files. However, you must be aware of copyright restrictions, and ensure you have the appropriate permission for use for the music you decide to use!
Here are some sites I've used for copyright-free music you could use in your blog: