BloggerBolt

Exclusive Horizontal Slide jQuery Multi Tabs or Widget For Blogger

2009-09-30T20:52:00.000-07:00

This Post Has Moved Here >>>

See You There : )

Using Conditional Tags in Blog to Display Selective Widgets or Post Title

2009-09-29T00:14:00.000-07:00

This Post Has Moved Here >>>

See You There : )

Custom Your Google Search with Firefox Add on.

2009-09-23T03:04:00.000-07:00

Do you want to customize your Google search ? There is an Firefox add-on which can help you to easy customize your search criteria

This Extension allows you to create, use and manage your own Google Custom Search Engines right from within Firefox.

Once you create these engines you decide which websites are covered and which not, how they rank and so on.
If you don't change anything, your Search Engine will be more or less a normal Google Search.

To create or modify your own engines, a Google (or Google Mail) Account is required. The Addon leads you through the registration process if you don't have one yet.

Once created, the Google Custom Search Engines can be used by anyone - no login required. Also, they can easily be integrated into your own website or blog. You can - for example - create a search engine that covers only your website.

You can Download it From Firefox addon site HERE

How to Show Original Size of Image In Read More Hack! Instead of Thumbnails in Blogger

2009-09-10T04:47:00.000-07:00

Hello Guys A new hack For you : )
We All know How to implement Automatic Read more hacks With Thumbnails and Without Thumbnails.Now i found many People who want to know how To display Original size of Image In the Read more Hack! .By using above Automatic Read more hack The image gets disturbed when they come out as Thumbnails because of different dimensions of different images.

By using Below Hack! you will be able to do For What you want

How to Show Original Size of Image In Read More Hack! Instead of Thumbnails in Blogger ?

lets begin the Trick!

Login to Blogger>>>Go To LAYOUT>>>Then Click On Edit HTML>>>Press Ctrl+F

Search For </head> code:

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

&lt;style>
&lt;b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
&lt;b:else/>
span.fullpost {display:none;}
&lt;/b:if>
&lt;/style>

Save Your Template

Again Go To LAYOUT>>>Then Click On Edit HTML>>>Check Mark Expand Widgets>>>Press Ctrl+F

And search For <data:post.body/> code:

Copy below code and paste it just After the <data:post.body/> tag.

&lt;b:if cond='data:blog.pageType != "item"'>&lt;br />
&lt;a expr:href='data:post.url'>Read more!&lt;/a>
&lt;/b:if>

This Hack will only appear on Archive and Homepage

you can change BLUE text whichever you Like

Now Click Save the Template !

Wait Its Not done yet : )

Its a Semi Automated Hack !

Now You Will Use Below Code to Show The Result

&lt;span class="fullpost">&lt;/span>

Text Which You Want To be Appear<span class="fullpost"> The Text You Want To Hide </span>

IMPORTANT TIP: Now you are thinking that we have to type or copy Paste ths code in every post. NO !

Just Go to Settings tab >>> Formatting tab>>> Post Template Now find Text box Before It.Paste the Code <span class="fullpost"></span> In it and Save settings

Now you will automatically find this code in New Post Are Under HTML tab.

If you face any problem Please don't hesitate to comment =)

Eureka! The All New Blogger New Post Publish Interface With New Functions Introduced in Blogger

2009-09-10T03:00:00.000-07:00

Yes Guys this is really a good news for bloggers all over the world.Today when I opened my new post page in blogger I fOund It Loaded with some new Functions Like Font change, Redo undo, New post options, Re-sizable post editing area and many more

Here are some Good Surprising Features Of New Blogger Post Editor Have a look.

Look the Functions Added in the tool bar you will find REDO and UNDO

In the image Below You will see small markings in In the right down side of label, By using it we can Chang Height of Post edit area.Its really cool !

Image uploading Window is also replace with new looks It is now blue in color previously it was brown.You can upload one by one image on the same window,But also a bad news now you cannot upload 5 image at once.

Hurrey Now you will find a new option that is schedule posting, By using this you write a post select a future date , Then the post will automatically on that date specified by you.There are also two new options Edit HTML settings And Compose Settings.

new Color option is also very good now.

You can select Font Right from the toolbar above Yupee this is great option . Now we can add More Font styles on our blog.

I hope this has covered most Parts .Keep sharing with me your views.
Thanks To Blogger.com for these valuable changes.

Keep blogging....

Problems Or Errors in Blogger Jump Break Or Read more Solved/Fixed !

2009-09-10T01:10:00.000-07:00

