2

Add The Blogger “Read More” Expandable Posts Link - Blogger Hack

20 February, 2008

This is a pretty popular Blogger hack that lots of people have asked me about. Instead of answering to each email individually, I thought it would make more sense to write an article about it.


With this hack, you can choose to display a select amount of text from the beginning of each post as a teaser instead of showing the entire post on the front page of your blog. Then when people want to read the rest of the post, they can click a “read more” link to see the full post. This is very handy if you have lots of long articles all on one page. (Note that you’ll need to have post pages enabled in order to make this feature work.)


Step #1 - Update Your Template Code


First you need to edit your existing code so I recommend copying and pasting it into notepad or any text editor. Also, it’s smart at this point to create a backup of your template just in case something goes wrong. Now do a search (CTRL + F) within the text editor for the following code post-header-line-1. This is the default code that Blogger includes but some custom templates remove or change this code so you might have trouble finding it. If you can’t locate this text then try searching for <data:post.body/> instead. Your template will for sure have this since it’s the tag that actually prints the body of your post.



Now depending on which code you were able to find will determine how easy the next steps will be. You might need to do some detective work first in order to get this working properly in your custom template. The idea is to get this new code into your template before the <data:post.body/> tag. Keep reading and hopefully the explanation will illustrate the concept clear enough so you are able to adapt this hack to your custom template.


Add the following code below the <div class=’post-header-line-1′/> and <div class=’post-header-line’> tags if you’ve got both.


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

<style>.fullpost{display:inline;}</style>


<p><data:post.body/></p>

<b:else/>

<style>.fullpost{display:none;}</style>


The result should look something like this:


new-code-block.png


If you don’t have the default <div class='post-header-line-1'/> tag then your result should look something like this instead. This is how it would be done in the MushBlue Blogger custom template:



new-code-block-mush.png


Notice in both examples that the code in yellow and the <data:post.body/> tags are the same — it’s just tag above it that will differ based on the template you’re using.


Now let’s add one more bit of code which will actually create the “read more” link in your post. This code will go below the <data:post.body/> tag so copy the following and paste it in. Feel free to change the “Read more…” text to whatever you want the link to look like. Be careful not to delete any other code during this process.


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

<a expr:href='data:post.url'>Read more...</a>


</b:if>

</b:if>


Yes, there are supposed to be two </b:if> tags in the above code so don’t think it’ s a mistake. The result should look like this:


new-code-block-2.png


This code will be the same no matter what template you are using. Just make sure it goes below the <data:post.body/> as shown in the image above.


Now let’s look at what the final result should be. Here’s the updated code block you just worked on all put together:



new-code-block-3.png


Ok, you’re all done editing the template code. Paste it back into your Blogger html window and save it. If you get an error, you made a mistake. The most common mistake is to accidentally delete a > or < while pasting in the new code. If it saved successfully, it’s time to move onto the next step and modify a quick Blogger format setting.


Step #2 - Add a Class Tag in Your Default Post Template


For this step, you need to navigate in your Blogger account to “Settings” => “Formatting” and scroll all the way down to the bottom. It’s the last option called “Post Template”. You’re going to paste in the following code:


<span class="fullpost">


</span>



You’ll want to keep the spaces in there which will make sense later. After you save this, it will look like this:


post-template2.png


Step #3 - Create a New Post


Ok, we’ve got everything all setup so it’s time to go and test it out. Hopefully you’ve got a new post in mind for your blog. If not, then we’ll just create a test post which you can later delete. When you click on the “Posting” tab, you’ll notice that the post text area is now pre-populated with the <span class=”fullpost”> and </span> tags. If not, then you didn’t save it properly so go back and re-read step #2.


So when writing your new post, anything you put above the <span class=”fullpost”> tag will be the teaser text. The main body of your post needs to go in between the <span class=”fullpost”> and </span> tags in order for the “read more…” link to work properly. See the screenshot below. Sometimes pictures illustrate better than words.



post-template-result2.png


Now publish or preview your post to see the “read more” hack working on your blog. If it doesn’t show up for some reason, go back and run through the steps again. Most likely you pasted the code blocks in the wrong places. It’s difficult to troubleshoot these issues since each template can be unique so please make sure to double-check your template before asking for help in the comments section below.


