Welcome to my tutorials and freebies!

FREEBIES updated on September 08, 2012.
Useful Links updated on September 2, 2012.

free counters
Stylized your scrollbar! ( Works on Google Chrome and Safari only)

<style type=”text/css”>

::-webkit-scrollbar {
 height: 10px;
 width: 10px;
 background-color: #FFFFFF; }
::-webkit-scrollbar-thumb {
 background-color: #000000; }
::-webkit-scrollbar-button {
 background-color: #000000;
 height: 4px;}

</style>

//All bolded variables can be changed. Change them if you want to.
You can pick colors here, and don’t forget to put # right before the HTML color. ;)


Stylized your cursor

<style type=”text/css”>

body {

cursor: url(http://64.19.142.12/media.tumblr.com/tumblr_m9k89wMzUt1qd4iud.gif), default; }

//Paste it before the <head> tag or after </head> tag



How to put a counter on your page.

1. Go to http://flagcounter.com/. Then make your own counter there.

I only changed the Columns of Flags to 3 and hid the VISITORS text. The rest are still in original. Below the customize is the appearance/preview of the counter I just customized.

2. After customizing your own counter, click the orange button that says “Get your flag counter” (On the right-side). Then copy the code and paste it on your description. Note: Don’t get bothered if you see the box that will pop out after clicking the orange button. You can skip it anyway. ;)


Drop Down Navigator

<select style=”background-color:#FFFFFF;  width: 200px; border: 1px solid #FFFFFF; color: #FFFFFF; font-family: Tahoma; font-size:10px;” name=”ArchiveMenu” onChange=”location.href=this.options[this.selectedIndex].value;”>

 
<option>TITLE</option>

<option value=”URL“>LINK_NAME</option>

<option value=”URL“> LINK_NAME </option>

<option value=”URL“> LINK_NAME </option>

<option value=”URL“> LINK_NAME </option>

</select>


Rainbow Hover Effect →


Copy then Paste the JS code after the <head> tag of your Theme HTML.


Snowy Effect using the * symbol →


Find the Color_1, Color_2, Color_3 first then replace them with colors you like! Copy the JS code then paste it after the <head> tag of your Theme HTML.

Note: You can also replace the asterisk* with heart♥. Just look for var snowletter=”*” and replace it with var snowletter=”♥” and you’re done!

Tip:For novice only, use Ctrl + F to find variables easier. Make your life easier. lol!


Tinkerbell Effect →


Uh, I know this is a very common effect here on Tumblr; but I can’t help to post. ;)

Anyway, first thing first.. Find COLOR_HERE then replace it with a color you like!

Copy, then paste the JS code right after the <head> tag of your HTML. Ciao!


No Right clicking (w/ message) →


Copy the code and paste it on your Notepad. Then Find (i.e Ctrl + F) for “Your message here” and replace it with your message. Then copy the code again and paste it after the <head> tag or before the </head> tag.

Note: I used black border and font, and white background. You can change them by altering them on CSS section.

Just Look for this..

<style type=”text/css”>

.disablerightclick{
    position:absolute; /*Do not change*/
    width: auto; /*Do not change*/
    background-color: #FFFFFF; /*White*/
    line-height:12px;
    color: Black; /*Color of the font*/
    font-size: 10pt; /*Size of the font*/
    font-family: Trebuchet ms; /*Font*/
    text-align: center;
    padding: 5px;
    z-index: 50; /*Do not change*/
    visibility: hidden; /*Do not change*/
    border: 3px solid #000000; /*#000000 is black*/}
</style>

For novice only, The bolded variables (the tag, the .disablerightclick, brackets, semi-colon) are very important. Do not erase them or else you will mess up the code.


How to get the direct link/permanent link of a post.


Just click the image on the top-right corner of a post and you will be redirected to its permanent link.