Tutorial - Letak Floating Banner Di Blog

Hai , Assalammualaikumm semua ! Okeyy ,, ini tutorial bagi yangg adee banner . Tapi kalau takk de banner korangg sediri punn , korangg boleyy jehh letakk banner orangg lain sebagai iklan di blog korangg .. Tuto yangg nieyy siap adee button CLOSE lagi Code dia agakk panjangg , korangg buat laa slow slow ye .. Tapi , senang jee .. sebab korangg takk payahh nakk edit HTML.. Okeyy , jumm .. teruskkan !


1.Dashboard >> Design >> Add A Gadget >> HTML/JavaScript     2.Copy code bawah ni dan paste dibahagian HTML/JavaScript  

<style type='text/css'> #topbar{ position:absolute; margin: 400px -23px; padding: 0px; width: 130px; visibility: hidden; z-index: 100; } </style>
<script type="text/javascript">
/*********************************************** * Floating Top Bar script- &#169; Dynamic Drive (www.dynamicdrive.com) * Sliding routine by Roy Whittle (http://www.javascript-fx.com/) * This notice must stay intact for legal use. * Visit http://www.dynamicdrive.com/ for full source code ***********************************************/
var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session var startX = 30 //set x offset of bar in pixels var startY = 5 //set y offset of bar in pixels var verticalpos="fromtop" //enter "fromtop" or "frombottom"
function iecompattest(){ return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body }
function get_cookie(Name) { var search = Name + "=" var returnvalue = ""; if (document.cookie.length > 0) { offset = document.cookie.indexOf(search) if (offset != -1) { offset += search.length end = document.cookie.indexOf(";", offset); if (end == -1) end = document.cookie.length; returnvalue=unescape(document.cookie.substring(offset, end)) } } return returnvalue; }
function closebar(){ if (persistclose) document.cookie="remainclosed=1" document.getElementById("topbar").style.visibility="hidden" }
function staticbar(){ barheight=document.getElementById("topbar").offsetHeight var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera; var d = document; function ml(id){ var el=d.getElementById(id); if (!persistclose || persistclose && get_cookie("remainclosed")=="") el.style.visibility="visible" if(d.layers)el.style=el; el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";}; el.x = startX; if (verticalpos=="fromtop") el.y = startY; else{ el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight; el.y -= startY; } return el; } window.stayTopLeft=function(){ if (verticalpos=="fromtop"){ var pY = ns ? pageYOffset : iecompattest().scrollTop; ftlObj.y += (pY + startY - ftlObj.y)/8; } else{ var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight; ftlObj.y += (pY - startY - ftlObj.y)/8; } ftlObj.sP(ftlObj.x, ftlObj.y); setTimeout("stayTopLeft()", 10); } ftlObj = ml("topbar"); stayTopLeft(); }
if (window.addEventListener) window.addEventListener("load", staticbar, false) else if (window.attachEvent) window.attachEvent("onload", staticbar) else if (document.getElementById) window.onload=staticbar </script>
<div id="topbar"> <a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieDWZ4X1ZFe5if2nf1gvuH-ivJPsNiogY66OqY3K8hIOVspfOsKwCypzQhK_l7vH7HSXMFU6UduSb47JagwOrjqxpq36TtntuGdlXpRdpCJDIZ9rLrN94VOHICge0OxgNfuTZKYXXAwMyE/s320/close.png" border="0" /></a> <a href="LINK KORANGG"><img src="URL GAMBAR" /></a> </div>

3.Dahh paste , korangg tukar apa yang patut kat atas tu yee ..

Tulisan yangg warna Merah tu , korangg masukkan Url gambar
Yangg warna Ungu pulakk , korangg letakk Link korang

    4. Dahh habis edit semua , Save kann terus okeyy ^^     **Dahh siap ! Sekejap jehh buat tu .. Harap-harap korangg takk de masalah laa dengan tuto nieyy . Good Luck sayangg ! ^^

About Me

A Big Girl Don't Cry

♚ I'm Fathihah . For short , Fafaw :D
♚ 21st Years Old already :)
♚ Still study (Final Semester)
♚ Live in Malaysia

  

# Nothing much bout me.. I'm very simple and small with a big heart and talkative. I love surveying new thing and try something new. Get it ? Okeyy, I don't wanna talk much. By the way, This is my first time of doing blog. So I hope you guys can be an extra-patient while I'm finishing editing this blog okeyy. I'll promise to make this blog attracted and so wow for you. Just stay tuned my friend :)

  

# You also can add me at my Facebook at http://facebook.com/aha1994 . I only approve people whom they really want to be my friend & I will approve when I like or when I want, this is because, I love collecting my friend requests ^^

  

# Other that, I also have Twitter, and yes ! you can follow me at https://twitter.com/FafawPinkky2 . I'm a #TeamFollowBack. Its easy, You do ℱℴℓℓℴω me and I will ℱℴℓℓℴω you okey. I hate when people give me a shit like --> 'unfollow' me back after they had ℱℴℓℓℴω me ,, It's really suck! I really FUCK guys like that ╭∩╮（︶︿︶） ╭∩╮ 

# Same goes to my.. INSTAGRAM !! Do follow my insta at http://instagram.com/fafaw_pinkkyberry. But !  There are two account of mine one is at @_pinkkyfafaw_ or fafaw_pinkky2. I have two account because I've lost my first password account !! :'( It's okeyy.. you can follow both of them :D

# That's all about me guys. If it's I am too rude or too straight, I am politely would apologize on it. Okay? So really hope that you are enjoy viewing my blog. Btw, thanks for reading ! XOXO ^^

P/S : [ ✖ ] Single [✔ ] Taken By Allah

Sincerely ,
シ Fafaw Pinkkyberry's II シ

Tutorial - Buat Verticle Menu Tab

1.Dashboard >> Design >> Add a Gadget >> HTML/JavaScript

 

2.Copy and paste code bawah ni dekat HTML/JavaScript

 

<style type="text/css">

/*Credits: Dynamic Drive CSS Library */

/*URL: http://www.dynamicdrive.com/style/ */

.sidebarmenu ul{

width:250;

text align:center;

list-style-type: none;

font: normal 13px Century gothic;

}

.sidebarmenu ul li{

position: relative;

}

/* Top level menu links style */

.sidebarmenu ul li a{

display: block;

overflow: auto; /*force hasLayout in IE7 */

color: white;

text-align:center;

text-decoration: none;

padding: 0px;

}

.sidebarmenu ul li a:link, .sidebarmenu ul li a:visited, .sidebarmenu ul li a:active{

background-color: #C6C6C6; /*background of tabs (default state)*/}

.sidebarmenu ul li a:visited{

color: white;}

.sidebarmenu ul li a:hover{

background-color: #000000;}

/* Holly Hack for IE \*/

* html .sidebarmenu ul li { float: left; height: 1%; }

* html .sidebarmenu ul li a { height: 1%; }

/* End */

</style>

<script type="text/javascript">

//Nested Side Bar Menu (Mar 20th, 09)

//By Dynamic Drive: http://www.dynamicdrive.com/style/

var menuids=["sidebarmenu1"] //Enter id(s) of each Side Bar Menu's main UL, separated by commas

function initsidebarmenu(){

for (var i=0; i<menuids.length; i++){

  var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")

    for (var t=0; t<ultags.length; t++){

    ultags[t].parentNode.getElementsByTagName("a")[0].className+=" subfolderstyle"

  if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu

   ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item

  else //else if this is a sub level submenu (ul)

    ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it

    ultags[t].parentNode.onmouseover=function(){

    this.getElementsByTagName("ul")[0].style.display="block"

    }

    ultags[t].parentNode.onmouseout=function(){

    this.getElementsByTagName("ul")[0].style.display="none"

    }

    }

  for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars

  ultags[t].style.visibility="visible"

  ultags[t].style.display="none"

  }

  }

}

if (window.addEventListener)

window.addEventListener("load", initsidebarmenu, false)

else if (window.attachEvent)

window.attachEvent("onload", initsidebarmenu)

</script>

<div class="sidebarmenu">

<ul id="sidebarmenu1">

<li><a href="LINK">HOME</a></li>

<li><a href="LINK">ABOUT ME</a></li>

<li><a href="LINK">TUTOTIAL</a></li>

<li><a href="LINK">TAGBOARD</a></li>

</ul>

</div></center></center>

 

 

Haa , happy , happy gakk bilee korangg dahh copy paste , but .... jangan lupee nakk tukar. Kalau takk , memangg takk menjadi laa Menu tab korangg tu . Hehe .. okeyyy3 .. Bacee nieyy ye..

Tulisan Merah , korangg tukarr laa width ikut sidebar korangg nakk

Tulisan Biru untuk warna Tab sebelum disentuh

Tulisan Ungu pulakk warna Tab selepas disentuh

Tulisan Hijau korangg letak laa link yangg korangg nakk link kann tu ..

Tulisan Kuning tukaa ayat korangg sendiri

 

4.Terus SAVE!

Peringatan! - Korangg JANGAN Tekan "Rich Text" sebab nanti tak menjadi pulakk ^^

Tutorial - Letak Tab Widget 3 Dalam 1

Hai korangg , Assalammualaikumm tuto nieyy pasal letakk tab 2 atau 3 tab dalam 1 box yangg sama .. Faham takk ? Takk faham , tgokk pic kat atas tu .. MUdahh jehh nieyy , takk yahh susaa-susaa edit HTML korangg ^^

Langkah 1

Dashboard > Design > Add A Gadget > HTML/JavaScript

Langkah 2

Copy semua code bawah ni

 

<style type="text/css">

.tabber {

 padding: 0px !important;

 border: 0 solid #bbb !important;

}

.tabber h2 {

 float: left;

 margin: 0 1px 0 0;

 font-size: 12px;

 padding: 3px 5px;

 border: 1px solid #bbb;

 margin-bottom: -1px; /*--Pull tab down 1px--*/

 overflow: hidden;

 position: relative;

 background: #e0e0e0;

 cursor:pointer;

}

html .tabber h2.active {

 background: #fff;

 border-bottom: 1px solid #fff; /*--"Connect" active tab to its content--*/

}

.tabber .widget-content {

 border: 1px solid #bbb;

 padding: 10px;

 background: #fff;

 clear:both;

 margin:0;

}

.codewidget, #codeholder {

 display:none;

}

</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>

<script type="text/javascript" src="http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bloggertabs0.1_min.js"></script>

<script type="text/javascript">

$(document).ready(function() {

 $('#codeholder').bloggerTabber ({

  tabCount : 3

 });

});

</script>

<!-- to make sure the widget works, do not alter the code below -->

<div id='codeholder'><p>Get this <a href="http://www.bloggersentral.com/2011/05/create-tabbed-content-blogger-widgets.html" target="_blank">tabber widget</a></p></div>

 

Langkah 3

Pastekan code tadi dan letakkan dibahagian HTML/JavaScript tadi dan Save

Langkah 4 Drag/bawa tabber widget code tadi diatas widget yang korang nak gabungkan contoh -   (tab1 , tab2, tab3 adalah widget yang ingin digabungkan)
Langkah 5 Korangg tekan Save dan lihat hasilnya :)
Nota Kecil ! Tulisan Merah - jumlah widget yang korangg nakk digabungkan Tulisan Pink - code colour yangg korangg nakk .. >>KLIK SINI jehh kalau korangg malas nakk cari ..   **credit dari blogger sentral**