Here’s the live post with the “read more…” link properly working based on the text I used above in the post text area.


post-results.png


Additional Info


If you want to go back and update your old posts with this new “read more…” feature you can. Just go back and edit each post manually. Essentially you’ll need to paste in the <span class=”fullpost”> and </span> tags breaking apart the post into two parts.


For some posts, you might not want to use this feature at all. If that’s the case, just delete the <span class=”fullpost”> and </span> tags from within your new post text area. Then your new post will show up entirely just like it used to before you implemented this hack. Enjoy!

Thanks To - David

0

Labels into Horizontal Tabs - A Blogger Hack

18 February, 2008

Below are the instructions on how to turn "Labels into Horizontal Tabs,"

Step 0: Label your posts.

Make sure your blog has some posts with label assigned, otherwise nothing will get created. See this topic on how to create labels:

http://help.blogger.com/bin/answer.py?answer=44498&topic=9084



Step 1: Downloading and unzipping the file from the Exploding Boy website

Here are the downloading and sample links:

http://www.exploding-boy.com/2005/12/15/free-css-navigation-designs/

http://exploding-boy.com/images/cssmenus/menus.html

Then, have a googlepages account and upload the pics there.

Step 2: Changing the Header to become appendable.

Modify this line:

<b:section class="header" id="header" maxwidgets="1" showaddelement="no">

to become

<b:section class="header" id="header" maxwidgets="2" showaddelement="yes">



Step 3: Prepare the CSS portion of the hack.

Go to the very end of this article and cut the CSS portion you like there, then paste it at the very end of the CSS code (right before the closing CDATA part - see picture below)

Make sure to replace "www.yourwebsite.com" to your website.



Below is an example of pasting the code for style F:


/*- Menu Tabs F By http://www.exploding-boy.com/2005/12/15/free-css-navigation-designs/------
*/

#tabsF {
float:left;
width:100%;
font-size:80%;
line-height:normal;
border-bottom:1px solid #000;

}
#tabsF ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabsF li {
display:inline;
margin:0;
padding:0;
}
#tabsF a {
float:left;
background:url(" http://www.yourwebsite.com/labeltabs/tableftF.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabsF a span {
float:left;
display:block;
background:url(" http://www.yourwebsite.com/labeltabs/tabrightF.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#666;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabsF a span {float:none;}
/* End IE5-Mac hack */
#tabsF a:hover span {
color:#FFF;
}
#tabsF a:hover {
background-position:0% -42px;
}
#tabsF a:hover span {
background-position:100% -42px;
}



Step 4: Adding Label Widget

Follow the instructions from this article, especially step B.4. After you've done with inserting the code & save it, go to Page Element option and drag the newly added widget to stay under the Header area (that we fixed so that it would accomodate this new widget.)


<b:widget id='Label10' locked='false' title='' type='Label'>
<b:includable id='main'>
<div id='tabsF'>
<ul>
<li><a expr:href='data:blog.homepageUrl'><span>Home</span></a></li>
<b:loop values='data:labels' var='label'>
<li><a expr:href='data:label.url'><span><data:label.name/></span></a></li>
</b:loop>
</ul>
<!-- <b:include name='quickedit'/> -->
</div>
</b:includable>
</b:widget>


If you use a style other than F, than make sure id='tabsF' reflects the correct tab, such as id='tabsE' for style E. Later, if you like a different design, just cut-and-paste the style's CSS code, then change this id again to reflect the change.



There you have it! Well-designed tabs from professionals (The Exploding Boy website) being integrated into the new Blogger Beta.



Enjoy This hack !!!

Thanks To -
Hoctro

0

TabView In Your Blog - A widget for Blogger

17 February, 2008

Dear Friend,

Now that I have the new framework for making widgets in store, I feel confident and start trying to create a new tab widget - using labels as tabs, similar to this Yahoo! widget.



With the wonderful help of Yahoo! TabView widget, the programming time reduces quite a bit.

You can see the result from my homepage:


If you want to install this onto your blog, follow these instructions.

Step 1: Installing the core Javacript library object

