Blogger Templates

How to Use Blogger to Upload your Javascript (.js) files ? - Unlimited Bandwidth!!

noreply@blogger.com (kranthi) — Wed, 16 Sep 2009 12:36:00 +0000

This post explains how to host javascript(.js) files in blogger itself, so you don't need to worry about bandwidth limitations,etc:-

"How to host Javascript files for Free with unlimited bandwidth ?" is one of the most frequently asked questions in the blogger community. There are tons of hosts out there who can help you host your .js files for Free, but all have some bandwidth limitations and also they are not very reliable.

My friend Switcher previously explained how to use google sites to host your javascipt files for free in his blog (you can read that post here)... I used that method to host javascript files of my previously released magazine style blogger template ' Falkner Press '... but, the problem is even google sites have bandwidth limitations. So, if the bandwidth exceeds at a particular moment, the javascript files don't load which results in complete template mess up.

So, if you have those kind of problems, here is a simple trick.

I'll take Falkner Press template javascript files as an example.
If you look at the top of the template code, you see something like this:

So, as you can see, there are three javascript files (highlighted with colors) in the template. The files are hosted at google sites.

2. Copy each of those three links and paste them in your browser and download all those three files.

3. Now, open each file with Wordpad (not notepad) and copy that code.

4. Now, here is the trick...
Paste the code you copied (copied from first file) in your blogger template like this.


<script type='text/javascript'>

//<![CDATA[

PASTE THE JAVASCRIPT CODE HERE

//]]>

</script>

What about if you have 2 javascript files or three (like falkner press template) ? Simple! Just repeat the process again... like this..

5. And the Final and Most Important step... SAVE THE CHANGES ;)

Benefits of this trick:
» No file size limitations
» No bandwith limitations
» Super fast page loading (coz files are stored in blogger itself)

Like the trick ? comment.. :)

How to Host your Template Images in Blogger (Unlimited Bandwitdh)..?

noreply@blogger.com (kranthi) — Tue, 04 Aug 2009 08:38:00 +0000

This post explains how to host your template or any other images in blogger without any bandwidth limitations:-

If you are a regular reader of Blogger Tricks, you probably know that previously I had many problems hosting my template images. A year back, I used photobucket to host my template images.. but, the problem with photobucket and many other free image hosts is their bandwidth limitations. Once, you exceed a specific amount of bandwidth, your images won't show, instead.. an irritating ' bandwidth exceeded' image shows. Next, after that I tried to create.. like a new photobucket account per each template.. but, that also exceeded in a matter a couple of weeks.

Not only me, my other blogger template designers are also struggling to find a reliable, free image host with unmetered bandwidth.

I tried to upload the images to blogger and copy the image url from the status bar and use it in templates.. but it didn't worked. But, recently I came to know that we can actually host the images( large) in blogger and hotlink,use them in templates, forums,etc.

Here is the trick..

As usual, create a new post in blogger and upload your template images to that post... but don't publish it... keep it as a draft.
Once you completed uploading all the images, Open each image in a new window.

Once, the image is loaded in the new window, what I previously did was to copy the image location from the status bar and paste/hotlink it in templates. But, it didn't worked!

Now, the trick is, many people don't know that the url which we copy from the status bar is not exactly the direct link to that image file... that's why we can't hotlink to that image.

So, what we have to do to hotlink to that image is Right Click on the image and ' Copy Image location'. (for firefox users). For Internet explorer users, Right click on the image and go to Properties and then copy the image url from there.

Example:
For the above picture, status bar shows...


http://2.bp.blogspot.com/_Toi-rh0Nm00/Sl7sAqR7I9I/AAAAAAAADcU/0oqHcfSV46M/s1600-h/2008-05-28_124414.jpg

which don't work.

And the Real image url we get after right clicking and copying image location is..


http://2.bp.blogspot.com/_Toi-rh0Nm00/Sl7sAqR7I9I/AAAAAAAADcU/0oqHcfSV46M/s1600/2008-05-28_124414.jpg

Which works and we can do whatever we want.. with unlimited bandwidth :D
Hope this trick will be useful to many people who are searching for unlimited bandwidth image hosts.

© Blogger Tricks

Web Host Rating Helps You Choose the Best Web Host Provider

noreply@blogger.com (kranthi) — Mon, 03 Aug 2009 15:43:00 +0000

A suitable web hosting service is the crux of your website’s existence; the backbone for your online business. With numerous website hosting providers coming up with different range of services, the consumer clearly stands out to be the winner, because he can choose what he wants to, without depending on the mercies on one or two web hosting providers for his online business. However, at the same time, it is very easy for the consumer to be duped or feel shortchanged because he will be falling for gimmicks and shrewd marketing, rather than having a clear knowledge about what a particular web hosting service is all about. This is where a host rating site like Web Hosting Rating comes in the picture.

Web Hosting Rating is a quality host rating site, which is on its way to become the biggest searchable web hosting directory. Now, you can get complete and comprehensive information that has clear and frank information on web hosting providers, their website hosting plans, promotional and discount coupons and unedited views and comments by real customers, who have experienced these web hosting providers.