Tutorial - Link Membesar Apabila Cursor Menyentuh

1.Dashboard >> Design >> Edit HTML >> Tick Expand Widget

2.Tekan Ctrl+F [serentak!] , cari code ini :

a:hover {

3.Dah jumpe ? copy code ini dan paste di BAWAH code yg korangg cari tadi.

font-size: 22px;

4.Tukarkan saiz Link yangg nakk dibesarkan apabila cursor sentuh link korangg.. Then , barulah korangg klik Preview and SAVE! ^^

Tutorial - Cursor Bertukar Apabila BlockQuote Menyentuh

1.Design >> Edit HTML >> Tick Expand Widget >> Ctrl + F (serentak)

2.Search Code ini :

 blockquote {     dan    blockquote:hover {

3.Copy code bawah ni and paste dibawah kedua-dua code yang dicari.

cursor: move ;

4.Preview and Save.

**TAKE NOTE ~!!**

# Yangg Move nieyy , korangg boleh tukarkan dengan :-

crosshair

wait

w-resize

text

n-resize

Tutorial - Letak Top Commentor Di Blog

Heyy korangg! haa .. mesti korangg nakk menarikk perhatian para pengunjung kann ? Apee kate , korangg letakk TOP COMMENTOR ! Bangga sikit kawan korangg kann .. Cehh , malas nakk berceloteh , jumm buat tuto nieyy .. Takk perlu edit HTML korangg punn ..

1) Dashboard >> Design >> Add a Gadget >> HTML/JavaScript

 

2) Copy code kat bawahh nieyy dan paste dibahagian HTML/JavaScript

 

<center><script type="text/javascript">
function getYpipe(feed) {
document.write;
var i;
for (i = 0; i < feed.count ; i++)
{
var href = "'" + feed.value.items[i].link + "'";
if(feed.value.items[i].link == "")
var item ="<li>" + feed.value.items[i].title + "</li>";
else
var item = "<li>" + "<a href="+ href + '" target="_blank">' + feed.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ul>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?
YourBlogUrl=http://fafawpinkky2.blogspot.com/&ExcludedNick1=Fafaw Pinkkyberry 2&ExcludedNick2=anonymous
&ShowHowMany=10&_callback=getYpipe
&_id=23022d7836bf2dd3c10a329feb9be26a
&_render=json"
type="text/javascript"></script></center>

# TAKE NOTE THIS ! #

Tulisan warna OREN , korangg letakk URL blog korangg yee ..

Tulisan warna UNGU pulakk , korangg letakk berapa banyakk TOP COMMENTOR yangg korangg nakk letakk [ 5 / 10 / 15 ATAU 20 ]

   Tulisan warna MERAH , letakk Profile Name korangg yee  sayangg..

 

**Dapat takk ? If dapat , bagus laa .. Senangg keje korangg . Blog korangg mesti meriahh punyee ! ^^

Tutorial - Buat ScrollBar Version 2

Whazapp whazapp kengkawan ! Haa ,, tuto yangg nieyyy pulakk pasal scroll bar version lain . Hehe .. Macam-macam laa .. Yangg nieyy lagii cute .. Apee kate jum try nakk ? Follow step nieyy .. :D

1) Dashboard >> Design >> Edit HTML >> Tick Expand Widget

2) Ctrl + F  [ serentak! ] , cari code ini :

]]></b:skin>

