Best Templates: 08/11/11

Thursday 11 August 2011

How To Add Cool Facebook Fan Page JavaScript For Blogger

Facebook is a most popular social network in world. Facebook has come up with a new set of Social plugins...The Facebook Fan Page Box is One of them. so today i'm gonna tell you how to add new pretty cool fanpage java script to your blog.It's very easy. and very cool look. And Facebook Fanpage can abstract your visitors to your facebook fan page. If you are already having the Defualt facebook fan page box on your blog, and wish to upgrade to the this cool design of the facebook fan page box! I think all you guys will love this gadget! read below steps to add this gadget..Thank you.

1.Login to your blogger Dashboard and go to Design --> Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the one of code given below

<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script> 
<script type="text/javascript">FB.init("32eb3732082b27e7c314feb421a56208");</script> 
<fb:fan profile_id="Your Fan Page ID" connections="10" width="300" height="270" css="?"></fb:fan>

Note: Replace Your Fan Page ID With Your Facebook Fan Page ID

4. Now Click On Save 'JavaScript' You are done.

How To Protect Your Blog Page Using Password

How To Protect Your Blog Page Using Password

1. Login to your blogger Account >> Dashboard >> Edit Post >> Edit Pages

2. Now add the one of code given below to your page

<script language="JavaScript">
var password;
var pass1="PASSWORD-HERE";
password=prompt('Enter your password in order to view this page!',' ');
if (password==pass1) alert('Correct password, OK to enter!');
else {
  window.location="SITE-LINK";
}
</script>

Note: Replace PASSWORD-HERE with your password and SITE-LINK with your page

SITE-LINK : 2011/04/how-to-protect-your-blog-or-page-using.html

3.Now Save your "Page" and You are done.

How To Add JavaScript Confirm Box to Your Blogger

How To Add JavaScript Confirm Box to Your Blogger

1.Login to your Bogger Dashboard and go to Design >> & Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the one of code given below

<script type="text/javascript">function show_confirm(){confirm("YOUR MESSAGE HERE!")}</script><input type="button"onclick="show_confirm()"value="Show confirm box"/>

Note: Replace YOUR MESSAGE HERE! with your alert message.

Result:

4.Now Save your "Html Javascript" and you are done.

How To Add Google Friend Connect javascript Gadget to Blogger

How To Add Google Friend Connect javascript / Gadget to Blogger

1.Login to your Bogger Dashboard and go to Design >> & Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the one of code given below

<!-- Include the Google Friend Connect javascript library. -->
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
<!-- Define the div tag where the gadget will be inserted. -->
<div id="div-Your Blog Id Here" style="width:265px;border:1px solid #cccccc;"></div>
<!-- Render the gadget into a div. -->
<script type="text/javascript"> 
var skin = {};
skin['BORDER_COLOR'] = '#cccccc';
skin['ENDCAP_BG_COLOR'] = '#222';
skin['ENDCAP_TEXT_COLOR'] = '#fff';
skin['ENDCAP_LINK_COLOR'] = '#0000cc';
skin['ALTERNATE_BG_COLOR'] = '#ffffff';
skin['CONTENT_BG_COLOR'] = '#eeeeee';
skin['CONTENT_LINK_COLOR'] = '#0000cc';
skin['CONTENT_TEXT_COLOR'] = '#333333';
skin['CONTENT_SECONDARY_LINK_COLOR'] = '#7777cc';
skin['CONTENT_SECONDARY_TEXT_COLOR'] = '#666666';
skin['CONTENT_HEADLINE_COLOR'] = '#333333';
skin['NUMBER_ROWS'] = '3';
google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
google.friendconnect.container.renderMembersGadget(
 { id: 'div-Your Blog Id Here',
   site: '14369203123335141502' },
  skin);
</script>

Note: Replace Your Blog Id Here with your blogger ID

4. Now Click on Save "Html Java Script" and You are done.

How To Add Blue Html Color Scroll Box to Your Blogger

How To Add Blue Html Color Scroll Box to Your Blogger

1.Login to your Bogger Dashboard and go to Design >> & Page Elements.