Many people tend to pick the cheapest host service and find out to their dismay that the web hosting company service is not a reliable one. There are many parameters through which one can judge the effectiveness of a web host. The most important thing that is essential in a website hosting service is the service level of the company. It should run their network operations out of data centers, equipped with sophisticated electrical and backup power systems, advanced security measures and environmental controls. The technical support and customer service should be efficient and effective, and you should be able to have queries answered 24/7 at any time of the year. The website hosting service should make sure that your website is running smoothly with hardly any downtime, with no security issues.

Apart from the review of web hosts, Web Hosting Rating gives you a low-down on the top 10 web hosting providers. In addition, it spreads awareness through its web hosting guide about website management, website security, website marketing, website scripting etc through its unique content. The intention is to familiarize you with web security, website management, and web content development tips that will help you in your online business. Web Host Rating also presents ‘web hosting awards’ every month where it lets its visitors pick the web host in each of the 12 web hosting categories, and give their verdict. With so many features and benefits, Web Host Rating is definitely the best way you can choose a perfect web hosting site for your business.

[Hack] How to Post Larger (HQ) Images in Blogger Posts

noreply@blogger.com (kranthi) — Mon, 22 Jun 2009 17:47:00 +0000

This post explains how to post extra large images in blogger posts:-

This is one of the most wanted blogger hacks, which makes it possible to post big size pictures in blogger posts.
Normally, If you upload a large image to blogger(with large thumb size selected), it will automatically resize it and then post it as thumbnail . But, the image quality of the resized image is very poor. So, to make the image look more clean and sharper, this trick will come handy.

Normally Uploaded Image: (with large thumbnail selected)

Image after applying the hack:

So, lets learn how to do this..

1.First, calculate how much image size(large) you want to display ( normally, its just a bit less than your main body width). Suppose, take this blog as an example, the main body width is about 570px. So, the maximum width to post a large image is 570px. But, to make the image looks nice, we have to give some padding to it.so,choose the width which is a bit less than the post body width.. like 560px.

Now, Go to Layout » Edit html

Find this

]]></b:skin>

Add this before that line:


img {
max-width: 560px;
width: expression(this.width > 560 ? 560: true);
}

Change the value in red depending on the previous step.