First, follow the instructions from this article Hacking Technique: How To Modify a (Beta) Template, in particular section C.2 (for step 1 & 2) and B.4 (for step 3).

Next, install the latest version of the Javacsript Core Library.

Save the template.

Step 2: Installing Yahoo! Tab View requirements

Cut and paste this code below right after step 1's code (such that these code still stay before the closing </head> tag.). See instruction here if you're still not sure.


<link href='http://yui.yahooapis.com/2.3.0/build/tabview/assets/tabview.css' rel='stylesheet' type='text/css'/>


<link href='http://yui.yahooapis.com/2.3.0/build/tabview/assets/border_tabs.css' rel='stylesheet' type='text/css'/>

<script src='http://yui.yahooapis.com/2.3.0/build/yahoo-dom-event/yahoo-dom-event.js' type='text/javascript'/>
<script src='http://yui.yahooapis.com/2.3.0/build/element/element-beta-min.js' type='text/javascript'/>

<script src='http://yui.yahooapis.com/2.3.0/build/tabview/tabview-min.js' type='text/javascript'/>


<style type='text/css'>

.yui-content {
padding:1em; /* pad content container */
}

.yui-navset .yui-content {
border:1px solid #ccc;
}
.yui-navset .yui-nav .selected a, .yui-navset .yui-nav a:hover {
background-color:#fff;
}

.yui-navset .yui-nav li a {
background:#e5e5e5 url(http://developer.yahoo.com/yui/examples/tabview/img/round_4px_trans_gray.gif) no-repeat;
}
.yui-navset .yui-nav li a em {
background:transparent url(http://developer.yahoo.com/yui/examples/tabview/img/round_4px_trans_gray.gif) no-repeat top right;
padding:0.5em;
}

/* top oriented */

.yui-navset-top .yui-nav { margin-bottom:-1px; } /* for overlap, based on content border-width */
.yui-navset-top .yui-nav li a {
border-bottom:1px solid #ccc;
}

.yui-navset-top .yui-nav .selected a { border-bottom:0; }
.yui-navset-top .yui-nav .selected a em { padding-bottom:0.6em; } /* adjust height */
</style>


Save the template.

Step 3: Installing the widget

Add this code between any two "b:widget" tags, save the template, and you're almost done.


<b:widget id='HTML102' locked='false' title='MultiTab Widget' type='HTML'>
<b:includable id='main'>
<div class='widget-content'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'
></h2>
</b:if>
<div id='doc'>
<div>
<h2>Blogging To Fame</h2>
<div class='yui-navset' id='multiTab1'/>
</div>

<!--
<div>
<h2>Hackosphere</h2>
<div class='yui-navset' id='multiTab2'/>
</div>
-->

</div>
<div id='103'/>
</div>

<script type='text/javascript'>
// Developed by Hoctro - All rights reserved 2007
// This credit must be included in all your derived usages.
var p1 = document.createElement('h6');
document.getElementById('103').appendChild(p1);
p1.innerHTML = cb.txt('TabView');

function listOneTab(json, tabView, title, act) {
var label = '';
var text = '';
var nPost = 10;

if (title == "")
label += cb.getLabelFromURL(json);
else
label += title;

text += "<div id='" + label + "'><ul>";

var numberPost = (json.feed.entry.length &lt;= nPost) ?
json.feed.entry.length : nPost;

for (var i = 0; i &lt; numberPost; i++) {
var entry = json.feed.entry[i];
text += "<li>" + "&lt;a href='" + cb.getLink(entry, "alternate")
+ "'&gt;" + cb.getTitle(entry) + "</li>";
}

text += '</ul></div>';

tabView.addTab( new YAHOO.widget.Tab({
label: label,
content: text,
active : act
}));


}

var blog1 = "hoctro.blogspot.com";
var tabView1 = new YAHOO.widget.TabView('multiTab1');
var labels1 = ['JSON Hacks', 'Label Hacks','Free Templates'];
function listTab1(json) {
listOneTab(json, tabView1, "", false);
}
function listLatestPostsTab1(json) {
listOneTab(json, tabView1, "Latest Posts", true);
}
function listLatestCommentsTab1(json) {
listOneTab(json, tabView1, "Latest Comments", false);
}

// Activating calls!

// Latest Posts
cb.search( blog1, "posts", 1, 25, 'listLatestPostsTab1');

// Latest Comments
cb.search( blog1, "comments", 1, 25, 'listLatestCommentsTab1');

// Preferred Labels
for (var i=0; i &lt; labels1.length; i++)
if (labels1[i]) cb.searchLabel(blog1, labels1[i], 'listTab1');

/*
var blog2 = "hackosphere.blogspot.com";
var tabView2 = new YAHOO.widget.TabView('multiTab2');
var labels2 = ['Neo','Widgets', "Blogger Power"];
function listTab2(json) {
listOneTab(json, tabView2, "", false);
}
function listLatestPostsTab2(json) {
listOneTab(json, tabView2, "Latest Posts", true);
}
function listLatestCommentsTab2(json) {
listOneTab(json, tabView2, "Latest Comments", false);
}
// Activating calls!
// Latest Posts
cb.search( blog2, "posts", 1, 25, 'listLatestPostsTab2');

// Latest Comments
cb.search( blog2, "comments", 1, 25, 'listLatestCommentsTab2');

// Preferred Labels
for (var i=0; i &lt; labels2.length; i++)
if (labels2[i]) cb.searchLabel("hackosphere.blogspot.com", labels2[i], 'listTab2');

*/
</script>
</b:includable>
</b:widget>


Save the template.

After you install the above three easy steps, just change these things found in step 3' code:

a. To change the title, look for this line:

<h2>
Blogging To Fame</h2>


b. modify the label tabs to become yours:

var labels1 = ["JSON Hacks", "Label Hacks",
"Free Templates", "Notable Hacks"
];

c. Change value below from 10 to any value you want for the maximum of posts per tab

var nPost = 10;

d. then replace mine with your blog's name

blog1 = "bloggingforbread.blogspot.com";


For advanced bloggers who would like to manipulate the CSS, "step 2" contains the information to do so. Also consult the Yahoo! TabView widget tutorials and examples for other variations of these tab options.



To add another tabview to this widget such as the picture below, please see part 2.



Until next time.

Thanks To - Hoctro

1 comments

Disable Right Click on Blog - A Blogger Hack

I know many Blogger don't like to get there unique content copied by any other blogger.
SO now don't worry about getting your content copied here is a solution.
By this Hack users of your blog cannot right click on your blog and your content remains safe :)

