Showing posts with label Blogger Widgets hacks. Show all posts
Showing posts with label Blogger Widgets hacks. Show all posts

Saturday, May 16, 2009


Wordpress Auto smooth scroll for blogger

Scroll to top will be a good feature for your blog if you are having a big page! As if someone has scrolled down to bottom then he/she really has to scroll much to make his/her way to the top! So why dont we give them an Automated option for this. As you can see here in hacker's alley I have added a automated scroll to top button at the very end of the page.


Follow these steps. &. Lets get started :

  • Download this zipped file here (Only 45 kbsengihnampakgigi) this file contains two .js files, Which are important. It also contains somes images to make you interested.
  • Now unzip or Extract the file. Now you can upload a arrow which you like. You can upload a image in photobucket(Default image is in the above image)
  • (This step is Not compulsory if you like the default image) Open the scrolltopcontrol.js with notepad ( I use notepad++. you can download it from here. ) And search for this line

controlHTML:''http://i670.photobucket.com/albums/vv63/mzayed12/up.png"


Replace the red colored link with your image's link which you have uploaded. Then save the .JS file
  • Now in this step you will need a free webhosting serive provider. I will recommend www.hotlinkfiles.com. Go there and setup a free account.
  • Now upload the two files viz. scrolltopcontrol.js and jquery.min.js. Open these locations on your browser to confirm and note down the address.
  • Now final step:: Goto Blogger Dashboard ►Layout ►Edit HTML and search for </head> Just BEFORE it paste this code

    <script src='Your jquery.min.js file link' type='text/javascript'/>
    <script src=' Your scrolltopcontrol.js file link' type='text/javascript'>
    /***********************************************
    * Scroll To Top Control script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    ***********************************************/
    </script>
    Obviously you need to change the coloured portion according to your account!
  • Click on preview and see if the scroll button is coming or not! If not then revise the procedure and if it is coming then save your template anddddd you have a good smooth scroll to top button at your blogger
sengihnampakgigi
Thanx to Greetechspot

Sunday, May 3, 2009


Display Your special scripts and codes in stylish way : Blogger

Display Scripts and css codes Between Blogger Posts
Have you tried using scripts in blogger posts.If not you can check by posting it as they are not visible in posts.
But now you can post these scripts with css codes in to the blogger posts.

For these scripts to display :

Just Follow These steps to add this " Post Styling Hack " to your Blog .

Step 1 :

Login to your Blogger account and navigate to Layout section . Then go to Edit Html Tab.

Step 2 : Add This CSS code above this ]]></b:skin>



.codeview {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #f9f9f9;
border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
}
.codeview li {
font-size : 13px;
line-height : 24px;
font-family : "Courier New", "MS Sans Serif", sans-serif, serif;
color : #333333;
font-weight : normal;
margin : 0;
padding : 0;
}


Step 3 :

Whenever you create new posts just include the speical Script ( CSS code , Scripts , etc ) within this div section .

<div class="codeview">

Insert the Special code here

</div>

Thx Mohamad rias for this hack.

You can edit these red lines in code to change the layout of this code review box.



*Note:-Before Posting the script in posts just make it friendly
by putting it here and then publish it between the posts.

 

Advertise

Friends list

  • CA's easy-to-use security suite lacks sufficient protection to stop many of today's threats. Don't rely on it.A cursory look at CA Internet Security 2008 m...

Term of Use:

Disclaimer : The Contents Of this Site is Only for Knowledge Purpose, Do not use this in a wrong way.

Hacker's Alley Copyright © 2009 This template is Designed by Ipietoon. Sponsored by Hacker's Alley