2.Click on 'Add a Gadget' on the sidebar.

3.Select 'HTML/Javascript' and add the one of code given below

<div style="height:90px;width:600px;overflow:scroll;background-color:#0080FF;">Hello This is Html Color Scroll Box </div>
<p style="font-family:verdana,arial,sans-serif;font-size:10px;"></p>

Note: Replace Hello This is Html Color Scroll Box with your text or anything.

4. Now Click on Save "Html Java Script" and You are done.

How To Add Blogger Cool Popular Posts Widget With Zoom Effect / Using CSS V3

How To Add Blogger Cool Popular Posts Widget With Zoom Effect / Using CSS V3

1.Login to your blogger dashboard--> Design- -> Edit HTML

2.Scroll down to where you see ]]></b:skin> tag .

3.Copy below code and paste it just After ]]></b:skin> tag

<style type='text/css'>
.PopularPosts .item-title{display:none}
.PopularPosts ul li {background: none repeat scroll 0 0 transparent;float: left;list-style: none outside none;margin: 5px !important;padding: 0 !important;}
.PopularPosts ul li img {padding:0;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;border: 2px solid #CCC;height: 80px;width: 80px;}
.PopularPosts ul li img:hover {border:2px solid #BBB;-moz-transform: scale(1.2) rotate(-1090deg) ;-webkit-transform: scale(1.2) rotate(-1090deg) ;-o-transform: scale(1.2) rotate(-1090deg) ;-ms-transform: scale(1.2) rotate(-1090deg) ;transform: scale(1.2) rotate(-1090deg) ;}
</style>

Note: Please You first Add Popular Posts widget to Your Blogger Sidebar. (Blogger widgets list..)

4 Now Click on Save Template,

5.Now Set Settings Your Popular Posts Widget , Like this,

6. Now Save Your Popular Posts Widget and You are Done.

How To Add New Facbook Share Count Button to Your Blogger V2

How To Add New Facbook Share Count Button to Your Blogger V2

1.Log in to your Dashboard--> Design- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see this <div class='post-header-line-1'/> tag

4.Copy below code and paste it just before the <div class='post-header-line-1'/> tag

<b:if cond='data:blog.pageType == &quot;item&quot;'><div style="float:left;margin:10px 10px 10px 0;"><script type="text/javascript">var fbShare = {url: '<data:post.url/>', size: 'small' }</script><script src="http://widgets.fbshare.me/files/fbshare.js" type="text/javascript"></script></div></b:if>

5.Now Save Your Template and you are done.

How To Add Edward Cullen Mouse Cursor to Your Blogger / Twilight New Moon

How To Add Edward Cullen Mouse Cursor to Your Blogger / Twilight New Moon

1.Log in to your Dashboard--> Design- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see this </head> tag

4.Copy below code and paste it just before the </head> tag

<style type="text/css">body, a, a:hover {cursor: url(http://bloggertrickandtoolz.googlecode.com/files/EdwardCullen.cur), progress;}</style>

5.Save Your Template and you are done.

How To Add Welcome Message to Your Blogger

How To Add Welcome Message to Your Blogger

1.Login to your blogger dashboard--> Design- -> Edit HTML

2.Scroll down to where you see ]]></b:skin> tag .

3.Copy below code and paste it just After ]]></b:skin> tag