This widget is very simple to install into your blog
Following are the steps

Step 1 > Go to Template -> Page Elements.
Step 2 > Add a Page Element -> then Add a HTML
Step 3 > Now just copy and save the following code into Html and you are done !


<script language='JavaScript'>
<!--

//Disable right mouse click Script
//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com

var message="No Right-Click!";

///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}

function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}

if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}

document.oncontextmenu=new Function("alert(message);return false")

// -->
</script>

Enjoy this hack !!!

0

Label Cloud in your blog - A blogger hack

14 February, 2008

To Put Label cloud or tag cloud on yours blogger sidebar template you have to follow below instruction carefully and with free mind :) This hack will really add flavour to your blogger Template and help yours readers in finding contents according to label or tags ,this features will really make you free to add many tags according to your blog post.Make sure you backup your template before making any changes!

  • Log in to your Blogger account

  • On yours Dashboard Select Layout



  • Note-You have a Label widget already Installed In your blogspot webpage where you want it (it can be moved around later)


  • Go To Edit Html


  • Then Search for the code ]]></b:skin> And Place Below Code In place of ]]></b:skin>(By Removing ]]></b:skin>)

  • Click Here To Get The Code :)

  • Now Save Template and Search for below mention label widget in blogger Html

  • <b:widget id=’Label1′ locked=’false’ title=’Labels’ type=’Label’/>


  • Atlast replace the above mention Label1 widget code with below code


  • Click Here To Get The Code :)


    And you are Done :) ,In Case Of Any problem fell free to post yours problems in Comment

    Original By - Scrapur

0

Add a Menu Bar - Blogger Hack

10 February, 2008