3) copy code ini dan paste diatas atau sebelum code yang korangg cari

::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track-piece  {
background-color: #A9F5D0;
border: 3px solid #FFFFFF;
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background-color: #01DFA5;
border: 1px solid #FFFFFF;
}

4) Korangg tekan Preview dan save !

# Yangg tulisan warna Merah tu , korangg tukar laa color yangg korangg nakk .. Kalau malas nakk cari , korangg >> KLIK SINI jee .. Aku dahh sediakan untukk mempermudahkan korangg punyee keje ^^

Tutorial - ScrollBar New Version

 

Heyy semua ! Kali nieyy tutorial pasal scroll bar . But ! Yangg nieyy style yangg lain .. Yelaa , korangg mesti nakk yangg lawa-lawa kann .. Haa , nieyy punn tutorial nyee .. Try laa korangg .. Good Luck !

1) Dashboard >> Design >> Edit HTML >> Tick Expand Widget

2) Ctrl + F [serentak!] , cari code :

]]></b:skin>

3) Copy code ini dan paste di atas atau sebelum code yang korangg cari

::-webkit-scrollbar {
width:15px;
height:10px;
}
::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment  {
height:10px;
width:10px;
display:block;
background:#F6CED8;
border:1px solid #F7819F;
}
::-webkit-scrollbar-track-piece  {
background-color:#FFFFFF;
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background-color:#F6CED8;
border:1px solid #F7819F;
}