Note: Do check if you have the img{ tag already in your template. If its there, just add the additional couple of lines to it.


max-width: 560px;
width: expression(this.width > 560 ? 560: true);

Save the changes.

2. Now, while doing your posts, upload the images normally like you did previously. Once the image is uploaded, go to Edit html tab, and the image code will look something like this


<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Toi-rh0Nm00/Sj_K-nCkxWI/AAAAAAAADbg/8QRq-hHP4xM/s1600-h/megan+fox.jpg"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 280px; height: 400px;" src="http://4.bp.blogspot.com/_Toi-rh0Nm00/Sj_K-nCkxWI/AAAAAAAADbg/8QRq-hHP4xM/s400/megan+fox.jpg" alt="Normal Picture without the hack" id="BLOGGER_PHOTO_ID_5350218059319919970" border="0" /></a>

All you have to do is Just remove that bolded text (width and height attributes) and replace s400 to s800.

So, the final code looks like this


<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Toi-rh0Nm00/Sj_K-nCkxWI/AAAAAAAADbg/8QRq-hHP4xM/s1600-h/megan+fox.jpg"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer;" src="http://4.bp.blogspot.com/_Toi-rh0Nm00/Sj_K-nCkxWI/AAAAAAAADbg/8QRq-hHP4xM/s800/megan+fox.jpg" alt="Normal Picture without the hack" id="BLOGGER_PHOTO_ID_5350218059319919970" border="0" /></a>

Done! Now, your uploaded image will look big in the post.

How to Hide/Remove Label Count in Blogger Blogs

noreply@blogger.com (kranthi) — Mon, 22 Jun 2009 13:10:00 +0000

Some people prefer not to display the label count in their blogs as it looks a bit unprofessional. Lets say if you have a label 'Funny sms' with 50 label count and another one ' Good morning sms' with 2 as label count... less people will show interest on clicking the second one.

So, lets see how to hide or remove the Label count in your blogger blog(s)...

1. Sign into Blogger dashboard » Layout » Edit html

Tick the expand widget templates and remove this line from the template..


<span dir='ltr'>(<data:label.count/>)</span>

2. Save the Changes and done!

Releasing Mind Blowing Magazine style Blogger Template "Falkner Press"

noreply@blogger.com (kranthi) — Thu, 04 Jun 2009 20:34:00 +0000

After the huge hit of my previous two Magazine style Blogger Templates Turnout Mag and SchemerMag, here is my latest yet another Mind Blowing Blogger Template "Falkner Press".
Yes! It's simply Mind Blowing with so many cool features including Automatic Thumbnails and Automatic Post summarize on homepage, Youtube video integration,etc.
This was converted from a wordpress theme designed by CamelGraph.com.

LIVE DEMO | DOWNLOAD

Main Features:
* Automatic Thumbnails on posts
* Automatic Post Summarize
* Featured Content Slider
* Adsense ready
* PSD Custom Logo Included
* Youtube Video embedding Integrated
* Fully SEO Optimized
* Advertisement Block Ready
* 3 Columns
* Social Bookmarking Icons
* Twitter Updates widget
* Feedburner Email Subscription ready
* Thumbnails on Recent Posts in Sidebar
* Integrated Search box
* Beautiful top Navigation bar
* Cross-browser compatible
* and many more....

Step by Step Installation Guide:

(Make sure you backup your current template before installing any new template)

Step 0 : First Follow the basic installation steps here.

Step 1 : Edit the Logo

The logo *psd (photoshop) file is included in the download file. Open it with Photoshop and Edit the logo and Save it in .jpg format.
Next, upload that image to some image host like tinypic, photobucket,etc.. and get the image link to that file.
Help : Don't have photoshop ? or don't know how to edit the logo ? Leave a comment here with your site name.. I'll make it for you..
If you want the logo quickly.. Post your request here. I'll quickly help you out!

Go to Layout » Edit html
Find this url


http://lh3.ggpht.com/_vSvTpKey5XI/ShV2BFNh9wI/AAAAAAAAASk/l1TGzogznQw/logo.jpg

and replace it with your image url.

Step 2 : Edit the top Navigation links

Go to Layout » Edit html and find this code

<ul>

<li><a expr:href='data:blog.homepageUrl'>Home</a></li>

<li><a href='WEBSITE URL HERE'>About</a></li>

<li><a href='WEBSITE URL HERE'>Archives</a></li>
<li><a href='WEBSITE URL HERE'>Contact</a></li>


<li><a href='WEBSITE URL HERE'>Disclaimer</a></li>


<li><a href='WEBSITE URL HERE'>Forum</a></li>


<li><a href='WEBSITE URL HERE'>Subscribe</a></li>


<li><a href='WEBSITE URL HERE'>History</a></li>


<li><a href='WEBSITE URL HERE'>Profiles</a></li></ul>

See the pattern..you can easily understand. Simply replace the WEBSITE URL HERE with your target url. Also, Edit the anchor texts to your liking (About,Archives,Contact,etc)

Step 3 : Edit the Latest Twits

If you use twitter, You can use the integrated twitter twits widget. Simply find this


<a href='http://twitter.com/bloggertricks' id='twitter-link' style='display:block;text-align:right;'>follow me on Twitter</a>

</div>

<script src='http://twitter.com/javascripts/blogger.js' type='text/javascript'/>

<script src='http://twitter.com/statuses/user_timeline/bloggertricks.json?callback=twitterCallback2&amp;count=1' type='text/javascript'/>

and replace bloggertricks with your twitter id.

Don't use Twitter...? then simply delete this code from the template.

From...

<b:widget id='HTML5' locked='false' title='Twitter' type='HTML'>

...................

...............

<script src='http://twitter.com/statuses/user_timeline/bloggertricks.json?callback=twitterCallback2&amp;count=1' type='text/javascript'/>

</div>

</div>

<b:include name='quickedit'/>

</b:includable>

</b:widget>

Step 4: Edit Feedburner Email subscription and Feed count Button

This is another cool feature in this template.. built in Email subscription form and Feed count button.

Search for this line


http://feedburner.google.com/fb/a/mailverify?uri=bloggertricksdotcom

and next, this line


<p><a href='http://feeds2.feedburner.com/bloggertricksdotcom'><img alt='' height='26' src='http://feeds2.feedburner.com/~fc/bloggertricksdotcom?bg=FD6D00&amp;fg=202931&amp;anim=1' style='border:0' width='88'/></a></p>

and Edit those urls to your feedburner links.
Don't have Feedburner yet ? You can signup here.

Step 5 : Add Youtube Video

Go to Layout tab.. and you can see like this

Click on the edit button and paste your youtube video code.
Don't forget to change the width and height of the video to 250 x 190 px to fit perfectly in the layout. You can edit the width and height values in the youtube embed code.
Help: How to add Youtube videos to Blogger

Don't want Youtube Video Widget ? then, simply remove this code from the template.


<b:widget id='HTML2' locked='true' title='VIDEO (250 x 190)' type='HTML'>

<b:includable id='main'>

<!-- only display title if it's non-empty -->

<data:content/>

<b:include name='quickedit'/>

</b:includable>

</b:widget>

Step 6 : Setup Mini Updates (Recent Posts with thumbnails)

This template has inbuilt Recent Posts with Thumbnails widget. All you have to do is enter your blog url and it will do the rest.
Look for this code in the template


home_page = &quot;http://falknerpress.blogspot.com/&quot;;

and replace the url with your Blog url.

Step 7 : Edit Social Bookmarking links

In the footer, you will see three widgets, 1.About me 2. Be my Frined? and 3. Advertisement widget.
The 1 & 3 widgets can be directly added by going to Layout tab.
All you need to edit is the second widget 'Be my Friend'. Using Social Bookmarking sites is a smart way to drive traffic to your sites.. So, if you don't have any of those accounts, Just take time to register..they are free and worth it :)

Find these lines:

<ul>


<li><a href='http://your-feedburner-url.com' target='_blank'>Subscribe</a></li>


<li><a href='http://digg.com/users/bloggertricks' target='_blank'>Digg</a></li>


<li><a href='http://www.facebook.com/people/bloggertricks' target='_blank'>Facebook</a></li>


<li><a href='http://bloggertricks.stumbleupon.com'>Stumble It!</a></li>


</ul>


</div>

<div class='share-list2'>


<ul>


<li><a href='http://technorati.com/faves?add=http://your-blog.blogspot.com/'>Technorati</a></li>


<li><a href='http://twitter.com/bloggertricks' target='_blank'>Twitter</a></li>


</ul>

and Edit them accordingly.

Step 8 : Featured Content Slideshow

Check out the Live Demo to see how it looks.

Edit the Slideshow...
Go to Layout » Edit html and find these lines..
Observe the pattern, it's easy!
wait! First prepare your images... the images should be 490(width) x 280 (height) pixels. Use Photoshop or any other image editing software to crop the images to 490 x 280 px and then upload the images to some image host like photobucket,tinypic,etc.

Next, find this code

<div id='myGallery'>

<!-- First Picture Start -->

<div class='imageElement'>

<h3>Title One </h3>

<p/>

<a class='open' href='http://bloggertricks.com'/>

<img alt='Marley And Me' class='full' src='IMAGE URL'/>

<img alt='Marley And Me' class='thumbnail' src='http://54800.com/wp-content/uploads/a1.jpg'/>

</div>

<!-- First Picture End -->

.........................................

..........................................

</div>

The pattern is like this


<div id='myGallery'>


<!-- First Picture Start -->


<div class='imageElement'>


<h3>Title 1  </h3>


<p/>


<a class='open' href='LINK 1 '/>


<img alt='Marley And Me' class='full' src='URL OF IMAGE 1 '/>


</div>


<!-- First Picture End -->


<!-- Second Picture Start -->


<div class='imageElement'>


<h3>Title 2  </h3>


<p/>


<a class='open' href='LINK 2 '/>


<img alt='Marley And Me' class='full' src='URL OF IMAGE 2 '/>


</div>


<!-- Second Picture End -->


<!-- Third Picture Start -->


<div class='imageElement'>


<h3>Title 3  </h3>


<p/>


<a class='open' href='LINK 3 '/>


<img alt='Marley And Me' class='full' src='URL OF IMAGE 3 '/>


</div>


<!-- Third Picture End -->



</div>

Got it? Now edit those links and Save the Changes!!
Now, FalknerPress template is successfully installed!

Extras

Here are few more things you can learn about this template..
Adsense Color Codes:

Here is the Color Palattes you can use to perfectly blend your adsense ads in the layout

1. Adsense in Left sidebar:
Preview:

Colors to use:

2. Adsense in Right sidebar:

Preview:

Colors to use:

3. Adsense just below Featured Content Slideshow:
(468 x 60px)

SAME COLORS as 2nd one

4. Adsense in Footer:
Colors to use:

That's it guys! Hope you like the template :D

Like the template? or If you have any questions ? Comment here...

And the winners of BloggerTricks second contest are...

noreply@blogger.com (kranthi) — Sat, 16 May 2009 11:10:00 +0000

First of all, thanks to everyone who have Joined our Second Blog contest and also big thanks to contest sponsors. The contest is a very big success with so many active participants through out..

So, here we go..
The Lucky Winners are....

1. sms
2.RanCavitenio
3. Hopeful-my..
4.Kelly
5.Vicky
6.Jam
7.Rose
8.Aditya
9.Tanuj

View the full list here.

How to grab your Prizes...?
Just comment here two times (one is normal comment and second with your paypal email...I don't publish the paypal email comment..)
and I'll deposit your money to your account.

NOTE: GRAB THE PRIZES BEFORE 7 DAYS...otherwise,they'll expire

Once again Congrats to the winners and others don't worry.. few more contests ahead.. Make sure you don't miss them by subscribing to our RSS Feed.

24hrs left to try your Luck

noreply@blogger.com (kranthi) — Fri, 15 May 2009 12:21:00 +0000

Yes.. it's the final round of the BloggerTricks contest we announced couple of weeks before.
If you didn't yet participated .. you can now.. here.

Also, if I missed/miscounted anything..? Report it here.

Thank you and Good luck to all!

Evolution of Blogger 1999 - 2009

noreply@blogger.com (kranthi) — Wed, 13 May 2009 07:28:00 +0000

Blogger has always been one of the greatest (if not the best) Free Blogging platforms available on net with so many features like unlimited bandwidth, lot of templates, multi image uploading,etc.
Its always nice and interesting to know how Blogger looks like in the past. So, in this post, we attempt to bring you back in time to look at how blogger look like in the past and then scan through it's history with images.

Blogger was created by Pyra Labs and was launched on August 23, 1999. It was one of the earliest blog publishing tools and it is credited for helping popularize the format.
Here is it's design then..

Blogger.com in 1999

Blogger.com in 2000

Later, Blogger was acquired by Google Inc in the year 2003 and changed their design in 2004 and also added some cool features like Image uploading (via Picasa) , comments, drag and drop widgets, individual archieve pages for posts,etc.

Blogger.com from 2004 - Now

And also Blogger supports Google Adsense which generates revenue for the webmasters.

Here is how adsense website look like in the past.. (year 1998)

Is Blogger going in the right direction..? Share your thoughts!

Collection of Free RSS Feed Icons, RSS Feed Vector Graphics

noreply@blogger.com (kranthi) — Tue, 12 May 2009 17:28:00 +0000

Now a days, almost each and every blogger/webmaster is using the RSS Syndication feature to convert their site visitors into regular loyal readers. So, adding a cool RSS Feed Icon to your blog can catch their attention which inturn can make them subscribe to your blog.
Here is the list of Free RSS Icons you can download and use them in your weblog.

Glossy RSS Icons with Reflection

Glossy Web 2.0 RSS Icons

RSS Icons Orb

RSS Feed Badge Buttons

Web 2.0 style Feed Icon (psd)

Fresh Free RSS Icons

Excellent and Gorgeous RSS Feed Icons by Smashing Magazine... Comes in lot of resolutions including 16×16px, 24×24px, 32×32px, 48×48px, 128×128px, 256×256px and 512×512px.

Shiny RSS Icons

Multi Coloured RSS Icons

Orange RSS Icons

MyCircles RSS

30 RSS Feed Icons

Circle RSS Feed Icons

Free Gloss Style RSS Icons

Feed Icons for Guitarists

Vector RSS Icons

NewsFire Glossy RSS

Feed Me Animals

Rare RSS Icons

Christmas RSS Icons

Weird RSS Icons

RSS Candy

Love Shape RSS Icon

RSS Feed Tshirt Icons

All the above RSS Icon sets are Free to use and are available in Different formats like Vector,photoshop(psd),eps,ai,png,gif,jpg,etc. So, you can edit them to your needs.

You maybe also interested in :
-Collection of Twitter Icons

Web Hosting Reviews at WebHostingReport.com

noreply@blogger.com (kranthi) — Tue, 12 May 2009 10:06:00 +0000

Web hosting is a service that is very important for the smooth functioning of your website. In other words, a web hosting company houses serves and maintains files for websites on a dedicated server for direct access to the internet. Choose a web hosting company and a suitable web hosting plan dedicated to your requirement can be a confusing task with so many companies joining in the fray. So how do you know which web hosting company is the best for your website? Choose Web Hosting Report, a popular online report that carefully compares web hosting companies and makes you choose the best one for your business.

Web Hosting Report helps you choose the best web hosting companies on the basis of parameters like ease of use, features, price, customer service and user reviews. It keeps the customer up to date with news and information in the world of web hosting. Pricing can be quite an instrumental factor in decision making, which is why Web Hosting Report has also negotiated with the best web hosting companies to offer the best, cheap prices for the customers. There are also listings given of cheap web hosting companies with detailed frank reviews.

Blogs are nowadays the revolutionary medium to influence though process online and a good blog needs a quality blog hosting company. Web Hosting Report has narrowed down on some of the best blog hosting companies in terms of pricing plans, bandwidth, disk space and number of domains you can host with one account. The services of the Web Hosting Report can be greatly beneficial in choosing the right web hosting company which can have a sound implication on the way your online business can impact your success.

BloggerTricks Blogger Forum is Live

noreply@blogger.com (kranthi) — Sat, 09 May 2009 14:17:00 +0000

I'm really exited to announce the launch of our new Blogger Forum!
I hope this will be very useful for all you bloggers where you can ask,answer and share information on blogger related topics and improve your blogs.

Here are some of the main categories of our Blogger Forum:
SEO : Search Engine Optimization is really necessary if you want to get some decent (massive) traffic from Search Engines. Here, you can post questions, answer and help others on topics related to SEO including Link building,etc.
Blog designing : Hard time designing your template..? Post your questions here..
Blogger Templates : Here, you can share your Blogger templates with other members of the community.
Monetize : Here you can discuss and share tips on how to monetize your Blog better. Google Adsense questions,etc.
Link Exchange : Link exchanging with relevant blogs is a good way to improve your Pagerank and Search Engine Rankings. You can post your blog here and request other members of forum for Reciprocal link exchange.
more..

Hope you enjoy the Blogger Forum!

Let me know what you think about it..

How to add Flying "Scroll to Top" button to your Blogger blog using Jquery

noreply@blogger.com (kranthi) — Fri, 08 May 2009 10:29:00 +0000

If your Blog has lot of long posts, adding a cool flying 'Scroll to Top' link makes it easier for your visitors to quickly navigate your pages.
Most of you have already known about how to add 'scroll to top' by adding simple '#top' to your links. But, this one uses Jquery which makes it really smooth ( you really like it for sure).
So, lets learn how to add it to your Blogger blog..

1. Go to Layout » Edit html
Find


</body>

Add before


<a href="#" id="backtotop">^ Scroll to Top</a>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>

<script type='text/javascript'>

/*-----------------------

*Scroll to top


-----------------------*/



$(function(){$.fn.scrollToTop=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="0"){$(this).fadeIn("slow")}var  scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="0"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html,  body").animate({scrollTop:0},"slow")})}});



$(function() {

$("#toTop").scrollToTop();

});

</script>

2. Find


]]></b:skin>

Add before


#backtotop { width:100px;background:#F4FFBF;border:1px solid  #ccc;text-align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#666;text-decoration:none;  }

3. Save the changes!

How to add Twitter Followers Counter/Chiklet to your Blog

noreply@blogger.com (kranthi) — Wed, 06 May 2009 15:10:00 +0000

This post explains how to add a Twitter Follower Counter/chicklet widget to your Blogger and Wordpress blogs.. like the feedburner counter

Similar to Feedburner Counter which counts your RSS Subscribers, Twitter Counter counts your Twitter Followers.

Default button :

Code :


<script type="text/javascript" language="javascript" src="http://twittercounter.com/embed/?username=username"></script>

Write your twitter account(username) in place of username

There are total of 4 colors to choose from.. You can find them here.

To add in Blogger :
Sign into Blogger » Layout » Add a gadget » html/javascript
paste the code and save it.

To add in Wordpress :
Sign into Wordpress > Widgets > Text
paste the code and save it.

Related:
Adding Twitter Bird image to your Blog

How to add Technorati Add to Favorites button to your Blog

noreply@blogger.com (kranthi) — Wed, 06 May 2009 13:43:00 +0000

Adding a nice Technorati Add to Favorites widget to your blog makes it easier for your readers to quickly fav you on technorati. So, here is how to add it to your Blogger blog.

Replace the yourblog.blogspot.com to your blog address and copy the button code you like and paste it in your template.
If you want in sidebar.. go to Layout » Add a gadget » html/javascript and paste the code and save it.

Type 1 :


<a href="http://technorati.com/favs?add=http://yourblog.blogspot.com"><img src="http://i40.tinypic.com/2yw8lma.jpg" alt="Add us to your technorati favorites" width="145" height="25" border="0" /></a>

Type 2 :


<a href="http://technorati.com/favs?add=http://yourblog.blogspot.com"><img src="http://i42.tinypic.com/nqe0lc.jpg" alt="Add us to your technorati favorites" width="145" height="25" border="0" /></a>

Type 3 :


<a href="http://technorati.com/favs?add=http://yourblog.blogspot.com"><img src="http://i44.tinypic.com/2utnl9u.jpg" alt="Add us to your technorati favorites" width="80" height="15" border="0" /></a>

How to add Music,MP3,Audio Player to your Blogger Blog

noreply@blogger.com (kranthi) — Sat, 02 May 2009 07:19:00 +0000

This article explains how to add music,mp3,audio to your Blogger (blogspot) Blog :

" Music expresses feeling and thought, without language; it was below and before speech, and it is above and beyond all words. ~Robert G. Ingersoll "

Adding a nice music track to your blog may enhance the pleasure of reading your blog or annoy your visitors depending on the kind of blog you have. For example, if you have a music blog, adding some nice song tracks to your blog sidebar can make your visitors to stay longer which benefits you.
So, let's learn how to add mp3 to your Blogger Blog:

Step 1 : First, upload the music file to any free file hosting servers on the net. There are tons of sites that provide free music file hosting. Just google "Free music hosting". Once you upload, they will provide you with a direct link to that music file.
ex: the file looks something like this :


http://---------- .com/yourmusicfile.extension

(extension can be .mp3 or .wav or .mid or any other audio extension).
I uploaded a sample mp3 file to my server..


http://myblogtalk.com/uploads/billu.mp3

Step 2 : Here is the code you need to add music to your blog


<embed width="250" height="50" autostart="false" src="MUSIC FILE URL"/></embed>

width : width of the music player
height: height of the music player
autostart : you want the music to start playing automatically ? or leave it to visitors choice..? (values : false or true)
MUSIC FILE URL : the direct link to your music file
In this example, MUSIC FILE URL is


http://myblogtalk.com/uploads/billu.mp3

So, if you add that code, the output will be like this
(I used the autostart: false, so you have to click on the play button to start playing music)
Click on the Play button to test

If you use the autostart value: true, the music automatically plays.. but, it annoys many readers

Few more attributes :
loop : true (or) false
If you want to continue playing the same track again and again until the visitor click on the 'STOP' button (or until he/she leaves your site), set the value to 'true'.
If you want the music to stop once the track is completed, use 'false'

playcount : n (n= any positive number)
suppose.. if you put playcount: 2 , the music will play two times and stop

If you want to use these two more additional features.. the code look something like this:


<embed width="250" height="50" autostart="false" loop="false" playcount="2"  src="MUSIC FILE URL"/></embed>

Now What ?
You can add the music player anywhere you want in your Blogger blog..
Sidebar : If you want to add in sidebar, go to Layout » Add a gadget » html/javascript
and paste the code and save it.

Blog Posts :
If you want to embed music file to any specific blog post..
Paste the code in 'Edit html' mode and save it.

Related:
How to add Video clips to your Blogger Blog?

Collection of Twitter Bird Vector Graphics,Twitter Bird Icons,Logos, Twitter Bird psd eps png files

noreply@blogger.com (kranthi) — Fri, 01 May 2009 02:51:00 +0000

Looking for Twitter bird logo ? Twitter bird icons ? Twitter bird in vector, eps or psd or png format..? then, here is a treat for you.. Adding a cool Twitter graphic to your website/blog can encourage your site visitors to follow you on twitter.
Here is my collection of excellent Twitter bird vector logos,Twitter icon sets,etc. All these are 100% Free to download.

Cute Twitter Bird Vector Art - by Smashing Magazine

Format : Vector (.eps), photoshop (.psd)

Twitter Bird Follow me Button : by IconTexto

Format : png

Tweet Tweet Vector Icon set : by Productive Dreams

Format: Vector (psd) , png

Free Twitter Bird Icon : by TheDesignSuperHero

Format : png

Twitter Bird Icon set : by Productive Dreams

Format : png

Free Twitter Birds : by Luc Latulippe

Format : vector (eps)

Twitter Social Bookmarking Icon : by IconTexto

Format : Icon (.ico)

Free Vector Twitter Icons : by 404Creative

Format : Vector Illustrations (eps)

Free Twitter Buttons : by Randa Clay

Format : png

Tweeties : by Chris Wallace

Format : Vector Illustrations (eps) and png

Happy Twitter Birds : by Adams

Format : Photoshop (psd) , png

Twitter Follow me Icon : by antonist ~ deviantart

Format : Jpg file

High Resolution Twitter Graphics : by TheDesignerSuperHero

Format : Vector Graphic (psd) , png

TwitterBird : by Lisa

Format : jpg

Cool Twitter Bird : by chibbell
Lol.. I really like this one

Format : jpg

Know any good Twitter Bird design ? Share with us..

Google Pagerank Updated March 2009

noreply@blogger.com (kranthi) — Tue, 28 Apr 2009 11:31:00 +0000

Quick Update guys.. Google just updated the Pageranks few hours ago.

If you don't know what Pagerank means.. Google Pagerank is a Parameter on how Google ranks web pages on search results. It depends on the content and backlinks of the site/blog.

BloggerTricks PR remained at PR6.

So,What's your Blog Pagerank?

Check your Pagerank here..

&amp;amp;amp;amp;amp;amp;amp;gt;YOUR BROWSER IS NOT COMPATIBLE TO VIEW THIS

BloggerTricks.com $200 Giveaway... Participate now!

noreply@blogger.com (kranthi) — Sun, 26 Apr 2009 04:49:00 +0000

UPDATE:
CONTEST ENDED!
You can view the Winners here..
-------------------------------------
After a huge hit of my Previous Blog Contest, I'm thrilled to announce our Second Blog Contest here at BloggerTricks.com but this time.. the prize is doubled.. $200

First of all, Big thanks to the Contest Sponsors..
Directory Submission Service : getlinkspro.com
She Told Me : shetoldme.com
Discount Codes : digitaldiscountcodes.com
Make Money Online : moneymakerinfo.blogspot.com

The rules are a bit different from my previous contest. This time, even new bloggers (with less blogs) have equal chances of winning like the pros with tons of blogs.

So, here are the Contest rules :
You have to get atleast 10 points to qualify for the contest.

How to get points ?
There are lot of ways to get points. They are very simple

1. Just leave a comment on this page : 1 point

2. Blog about this contest : 5 points
Just blog about this contest in your blog/website including a link to this contest page and a link to each of the contest sponsors.
Note : No copy/pastes from this site Minimum 60 words Blogs with min Pagerank 1 only

3. Digg this Post : 1 point

4. Add us to your Technorati Favourites : 1 point

5. Follow us on Twitter : 1 point

6. Stumble this post! : 1 point

7. Bookmark us on Del.icio.us : 1 point

8. Subscribe to our Feed : 2 points
(If you are already subscribed.. let me know)

9. Spread the word by adding a small banner to your Blog sidebar : 1 point
Just add the below code to your blog sidebar..


<a href="http://bloggertricks.com/2009/04/bloggertrickscom-200-giveaway.html" target="_blank"><img src="http://i40.tinypic.com/308v8us.jpg" alt="Win $200 now" width="125" height="125" border="0" /></a>

So, you have to get atleast 10 out of 14 points available to qualify.

So, Where are the Prizes ?
Here we go..
There are 8 prizes in total.. (so.. you have more chances of winning) :
1st Prize : Whooping $100 cash!
2nd Prize : $50
3rd : $25
4-8 spots : $5 each
(Prize money will be deposited directly to your paypal account)

Contest Deadline :
The contest ends on May 16th 1PM (IST).. (20 days)

How winners will be choosen ?
The winners will be choosen randomly using the Random list generator tool at random.org

Make your entries Official :
Leave a comment here (only on this page) with your details (like your blog url, digg, stumbleupon username,etc) to make your entries official.

Best of luck to all!

How to Increase Technorati Authority ?

noreply@blogger.com (kranthi) — Sat, 25 Apr 2009 05:37:00 +0000

How to Increase my Technorati Authority?
This is one of the hot questions that's thrown around in the blogging world day after day.
For those who are new to blogging or if you don't know what technorati is.. Technorati is one of the leading Blog search engine which crawls and index millions of blogs in real time.
And Technorati Authority means the total number of blogs that are linking to a website in the past six months. If you have a good technorati Authority, you get massive traffic from them. Also, technorati authority is one of the parameters that advertisers often look into before buying advertising spots.We can say how good and popular a particular blog is with the authority number. So, Here is my list of top 12 ways to increase your Technorati authority quickly..

1. Quality Content : As always, Content is King! The more quality content you post , the more chances that other blogs link to your site.

2. Giveaways : Who hate freebies..? you can encourage people to link to your site by giving away free stuff like templates,fonts,icons or any other resources you expertise in.

3. Link to Us : Design a good small button and add the "Link to Us" html code to your blog sidebar just like I did it in this blog (check the right sidebar).. so, it's easy for your readers to just copy & paste your link on their blogs.

4. More Blogs - More Authority : Do you run lot of blogs ? You can increase your Technorati Authority easily by linking all the blogs to your main blog... So, the more blogs you have , the more authority you get..as simple as that.

5. Sponsor a Blog theme : There are millions of people using blogs like Blogger and Wordpress. So, sponsoring a blog theme is one of the best and fastest way to get tons of backlinks to your site. Everytime someone uses your template, your backlinks will increase along with technorati authority.

6. Link exchange : Try to contact blog owners related to your site niche and propose for link exchange. There are lot of blog directories out there.. Just go to them and select your blog category and browse other blogs related to your niche and contact them one by one for link exchanges or you can find some link exchange parters in forums like Digitalpoint.

7. Buy links : If you have some $$ to advertise your site, you can buy links and blog posts on other blogs that are relevant to your site and can increase your authority.

8. Top Commentators : Some people put 'Top Commentators' widget on their blogs and link to their top comment posters.Try to find them and comment on their blogs (no spammy ones) and get a backlink to your site.

9. Run a Contest : You can Run a blog contest giving away prizes like money, entrecard credits, rapidshare accounts, etc and ask your readers to link back to your site to participate in the contest. This is one of the proven ways to increase your technorati authority in a rapid pase.

10. Use Technorati Badges : Simply add a technorati 'Fav this blog' widget to your blog. This can make your readers to easily "Fav" your blog which gives you a point.

11. Blog commenting : This is well known and popular method to increase backlinks to your site aswell as technorati authority. Do a bit of research on dofollow blogs and your authority will increase everytime if the blog you commented on is claimed.

12. Ping Blogs : Check who is linking to your blog. If you are using visitor counters like histats, sitemeter,etc.. Check your referrals stats and find out the blogs that are linking to you and ping them.. so, technorati can crawl them fast and increase your authority fast. you can ping the technorati here.

SchemerMag Blogger Template - bx errors fixed!

noreply@blogger.com (kranthi) — Sun, 19 Apr 2009 06:02:00 +0000

Good news guys!
Some people got bx errors while saving the template.. (changing the widget position) in schemermag template..but, now.. I fixed all the errors and the template is now fully Optimized (interms of SEO also).

Go get a fresh copy now...

Log into Two/ Multiple Yahoo Messengers at the same time

noreply@blogger.com (kranthi) — Wed, 15 Apr 2009 13:06:00 +0000

Have multiple yahoo accounts ? Tired switching between the messenger accounts one by one..? This tip is for you..

Usually , if we have multiple yahoo accounts , you must have to log out of the current messenger id if you want to switch to another account. But, with this trick, you can log into multiple yahoo messenger accounts at the same time..

Let's see how to do that: (for windows xp users)

1. Click on the Start » Run
2. write "regedit" and hit Enter
3. Now, on the left pan, browse to HKEY_CURRENT_USER » Software » Yahoo » Pager » Test
4. Now, Right click on that 'Test' folder and select New » DWORD Value and name that new folder as Plural

5. Next , Right click on the "Plural" folder and select "Modify"
6. And Enter this information :
Value data : 1
Base : Decimal

and Click on 'OK'.

Now Close your Registry Editor by going to File » Exit

Done! Now, you can log in to as many Yahoo accounts as you can simultaneously... Enjoy!

Sorry!

noreply@blogger.com (kranthi) — Sun, 12 Apr 2009 06:10:00 +0000

Really sorry that I didn't updated the blog last 10 days as I'm preparing for my exams next week.
Lots of lots of comments still need to be approved.. ( 2,416 of them )

Google Pagerank Updated! April 2009

noreply@blogger.com (kranthi) — Thu, 02 Apr 2009 07:26:00 +0000

Google Pagerank Updated today...
BloggerTricks.com is PR6 as before

So.. what's your Blog Pagerank..?