Missing a real menubar on you Blog? This hack explains how you can add a simple menubar to the top of your Blog. It is in fact a simple link list, and that is a standard page element of Blogger Beta. I have added a new section at the top of the Blog Page, and the link list is inside that section. Of course there are some tricks to play, such as hiding the link list title, and showing the links list elements side by side. Here is how it is done.



In this Page Layout you can see where I have added the Menubar. The code of this section is highlighted in red:

<div id='header-wrapper'>
<b:section class='menubar' id='menubar' maxwidgets='1' showaddelement='yes'>
<b:widget id='LinkList2' locked='true' title='Menubar' type='LinkList'/>
</b:section>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='false' title='Beautiful Beta (Header)' type='Header'/>
</b:section>
</div>

To the CSS-part of your template, add coding for the menubar-id:

#menubar h2 {display:none;}

#menubar ul {
list-style: none;
}
#menubar li {
float: left;
}

#menubar a:link, #menubar a:visited, #menubar a:hover {
padding: 5px;
display: block;
color: $headerTextColor;
}

#menubar a:hover {
background-color: $headerCornersColor;
}
The menubar title is hidden, so that only the options are visible.
The list-elements are set to none, so that there are no bullets in front of the menu options. And if a menu-option is hovered over, it is highlighted.

Original By -
Ehtisham Khan-Edwardian

3

Add Signature to your Blogger Post - Blogger Hack

07 February, 2008

If u Want to Pretty Up Your Post,There Are many Things,But to Add Signature to your Blogger Post is Much Fun.Well,Below i am Showing a Tutorial How to Add a Signature to Your Blogger Post!

You must first have a signature that you want to have at the bottom of your post. This signature will be in the form of an image. To get that image, you can look online for sites that help create signatures, or you can make your own using GIMP as I did. If you need help making a signature, read some of my posts on design and graphics. After you have your signature, upload it to your web host...I use Ripway.

Open your Dashboard/ Settings/ Formatting/ Post Template. Put this code in the Post Template box:

<p><image class="centered"alt="post signature" src="SIGNATURE URL" /></p>

SIGNATURE URL



0

Weather Report in your Blog - Widget For Blogger

Widgetizing your Blog is the new thing to explore here on Blogger TTT. Ramani shows how to add random Einstein quotes to your Blog. Phydeaux3 started all this showing Flickr Puppies, and even Hoctro now shows a Flickr Zeitgeist widget. So it is time that Beautiful Beta follows these fellows, with a useful Weather Forecast Widget. And ofcourse a tutorial on how to create this widget on your own Blog and make it easy-to-install for your readers.

You have to follow 3 easy steps:

  1. Create the widget
  2. Add it to your Blog
  3. Add an Install-button to your Blog
Step 1: Create the Widget
Go to WeatherReports.com, scroll down and click Add WeatherReports To Your Site.
In the next screen, enter your city, select the colors and style of the weatherbox. After entering all your selections, you will go to the next screen automatically. Take a look at the preview, and select and copy the HTML-code.


Step 2: Add the Widget to your Blog
Add an new HTML page element to the sidebar of your Blog. Paste the code that you copied into the page element, and set its title to "Weather Report".

Don't save it yet, but go to step 3.

Step 3: Add an Install-button
Now we are going to add a button, that installs the widget on your visitors blog when it is clicked. In fact, we'll add a form with several input fields, but only the button will be visible. Here we go.

<form action="http://beta.blogger.com/add-widget" method="post">
<input value="Weather Report" name="widget.title" type="hidden"/>
<textarea style="display:none;" name="widget.content">
&lt;script type="text/javascript" language="javascript1.2" src="http://weatherreports.com/jscript.html?width=125&height=125&theme=brand&location=Amsterdam%2C%20Netherlands&units=c"&gt;</script>&lt;div><a href="http://www.weatherreports.com/"&gt;<small&gt;Free Weather Reports&lt;/small&gt;</a></div>
</textarea>
<input value="Install to Blog" name="go" type="submit"/>
</form>


The text between the <textarea>
-tags is the html of your widget. Please notice that each <> is replaced with >.

Now save the page element and view your Blog.
If you want more information on how to add third-party widgets to your blog, take a look at these help pages.

Done !!!

Original - by

1 comments