.element { position:fixed; bottom:1%; right:1%; padding:10px; font-family:Arial;
 background:#98DBF7; border:1px solid #2FBAF6; }

4.Click on Save Template,

5.Now click on 'Add a Gadget' on the sidebar.

6.Select 'HTML/Javascript' and add the one of code given below

<div class="element">Your Message Here</div>

Note: Replace Your Message here with your own message

7. Now Click on Save "Html Java Script" and you are done

How To Add Official Linkedin Share Button to Blogger

How To Add Official Linkedin Share Button to Blogger

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:right;margin-left:10px;'>
<script src='http://platform.linkedin.com/in.js' type='text/javascript'/><script data-counter='top' expr:data-url='data:post.url' type='in/share'/>
</div>
</b:if>

Button 2

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:right;margin-left:10px;'>
<script src='http://platform.linkedin.com/in.js' type='text/javascript'/><script data-counter='right' expr:data-url='data:post.url' type='in/share'/>
</div>
</b:if>

Button 3

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:right;margin-left:10px;'>
<script src='http://platform.linkedin.com/in.js' type='text/javascript'/><script expr:data-url='data:post.url' type='in/share'/>
</div>
</b:if>

5.Now Save Your Template and you are done..

Cozy Hotel Blogger Templates

(Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes
Detail :	Cozy Hotel is free blogger templates with minimalist desain related about hotel with white background, if you need minimalist desain with hotel categories you can try using this themes. This themes very compatible on all browser and with 2 column, left sidebar, gradient red color as background title on sidebar.
Compatible :	ie firefox chrome
Properties :	Buy My Themes, Fixed, Left Sidebar, Two Column, White
Categories :	Travel

Memoir Blogger Templates

(Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes & Elegant Themes
Detail :	Memoir is premium blogger templates for free, very elegant blogger templates with garden or natural desain as background, two column, right sidebar, gray color for main post, jQuery menu, fixed with, compatible on all browser is main feature this themes. This themes very good for personal blog and your can try using this themes.
Compatible :	iefirefoxchrome
Properties :	Buy My Themes, Elegant Themes, Fixed, Gray, Right Sidebar, Two Column
Categories :	Natural

Elegant Dinner Blogger Templates

(Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes
Detail :	Elegant Dinner is free blogger templates with categories food, two column, left sidebar, and compatible on all browser. Very elegant and professional blogger templates with combination black and yellow as main background.
Compatible :	ie firefox chrome
Properties :	Black, Buy My Themes, Fixed, Left Sidebar, Two Column
Categories :	Food

Black Gallery Press Blogger Templates

(Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes
Detail :	Black Gallery Press is the series themes and free premium blogger templates with 4 column, high position for get more click via advertising like adsense, buysellads, and more. Good size width for sidebar, widget for Subscribe Now, categories color, Psd for logo, images added one folder on this themes. You very easy to use this themes, build with many jQuery and very good on all browser.
Compatible :	ie firefox chrome
Properties :	Ads Ready, Black, Buy My Themes, Fixed, Four Column, Right Sidebar
Categories :	Gallery

Blue Press WordPress Themes

( Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes
Detail :	Blue Press is free wordpress themes with two column design, right sidebar, top ads, three column footer, jQuery menu, custom field, feature post, admin option and compatible on all browser is some feature added on this wordpress themes. Very elegant themes with blue background with combination gray and very good for personal blog.
Compatible :	ie firefox chrome
Properties :	Ads Ready, Blue, Buy My Themes, Fixed, Right Sidebar, Slider, Two Column, Wordpress
Categories :	Personal

Ice Cream World Blogger Templates

( Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes
Detail :	Ice Cream World is free blogger templates with two column, right sidebar, feature content and very red blogger templates with combination gray and good for blog related about food like ice cream, cool drink and more. Very beautiful themes with three feature content on header.
Compatible :	ie firefox chrome
Properties :	Buy My Themes, Fixed, Red, Right Sidebar, Two Column, White
Categories :	Food

Elegant Blog Blogger Templates

(Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes
Detail :	Elegant Blog is professional blogger templates with two column, right sidebar, slider with jQuery, small picture on bottom slider, ads spot, PageList and compatible on all browser is some feature for this themes. 4 column footer with social bookmark icon make this themes very complete for business sites.
Compatible :	ie firefox chrome
Properties :	Ads Ready, Buy My Themes, Fixed, Purple, Right Sidebar, Slider, Two Column
Categories :	Elegant

Winter Weather Blogger Templates

( Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes
Detail :	Winter Weather is free blogger templates with brown color, wooden style and natural categories, build with many feature like two column, right sidebar, pagelist menu, social icon, compatible on all browser and this themes very good for personal blog.
Compatible :	ie firefox chrome
Properties :	Brown, Buy My Themes, Fixed, Right Sidebar, Slider, Two Column
Categories :	Natural, Wood

Vintage Stripes Blogger Templates

(Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes & WpThemesFree
Detail :	Vintage Stripes is free blogger templates with design vector very good for themes related about personal blog and art sites. Very simple blogger templates with vector on top right header as main design.
Compatible :	ie firefox chrome
Properties :	Brown, Buy My Themes, Fixed, Right Sidebar, Two Column, WpThemesFree
Categories :	Vector

T Shirt Blogger Templates

(Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes
Detail :	T Shirt is very good themes for business and this themes have two column, right sidebar, video widget and special jQuery and javascript to make navigation menu. Nice themes for sell something, clothing, shoes, product and more, if you want find themes with categories business you can try using this themes for you sites.
Compatible :	ie firefox chrome
Properties :	Ads Ready, Black, Buy My Themes, Fluid, Right Sidebar, Slider, Two Column
Categories :	Business

Wall Shelf Blogger Templates

(Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes & TemplateMo
Detail :	WallShelf is free blogger templates special for personal page sites, this themes not have post to publish and just using page with slider javascript. This themes with design wood and vector for background, design menu and more. If you want find personal page sites for your sites. This themes is good for you choice.
Compatible :	iefirefoxchrome
Properties :	Blue, Buy My Themes, Fixed, Right Sidebar, TemplateMo, Two Column
Categories :	Vector, Wood

New Boubles Blogger Templates

(Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes
Detail :	New Boubles is free blogger templates with purple design, three column, ads spot, left and right sidebar, feature post, search and this blogger templates have full color for personal blog and this themes can make your sites more fun with various color.
Compatible :	IE Firefox chrome
Properties :	Ads Ready, Buy My Themes, Fixed, Left And Right, Purple, Slider, Three Column
Categories :	Abstract

USA Civil War WordPress Themes

( Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	Buy My Themes
Detail :	Usa Civil War is free wordpress themes with two column very good for blog related about war themes and i make this themes for two type themes as blogger and wordpress themes. You can try using this themes for you sites and if you like war themes, this themes very suitable for your blog.
Compatible :	iefirefoxchrome
Properties :	Ads Ready, Brown, Buy My Themes, Fixed, Right Sidebar, Slider, Two Column, Wordpress
Categories :	Education

Hi Marijuana WordPress Themes

(98 Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	BloggerTricksAndToolz
Detail :	Hi Marijuana free wordpress themes with two column, right sidebar, feature post, compatible on all browser, fixed width and very good wordpress themes with categories adult because this themes have marijuana design and icon as main background for this themes.
Compatible :	IE Firefox chrome
Properties :	Ads Ready, BloggerTricksAndToolz, Fixed, Gray, Right Sidebar, Two Column, Wordpress
Categories :	Adult

New Blogger Store Blogger Templates

( Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	JavaTemplates
Detail :	Blogger Store is free blogger templates specially for bloggers who have a commercial blog, designed professionally using the latest version ShoppingCart (v2.2). You can using Paypal or Google Checkout for type payment. Settings are available for TaxRate, ShippingCost and more.
Compatible :	iefirefoxchrome
Properties :	Fixed, Four Column, JavaTemplates, Left Sidebar, Premium, White
Categories :	Business, Gallery

Islamic Insya Allah Blogger Templates

(Download Now)

Features:

Instructions :	How to install this template
Coder & Designer :	BlogTemplate4u & WpThemesFree
Detail :	Insya Allah is free islamic blogger templates, two column, left and right sidebar make this blogger templates very good for religion blog and you can use this blogger templates for personal blog too.
Compatible :	iefirefoxchrome
Properties :	Ads Ready, Black, BlogTemplate4u, Fixed, Left And Right, Three Column, WpThemesFree
Categories :	Cultural

Hello Spring Blogger Templates

( Downloads Now)

Features:

Instructions :	How to install this template
Coder & Designer :	BlogTemplate4u & WpThemesFree
Detail :	Hello Spring is free good blogger templates with vector design at header, two column layout, left sidebar and very good for personal blog and texture wood background make this themes very beautiful.
Compatible :	iefirefoxchrome
Properties :	BlogTemplate4u, Brown, Fixed, Left Sidebar, Two Column, WpThemesFree
Categories :	Vector