4) Preview dulu , takk de ERROR >> save.

# Yangg tulisan warna Merah tu , korangg tukar laa color yangg korangg nakk .. Kalau malas nakk cari , korngg >> KLIK SINI jee .. ^^

Tutorial - Letak Border Di Setiap Post Title

Heyy semua !

Ehh , korangg sihat takk ? Kalau sihat , adee mase , rajin2 laa buat tuto nieyy ..

Letakk border kat setiap post entry ..

Jumm , try tuto nieyy okengg ..

1.Dashboard >> Design >> Edit HTML >> Tick Expand Widget Templates

2.Tekan Ctrl+F [serentak!] , cari code ini :

.post h3 {

ATAU

.post-title {

ATAU

h3.post-title {

3.Dah ? copy code bawah ini and paste di BAWAH code yg korang cari td :

border-top: 3px solid grey;

border-bottom: 3px solid #FAAFBE;

text-align:center;

background-image:url(http://www.drikoti.net/Goodies/Favicons/Ico/fv-new11.ico

);

background-repeat:no-repeat;

}

 4.Preview dulu tau .. Dahh takk de ERROR, terus SAVE!

**Acanoo ? Menjadii ke dokk ? Kalau sudaa menjadi , baguslaa .. Agakk2 korangg buat warna apee laa kann ? Hehe ^^

Tutorial - Letak Profile Widget Untuk Twitter

1.Pergi ke Twitter/Resource.

 

2.Pilih/Tekan "Widgets".

 

 

3.Pilih/Tekan "My Website".

 

 

 

4.Pilih/Tekan "Profile Widget".

 

5.Sekarang,korang Customize Profile Widget korang.

-Pastikan UserName anda betul dibahagian "Settings"

-Pilih apa yang perlu dibahagian "Preferences"

-Tukar warna yang korang suka dibahagian "Appearance"

-Tukar Height dan Width yang sesuai dibahagian "Dimension"

6.Setelah selesai semua nye , tekan "Finish @ Grab Code"

 

7.COPY code yang dia bagi.

 

8.Dashboard >> Design >> Add a Gadget > HTML/JavaScript >> Paste Code >> SAVE!

**Padee yangg still takk de Twitter , korangg daftar lahh dulu yee ... Jangan segan-segan . Ehh , dahh alang-alang tu , FOLLOW laa saya sekali >> KLIK SINI !

Tutorial - Letak Flying Twitter Bird

Assalammualaikumm semua ..
Tetibee plakk nakk buat tutorial Twitter ..
hehe .. Tengokk kat bawah nieyy ..

Nampakkan burungg warnaa purple yangg comel tu ? Itu laa Flyingg Bird yangg aku maksudkan tu .. Minat takk ? Hehe .. Jumm follow tuto nieyy ..

1.Dashboard >> Design >> Add a Gadget >> Edit HTML/JavaScript

2.Copy code bawah ni ,  AND PASTE DI BAHAGIAN HTML/JavaScript 

 BLUE TWITTER BIRD 

<script type="text/javascript" src="https://sites.google.com/site/exeloph/file/Twitterbang.js"></script> <script type="text/javascript"> var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwH7rxbirf0KVPmHChNF_OGgZc3XC1XM5sEoEdfRsKEYuc5QptXgFtrU-MopL0dSnkk8ZZqUg_8relzNmI0ToMDBCpZ1T8tkQqrc5LaeFi-27lXO32IxZJt2OAxX1Hmlwaz0n8ghqBt2A/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "LINK TWITTER KORANGG";var tweetThisText = "LINK URL BLOG KORANGG";tripleflapInit();</script>

 PURPLE TWITTER BIRD 

<script type="text/javascript" src="https://sites.google.com/site/exeloph/file/Twitterbang.js"></script> <script type="text/javascript"> var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvNONcxaCs5e3t2Z3aysnRKoMBq_8odjHsWYhTuKJNxS14B8QglNHNBaY7-ZXB6Vi6okAIPdmGUa5cFdtbWnXE9lENjjtHE3bW1jZt19NlmIAb88Z_-0OMjbcDm6w-GgnfO_MQJYeA_DY/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "LINK TWITTER KORANGG";var tweetThisText = "LINK URL BLOG KORANGG";tripleflapInit();</script> 

 RED TWITTER BIRD 

<script type="text/javascript" src="https://sites.google.com/site/exeloph/file/Twitterbang.js"></script> <script type="text/javascript"> var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZP1rwmhLigizLoGpdbKLf_A2PxuhVFjLxPcREDJnokMyGSdIMRhvTYv7dSEDB20Kc0QosbTGfWuIqRm8eH2B5w6krrCzCRSkVAZ1Vz7M8dbot9aH0PRAMToiyAAdxyreOWEoctAvNc3o/"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "LINK TWITTER KORANGG";var tweetThisText = "LINK URL BLOG KORANGG";tripleflapInit();</script>

**korangg boleh pilih lahh pilih yangg manee korang nak burung tu warna ape.. Sorry laa kawan , kat atas ni ada TIGA warna jehh..**

! NOTE THIS KAWAN !

# warna KUNING tu , korang tukar dengan link twitter korangg

# warna HIJAU tu , korang tukar dengan link URL blog korangg

**Dahh copypaste , SAVE kann terus .. jengg , jengg, jengg ! Dah siap ! ^^

Tutorial - Disable Right-Click Without Alert

1. Dashboard >> Design >> Add a Gadget >> HTML/JavaScript

2.copy code bawah ni

<script language=JavaScript>
<!--

//Disable right click script III- By Renigade (renigade@mediaone.net)
//For full source code, visit http://www.dauspozi.com

var message="";
///////////////////////////////////
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}

document.oncontextmenu=new Function("return false")
// -->
</script>

3.Then , korangg klik >> SAVE !

**Menjadi kann ? Alaaa , perkara simple jehh nieyy ,, small the matter lahh orangg katee .. Amboii ~ Berspeakangg pulokk aku nieyy ..