Change Title Of Each Post - Widget For Blogger

Guys get ready to change your title accordingly to your posts.I mean you can now have a unique title for each and every post now.This will really Boost your blogs ranking and it will help you for your blogs Search Engine Optimization.Guys please be creative so that you will get best result out of it
Now lets start to implement this into your blog.Just Follow this simple steps


Step 1-Goto Blogger Dashboard>>Layout>>Edit Html
Step 2-Backup your template
Step 3-Follow the instructions below

Find this code in your XML template{in header}

<title><data:blog.pagetitle/></title>

Now replace it with

<!-- Start Widget-based: Changing the Blogger Title Tag -->
<b:if cond='data:blog.pageType == "item"'>
<b:section id='titleTag'>
<b:widget id='Blog2' locked='false' title='Blog Posts' type='Blog'>
<b:includable id='comments' var='post'/>
<b:includable id='postQuickEdit' var='post'/>
<b:includable id='main' var='top'><title><b:loop values='data:posts' var='post'><b:include data='post' name='post'/></b:loop> ~ <data:blog.title/></title></b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'/>
<b:includable id='feedLinksBody' var='links'/>
<b:includable id='backlinks' var='post'/>
<b:includable id='status-message'/>
<b:includable id='feedLinks'/>
<b:includable id='nextprev'/>
<b:includable id='commentDeleteIcon' var='comment'/>
<b:includable id='post' var='post'><data:post.title/></b:includable>
</b:widget>
</b:section>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>
<!-- End Widget-based: Changing the Blogger Title Tag -->

Further more you can add a very good keyword in homepage's title by just adding Keyword + Blog Title by finding this line in the above code{3rd last}-

<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>

and adding keyword here

<b:else/>
<title> <data:blog.pageTitle/>Keyword</title>
</b:if>

Done !!!

Original -

2

Add Favicon - Widget For Blogger

04 February, 2008

Favicon is known as favorite icon for a your blog or site. Adding a Favicon to your blog is a good way to distinguish your blog from the millions of other blogs.
Below is Screen Shot of my Favicon so that you can know what Favicon exactly is :-


Ok now you what Favicon is now let see how to add it into your Blog or site. I have seen many procedures of adding Favicon. I will tell you the simplest method to add it
Here we go...

Step 1>
step 1 is choosing you Favicon it may be in any format like JPG,JPEG,PNG Etc. Just save that Image which you like into your hard drive.
If you have problem in finding Favicon then simply go to google images and type the keywords like Favicon or icon or anything you want as Favicon (Be Creative).After saving your image file into your hard drive go to step 2

Step 2>
Now you need to create the .ico file of that image file which you saved into your hard drive. For making .ico file of any image file i use Html-Kit.com. After opening there site you just need to upload you image file there and they convert you image file into .ico format then you just need to download it and step 2 is Done !

Step 3>
Now time to upload your .ico file to any hoster like Google pages. After uploading your .ico file get the path of that image file - http://Bloggingforbread.googlepages.com/favicon.ico now after getting the path move to Step 4

Step 4>
Now login to your blog and go to the Edit Html tab from Template. Then paste the following code below <head>

<link href='http://youraccount.googlepages.com/myicon.ico' rel='shortcut icon'/>
<link href='http://youraccount.googlepages.com/myicon.ico' rel='icon'/>

Before pasting this code to your blog's Html just exchange both the line -
http://youraccount.googlepages.com/myicon.ico
with your .ico files path

That's It you are Done !

If you have any type of problem adding Favicon to your Blog fell free to ask here by commenting.

Happy Blogging !!

0

Now Get Adsense Pin at 10 $

31 January, 2008

Today i was searching the adsense blog and i was shocked that google has decreased the minimum amount for getting adsense pin at 10 $.
Its very helpful for adsense user now and as they get the PIN at 10 $ which was 50 $ till yesterday.

Below is the original Post Posted in Adsense Blog :-

Pinning it down (to $10)


As part of our efforts to make sure that the AdSense account details publishers provide are valid and correct, we do a couple types of validation that you may be aware of: the Personal Identification Number (PIN) program and, in some locations, phone number verification. One or both of these verification methods is required in order to ensure the security and accuracy of your information so you can receive payments from AdSense.