Officially announced Jump Break feature is very powerful manual tool to create Post summaries in your blog.But these days many bloggers even me are facing some problem while using Jump Break.Below are some popular from them.

Problem #1

Unable to create Post summery using Jump Break.

What To Do ?

Find out that the Jump Break Tag  ( Have Space After -- ) is NOT this  ( Have no space After -- ) .We must use the Code with Space Or First Tag.Otherwise Jump Break Tag ill not work.

Problem #2

When we apply Jump Break The side bar of our page Automatically gets transferred to the Bottum of the page Below Post

What To Do?

Actually this happens when we Add Jump Break Or Tag  Between <div>...</div> Tag in our post.

For Example
<div>
Post summary

Rest of the post
</div>

This is a Wrong Placement of Jump Break Tag

Correct placement of Jump Break Tag

div>
Post summary
</div>

Rest of the post

Or simply we can Change div with span if we want to use Jump Break between div Tag

For example

<span>
Post summary

Rest of the post
</span>

Problem #3

In this case you are getting post summaries But...Read More>> Link is not visible.

What To Do?
Now there is a need alter our Template ,Just follow below Steps.

Step 1

Login to Blogger >>> Layout >>> Edit HTML >>> Then Check Expand Widget Templates

Step 2

Now Find

<data:post.body/>

And place Below code After <data:post.body/>

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"'><data:post.jumpText/></a>
</div>
</b:if >

You can Change above RED code with READ MORE >>> text or Image Code.

What is Favicon ? Where these lie in a Site ?

2009-09-09T09:14:00.000-07:00

A favicon (short for favorites icon), also known as a website icon, shortcut icon, url icon, or bookmark icon is a 16x16 pixel square icon associated with a particular website or webpage. A web designer can create such an icon and install it into a website (or webpage) by several means, and most graphical web browsers will then make use of it. Browsers that provide favicon support typically display a page's favicon in the browser's address bar and next to the page's name in a list of bookmarks. Browsers that support a tabbed document interface typically show a page's favicon next to the page's title on the tab.

The extension of fevicon image is fevicone.ico.

Now if you like to change your favicon or want to convert or generate your images or thumbnails into favicons or you are searching for favicon search directories directories you want to do any operation on favicons search favicon tag

How to Create Auto Read More Hack Without Images or Thumbnails in Blogger

2009-09-08T05:06:00.000-07:00

Hi friends, now a days read more hack is very popular among various webmasters.It gives our blogs a processional look.But with the passage of time we need some change.We always want t o do new experiments.That's why some people want to show a change in this hack also they want to show only summery of their post.Today i am going to give this hack which will show only summery with no image or thumbnail.

Lets begin the installation of this hack.

First Login to Blogger>>>Go To LAYOUT>>>Then Click On Edit HTML>>>Check Mark Expand Widgets>>>Press Ctrl+F

And search for <data:post.body/> and replace it with the following codes.

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'/>
<script type='text/javascript'>
var blogID = &quot;YOURBLOG ID&quot;;
function retriveSummaryPost<data:post.id/>(json){document.getElementById(&quot;summary<data:post.id/>&quot;).innerHTML
= json.entry.summary.$t + &quot;...&quot;}

function createSummaryPost<data:post.id/>(POSTID){ var script =
document.createElement(&quot;script&quot;);
script.src = &quot;http://www.blogger.com/feeds/&quot;+blogID+&quot;/posts/summary/&quot;+POSTID+&quot;?alt=json-in-script&amp;callback=retriveSummaryPost<data:post.id/>&quot;;
script.type = &quot;text/javascript&quot;; document.getElementsByTagName(&#39;head&#39;)[0].appendChild(script);
}
</script>
<script type='text/javascript'>
createSummaryPost<data:post.id/>(&quot;<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right'><a expr:href='data:post.url'>--&gt;Read more...</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='post_body'><data:post.body/></div>
</b:if>

Replace YOUR BLOG ID above (What is It ?)

Now save your template and you are Done ! =)

Comment if you like this post

Blogger Announced Official Jump Breaks ! Or Read more Or Post summaries

2009-09-08T00:15:00.000-07:00

Fianally Blogger has announced Its official Jump Break Or what we called it Read more Hack ! Now there is no need to Add any CSS or J.S code to templates to have this feature on our blog.

How This Will Work ?

A small broken page logo is added on the toolbar of blogger post editor which is called Jump Break

Jump Break Button ?

Jump Break Add a special code which looks in HTML like  and a Grey line In Compose Mode .This tag can be added any where in the post area.The portion of post above the Jump Break will act as summery and will be visible and the portion below the Jump Break will be hidden and will be shown if you click Read More link

How to Use Jump Break In Your Post ?

For All New Advanced Post Editor

Move your cursor in the post whee you want to add Jump Break and Press Jump Break Button in the toolbar

For Old Post Editor Users there is a need to add 

Now will see post summaries on home page

Disadvantage

This is not convert your all posts summaries automatic.To get that happen some manual job ir requied.Its ver difficult to do this if you have bulk of posts.

There are also some problems associated with find them in Next post.

How to Change Image Opacity On Hover - Image Effect In Blogger

2009-09-05T23:59:00.000-07:00

This Post Has Moved Here >>>

See You There : )

