Friday 27 April 2012

Adding a scrolling text to your blog

Follow these simple steps to add a scrolling text same as that present in the blog.....
1.Go to blogger signin--->
2.After logged in goto Design---Page Elements----->
3.Click on Add A Gadget---HTML/JavaScript---->
4.Copy and paste the following code in the content field without giving any title.
5.Save the Gadjget and view your blog.

CODE:



<script language="javascript">


// ENTER TEXT BELOW. CAN *NOT* INCLUDE NORMAL HTML CODE.
var text='FOLLOW ME......';

var delay=40; // SPEED OF TRAIL
var Xoff=0; // PIXEL COUNT FROM THE LEFT OF THE CURSOR (- VALUES GO TO LEFT)
var Yoff=-30; // PIXEL COUNT FROM THE TOP OF THE CURSOR (- VALUES GO UP)
var txtw=14; // AMOUNT OF PIXEL SPACE EACH CHARACTER OCCUPIES
var beghtml='<font color="#00436e"><b>'; // OPTIONAL HTML CODE THAT EFFECTS WHOLE TEXT STRING SUCH AS FONT COLOR, SIZE, ETC.
var endhtml='</b></font>'; // END HTML CODE. MOSTLY USED IF ABOVE SETTING IS USED.

//********** NO NEED TO EDIT BELOW HERE **********\\

ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var txtA=new Array();
text=text.split('');
var x1=0;
var y1=-1000;
var t='';

for(i=1;i<=text.length;i++){
t+=(ns4)? '<layer name="txt'+i+'" top="-100" left="0" width="'+txtw+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-100px; left:0px; height:1px; width:'+txtw+'; visibility:visible;">';
t+=beghtml+text[i-1]+endhtml;
t+=(ns4)? '</layer>' : '</div>';
}
document.write(t);

function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}}

function animate(evt){
x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);
y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);
}

function getidleft(id){
if(ns4)return id.left;
else return parseInt(id.style.left);
}

function getidtop(id){
if(ns4)return id.top;
else return parseInt(id.style.top);
}

function getwindowwidth(){
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft;
else return window.innerWidth+pageXOffset;
}

function movetxts(){
for(i=text.length;i>1;i=i-1){
if(getidleft(txtA[i-1])+txtw*2>=getwindowwidth()){
moveid(txtA[i-1],0,-1000);
moveid(txtA[i],0,-1000);
}else moveid(txtA[i], getidleft(txtA[i-1])+txtw, getidtop(txtA[i-1]));
}
moveid(txtA[1],x1,y1);
}

window.onload=function(){
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?document.all['txt'+i]:document.getElementById('txt'+i);
if(ns4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=animate;
setInterval('movetxts()',delay);
}
</script>


*REPLACE FOLLOW ME WITH ANY TEXT YOU WANT LIKE A WELCOME MESSAGE OR ANYTHING YOU LIKE*


-->

Wednesday 4 April 2012

Adding a Simple Search Box to Your Blog



1.Go to Design,then click on add a gadget.
2.Use the Below Code and Add the Widget as HTML/JavaScript


CODE:
<div class="searchform">
<form method="get" id="searchform" action="/search">
<table width="100%">
<tr>
<td><input type="text" style="width:98%;padding:2px;" value="Search this blog..." onfocus="if (this.value == &quot;Search this blog...&quot;) {this.value = &quot;&quot;}" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Search this blog...&quot;;}" name="q" id="sbox" class="sbox"></td>
<td width="75px"><input type="button" Value="Search" id="sbutton" class="sbutton" alt=""></td>
</tr>
</table>
</form>
</div>

Print Page

Monday 2 April 2012

Add Animated Flying Twitter Bird Widget to Blogger Blogs



 just follow these steps…
  1. Change Your Twitter Account User Name. (the underlined link in the code)
  2. Copy The Bellow Widget Code.
  3. Go to Blogger Dashboard > Design > Edit HTML .
  4. Search For </body> tag and Place Widget Code Just Before it.
  5. Save your template.


<script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/files/way2blogging.org-tripleflap.js"> </script> <script type="text/javascript"> var twitterAccount = "https://twitter.com/#!/techpro4u"; var tweetThisText = " <data:blog.pageTitle/> : <data:blog.url/> "; tripleflapInit(); </script> <span style="font-size:11px;position:absolute;"></span>
Thats it.you are done.