In the past, our system would ask you to verify your information when your earnings reached $50. However, we've recently changed the threshold to $10. This lowered amount means many of you may see a PIN arrive in your mailbox soon, as well as a prompt in your account to verify your phone number. For more information about these holds, visit the links in the 'Required Actions' box on your Payment History page.


(Psst: If your all-time earnings are between $10 and $50, this might be a good time to learn all about PINs so you'll know what to expect. Or, if you prefer surprises, you can remain blissfully ignorant till a PIN mailer pops up in your mailbox. Just be sure you don't pitch it in the trash!)

0

Design Float - Widget For Blogger

28 January, 2008

Design Float is a great resource - digg-like - to share stories about Web Design, CSS, Identity and Branding, Digital art and Illustration. This tutorial explains how to add a Float it! button on each post on your Blogger template.


Edit your Blogger template and check "Expand Widget Models". Find this line of code:

<'post-footer-line post-footer-line-3'>

...and paste, below this line, this code

<script type="text/javascript">submit_url = '<data:post.url/>';</script>
<script type="text/javascript" src="http://www.designfloat.com/evb/button.php"></script>

The result looks like this

If you prefer a big button copy and paste this button instead of the first code:

<script type="text/javascript">submit_url ='<data:post.url/>';</script>
<script type="text/javascript" src="http://www.designfloat.com/evb2/button.php"></script>

The result is like this

Save your template and post your stories on Design Float!

1 comments

Blogger Templates - All Templates Available on Internet.

26 January, 2008

I Know Blogger.com provides only 16 default templates and 8 of them are very unprofessional and untidy so i decided to give you the all the templates available on the on the internet from this single page which will be updated daily. There are 2 and 3 column and also some other templates which i have searched around the net and also tested every single Template and made a xml file of all Templates so have fun and enjoy them...And Yes this templates are not mine let me thank the original creater's of this templates. I have pos ted this templates for users convince but you are most welcome if you are having some problem installing this templates.

So Enjoy my Find...............:-):-):-)


2-Column Templates

1) Hello



Blogger Template Hello


Demo | Download


2) Glossy Blue



Blogger Template Glossy Blue


Demo | Download


3) Mush Blue





Demo | Download


4) Emire


emire blogger template blogspot

Demo | Download


5) Spiderman


Blogger Template Spiderman


Demo
| Download


6) The Late Show



Blogger Template The Late Show


Demo
| Download


7) Peaceful Rush



Blogger Template Peaceful Rush


Demo | Download


8) Top Secret



Blogger Template Top Secret


Demo
| Download


9) Fleur



Blogger Template Fleur


Demo
| Download


10) Summer



Blogger Template Summer


Demo
| Download


11) Road To October



Blogger Template Road To October


Demo
| Download


11) MistyLook



Blogger Template MistyLook


Demo | Download




3-Column Templates

1) Green Marinee



Blogger Template Green Marinee


Demo
| Download


2) Garland



Blogger Template Garland


Demo
| Download


3) Magic Paper



Blogger Template Magic Paper


Demo
| Download



Other Templates


1) Ambiru



Blogger Template Ambiru


Demo
| Download


As i am making XML of all Templates I need some time so please be patient

MORE TO COME...............

4

How Google Detects AdSense Invalid Clicks


Fooling Google Adsense is like fooling yourself

















Thinking to cheat AdSense? Stop that. It will never bring you anywhere. You might pull it off with smaller ads network, but definitely not with Google. Here are some detection methods they might use. At the very least, they have the resources to do so.


IP Address
If the AdSense click is originated from the same IP Address as the one used for accessing your AdSense account, your account is flagged.

Cookies
Most home users do not use static IP Address for Internet connection. In most cases just disconnect and reconnect will give you a new IP Address. But don’t forget, Google has set cookies on your computer.

Other Google Services
Thinking that you are safe just because you do not access your AdSense account? Think again. This time, consider these: GMail, Google Earth, Google Calendar, Google Search, Google Toolbar, Google Talk, Google Sitemap, Google Desktop, Blogger, and so on, and so on. With the wide range of services they provide, Google can trace the originator of most (or probably almost all) clicks.