New Animated Dock Menu For Bloggers

2009-09-03T23:08:00.000-07:00

This Post Has Moved Here >>>

See You There : )

Thumbnail Hover/Zoom Effect to Images in Blogger Blogs Using jQuery

2009-09-03T22:36:00.001-07:00

This Post Has Moved Here >>>

See You There : )

Create Drag-able/Movable Image in Blogger Using jQuery

2009-09-03T22:35:00.001-07:00

This Post Has Moved Here >>>

See You There : )

Show Title/ Tooltip On Mouse Over Or hover A link Using jQuery In Blogger Blogs

2009-09-03T22:34:00.000-07:00

This Post Has Moved Here >>>

See You There : )

Create Beautiful jQuery Black Sliding Menu

2009-09-03T22:33:00.001-07:00

This Post Has Moved Here >>>

See You There : )

How the well off keep themselves informed

2009-09-03T20:36:00.000-07:00

NEW BMW BIKES !!! 2009

2009-09-03T09:16:00.000-07:00

BMW Board chairman Nobert Reithofer, who said the company was cutting as many as 600 jobs in overseas operations and 2,500 in Germany, was likely to add more manpower in India.

He said the company, which set up an international purchasing office (IPO) in India between 2006-07, has been running a pilot programme to increase component sourcing from India.

Give Reflection, Watermark, Shadow,Round Corners,Drop Shadow,Barcode to your image using This site.

2009-09-03T09:06:00.000-07:00

Direct Cut Images From Your Screen And Paste In PNG or BiTMP(Screen Cut Software)

2009-09-03T08:55:00.000-07:00

In your regular practice First you press "Print screen button" then paste image in Paint Cut Actual required Image ,Convert it into PNG Or Sometimes compress it .And Then Upload it.Shhhess This very Long Long Process . Now i going to Share with you a Very Cool Software .

Features:

1) Images Size Difference is very large, Usually 300kb By using this software its Only of 34kb(200*200 picture)

2)Image extension is PNG which is widely used, uploaded and can be edited online.

3) Easy to use

4) No Compromise With Image Quality.

Requirements

You must have .Net Framework installed On your computer.

Procedure to use this software.

1# Step

Install Software

2# Step

Run Application.After starting you will see small butterfly icon below Right hand side of the screen

3# Step

Then Right Click on it to change options To change selection area(Free hand or Rectangle) And Change format Png or BitMP. I am using PNG it gives quality picture of very small size.

4# Step

To start double click on the icon.After clicking whole screen will Become Grey in color.Now select your Space or Area on screen to CUT .Then Go on Desktop And Paste the Selected Image.

Here is the Download Link (Download)Brought by http://www.atalasoft.com

RETWEETButton in Every Post Of Blogger

2009-09-03T08:54:00.002-07:00

How to Add a "RETWEET" button on Blogger ?

Twitter is getting Popular As it is the fastest massaging serving and also retweet Most of us might be knowing of both these.

Twitter – Twitter is an unpaid social networking site that enables users to sent instant short massages of 140 characters To Followers.For example if you have 1000 Followers and you update a massage that "I am Studding at present" Now this massage will be distributed to all 1000 Followers.

Retweet –Yap This is also its sister widget installs in every post of yours.If a person presses RETWEET button then post title And its Proper Link will be sent to all the Followers Of the clickers account. This one enables to re post some interesting tweets on twitter.The retweet button can act like a tweet counter
Adding a Retweet button will display a number,your post has been tweeted and will also allow your readers to Retweet it.

On The basis of its placement there are 4 Styles

1# Style

Code for style 1

<div style="float:right;padding:4px;">
<script type="text/javascript">
tweetmeme_url = '<data:post.url/>';
tweetmeme_source = 'your_twitter_user_name';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>

2# Style

Code for style 2

<div style="float:left;padding:4px;">
<script type="text/javascript">
tweetmeme_url = '<data:post.url/>';
tweetmeme_source = 'your_twitter_user_name';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>

3# Style(Compact)

Code for style 3

<div style="float:left;padding:4px;">
<script type="text/javascript">
tweetmeme_style = 'compact';
tweetmeme_url = '<data:post.url/>';
tweetmeme_source = 'your_twitter_user_name';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>

4# Style(Compact)

Code for style 4

<div style="float:right;padding:4px;">
<script type="text/javascript">
tweetmeme_style = 'compact';
tweetmeme_url = '<data:post.url/>';
tweetmeme_source = 'your_twitter_user_name';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>

How to insert the Retweet Button in your blog posts?

1.Select any of obove four retweet styles,and copy it's code into a text file.
2.Now in this code replace your_twitter_username with your actual twitter user name

Now Login to Blogger>>>Go To LAYOUT>>>Then Click On Edit HTML>>>Check Mark Expand Widgets>>>Press Ctrl+F

Search For below code:-

<data:post.body/>

And now before that, settle your retweet code
5.Save the template.
Now you should have a Green Retweet button with every your blog posts.
Additional Sign: How to test the retweet count of any url?
To Check the number your posts are tweeted the retweet count of any url,just go to this url in your browser. http://api.tweetmeme.com/imagebutton.gif?url=http://twitter.com .Replace http://twitter.com with the url of the post whose retweet count you would like to know

Show Image Thumbnail On Hover A Link Widget For Blogger (Easy Install)

2009-09-03T08:04:00.000-07:00

This Post Has Moved Here >>>

See You There : )

___________________________________________________________________________________

Just think, we Hover over a Link to an Image,Internal link Or any Outer link than an Image Or Thumbnail of that image or Link appears.This can be used if we want to give an idea about whole page which will open that link is clicked.See demo below

To provide a quick navigation for our visitors we can give an idea about what page they will see if they click on this link .I searched Lot on internet about a service bu using with i can show the page thumbnail.Then I Found This site http://www.websnapr.com/.Following are some Example

DEMO:

Any Image
Your internal link
Any external link

This the lightest Service which i have Found.

3 Options

You can show these on all links of your site
you can show these on a particular links
You can use this on a particular page.

How to Add a Signature image below every post of Blogger based Blog

2009-09-03T07:54:00.000-07:00

This Post Has Moved Here >>>

See You There : )

Redirecting a URL/Blog to Another URL/Blog/Site By Using World's Fastest And Simplest Script.

2009-09-03T07:33:00.000-07:00

This Post Has Moved Here >>>

See You There : )

Show Colored Background For HTML and JAVA Scripts In Blogger based blogs.

2009-09-03T06:41:00.000-07:00

This Post Has Moved Here >>>

See You There : )

Show Only Titles Of posts In Archive and Lable Page In Blogger

2009-09-03T06:39:00.000-07:00

Sometimes for fast navigation we think that only displaying post titles is a good idea.We can Show Titles of post in home pages,Archive pages, Lable pages etc. First i want to Clear that conditional Tags can be used in blogger Also.They are easy to use.You can Display your post in any way by using These conditional tags.There are two Cases.

#Case 1

Login to Blogger>>>Go To LAYOUT>>>Then Click On Edit HTML>>>Check Mark Expand Widgets>>>Press Ctrl+F

And Search

<b:include data='post' name='post'/>

To Show titles Only on label or archive page Replace with Below Codes :-

<b:if cond='data:blog.homepageUrl
!= data:blog.url'>

<b:if cond='data:blog.pageType != "item"'>

<h3 class='post-title'><a expr:href='data:post.url'><data:post.title/></a></h3>

<b:else/>

<b:include data='post' name='post'/>

</b:if>

<b:else/>

<b:include data='post' name='post'/>

</b:if>

After Saving you will see only post titles on clicking Lable Or Archive

#Case 2

Show titles on Lable Or Archive.

Login to Blogger>>>Go To LAYOUT>>>Then Click On Edit HTML>>>Check Mark Expand Widgets>>>Press Ctrl+F

And Search

<data:post.body/>

After finding Replace with:-

<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>
</b:if>

This will show only post title on all pages of blogger including homepage label and archive pages.

Replace Item With:-

index It will show post title only in archive pages

archive to NOT show in Archive Page