Click Pattern 1
Oh, why this computer / IP address / person is so trigger-click-happy on this particular website but never click on the ads on other sites?

Click Pattern 2
And why is it that people accessing these sites direct (type-in URL or from bookmark) tend to be very active ad-clickers compared with those referred from search engine or other sites?

Click Pattern 3
And why the ad-clickers like to hit and run, compared with non ad-clickers that surf a few pages before leaving?

Click-Through-Rate (CTR)
Your CTR may range from 0.5% to 10%, but if it exceeds a certain point (probably around 10%), you are flagged.

Geo-Location
Used Urchin (Google Analytics) before? Then you should know that Google can trace traffics origin down to the small town. Different IP doesn’t mean much. Unless you site is really targetted to one small geo-point, a high number of clicks from nearby location will get you banned quickly.

Hardware address?
MAC address of the LAN card, modem, and router works almost like a fingerprint. I’m not sure if Google can track this, but probably they do. They have rocket scientist, remember?

Advertisers conversion rate
Ad click is one thing. But does it bring value to the advertisers? If none of the clicks on your site translate to conversion to the advertiser, you are in trouble. First the Smart-Pricing hits, then your AdSense account disabled.

Search Engine Ranking
Your website is not indexed on any search engine, not linked by any prominent website, but get consistently high traffic? That sounds like something is in play. Regardless of whether it is an adware-embedded software, spam, trojan clickbot, or intentionally installed click-exchange network, it doesn’t sound right.

Webpage design
How about the “click here” or “support us”? Google has the best search engine in the world. Is it really that hard to find those words?

Combo
Each of these detection methods might seem rather weak. But combine them together, and not many click-fraud can pass-through these filters. Even the smartest clickbot will have a hard time. In short, it is almost impossible to cheat AdSense in the long term. Instead of spending time, money, and effort trying to outsmart Google, try these tips to improve your AdSense earning.

Disclaimer
: I’m not working for Google nor in anyway know anyone inside Google. Google might or might not use these methods to detect click-fraud. I’d believe that they have much better detection mechanism.

0

Search Form Widget For Blogger

24 January, 2008

I will now tell you how to install a Search Bar into your blog which will search you blog contents very easily.


Following are the simple steps

1) Go to your Page Layout Tab from your Dashboard
2) Just Click on Add Page Element and paste the Following code to it


<form id="searchThis" action="/search" style="display:inline;" method="get"><input id="searchBox" name="q" type="text"> <input id="searchButton" value="Go" type="submit"></form>

3) Give the title as Search or anything what you like and save the Element

If you have problem installing this widget you can just click on following button to install this widget automatically



Enjoy.................

.

0

13 more built in online bookmarks for blogger

22 January, 2008

Here is 13 more built in bookmarkers you can use on your blogger / blogspot blog. There are Furl.net, ma.gnolia.com, blinkbits.com, meneame.net, simpy.com, myweb2.search.yahoo.com, digg.com, del.icio.us, ocio.fresqui.com, reddit.com, blinklist.com, netvouz.com, and of course technorati.com

here is the demo:

Furl Ma.gnolia Blinkbits Meneame Simpy Yahoo DiggIt! Del.icio.us Fresqui Reddit Blinklist Netvouz Technorati


I have created 2 different version of this trick for you. that is the one for bookmarkers inside your post, and the another one is bookmarkers for outside of your post.on the download zip below, you will find 2 separated files, there are

  1. blogger-bookmark-inside-post.txt
  2. blogger-bookmark-outside-post.txt

What is the different?

1. blogger-bookmark-inside-post.txt is only applicable inside of a post widgets. while the blogger-bookmark-outside-post.txt is applicable anywhere.

so the outside-post is better then the inside post? well it depends. the outside codes will grabs the current link, and the current title of the browser. What does that means? It means, on default configuration, the title would be something like this: Your Blog Title Here : Then Your Post Title Here.

While on the inside code, it will just Your Post Title Here.

Are you confuse now? Good. then just download this codes below, and try it your self, so you’ll understand. Don’t forget to backup your template first. thanks!

DOWNLOAD HERE

Original post by -