Showing posts with label Tutorial. Show all posts
Showing posts with label Tutorial. Show all posts

Tutorial : Buku Tamu Tersembunyi Version 2

0 Celoteh Kalian
Langkah 1
1. Login ke Blogger, Klik Design :




2. Pada Elemen Halaman, klik Add Gadget di lokasi yang Anda ingin letak;

3. Pilih HTML/Javascript;




Langkah 2
Anda perlu copy kode dibawah ini kedalam Widget.

<style type="text/css">
.gb_fixed{
position:fixed;
top:0px;
right:0px;
z-index:+10;
}
* html .gb_fixed {position:relative;}
#hidden_gb2 {
display:none;
border:2px solid #004831;
background:#000000;
padding:10px;
padding-top:0px;
}
</style>
<div class="gb_fixed">
<table id="hidden_gb2" cellpadding="0" cellspacing="0">
<tr><td>
<div><a href="javascript:void(0)" onclick="gb_showHideGB()"><b style="color:red">[ Tutup ]</b></a></div>

<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe scrolling="auto" width="250" frameborder="0" src="http://www6.shoutmix.com/?ichal13051991" height="400" title="ichal13051991">
<a href="http://www6.shoutmix.com/?ichal13051991">View shoutbox</a>
</iframe>
<br/><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br/>
<!-- End ShoutMix -->

</td></tr></table>
</div>
<script src="http://sites.google.com/site/copycatgroup/Home/jsfile/hiddengb2.js"></script>
<div style="z-index:+5" class="gb_fixed">
<a href="javascript:void(0)" onclick="gb_showHideGB()">
<img border="0" style="border:0px" src="http://i915.photobucket.com/albums/ac357/adiluvdv/buku-tamu_03.gif"/>
</a>
</div>
</div>



Info :

Merah = Anda perlu gantikan dengan kode Scripts Widget Shoutmix anda.
Biru = Gantilah dengan URL Gambar Tab
Pink = Tinggi & lebarnya mengikut sesuai dengan Gambar Tab anda.

.gbtab{ = Mengaturkan tampilan gambar tab

Orange
gbcontent = untuk mengatur tampilan koten.
float:left; = untuk mengaturkan kedudukan widget anda.
border:2px solid #FAFD02; = warna pada border konten.Anda boleh ubah jika anda mahu seperti FAFFFF (Sebagusnya gunakan kode photoshop)
background:#FAFD03; = warna pada isi konten.Widget ini saya menggunakan warna kuning

Tutorial : Meletakkan Gambar Kreatif di Blog

0 Celoteh Kalian
Copy & Paste dari Kreatifbuzz

Setelah berfikir panjang, kreatifbuzz memilih perkongsian ilmu berkenaan cara untuk meletakkan gambar kreatif di cursor pada blog blogspot pada kali ini.

Cara ini lebih kepada menggantikan efek cursor yang terlalu berat sehingga pengunjung susah untuk membuat lawatan atau masuk ke blog anda.
Ikut langkah mari menari seperti di bawah :

Buat satu gambar / imej yang bersaiz sesuka hati anda.

Contoh :
Pada ruangan Design template anda, buka mana-mana kotak gadget jenis javascript/html.

Salinkan kod di bawah pada kotak gadget anda :

<script type="text/javascript">
var trailimage=["URL GAMBAR ANDA", SAIZ LEBAR GAMBAR, SAIZ TINGGI GAMBAR] //image path, plus width and height
var offsetfrommouse=[10,-20] //image x,y offsets from cursor position in pixels. Enter 0,0 for no offset
var displayduration=0

if (document.getElementById || document.all)
document.write('<div id="trailimageid" style="position:absolute;visibility:visible;left:0px;top:0px;width:1px;height:1px"><img src="'+trailimage[0]+'" border="0" width="'+trailimage[1]+'px" height="'+trailimage[2]+'px"/></div>')

function gettrailobj(){
if (document.getElementById)
return document.getElementById("trailimageid").style
else if (document.all)
return document.all.trailimagid.style
}

function truebody(){
return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function hidetrail(){
gettrailobj().visibility="hidden"
document.onmousemove=""

}

function followmouse(e){
var xcoord=offsetfrommouse[0]
var ycoord=offsetfrommouse[1]
if (typeof e != "undefined"){
xcoord+=e.pageX
ycoord+=e.pageY
}
else if (typeof window.event !="undefined"){
xcoord+=truebody().scrollLeft+event.clientX
ycoord+=truebody().scrollTop+event.clientY
}
var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-15
var docheight=document.all? Math.max(truebody().scrollHeight, truebody().clientHeight) : Math.max(document.body.offsetHeight, window.innerHeight)
if (xcoord+trailimage[1]+3>docwidth || ycoord+trailimage[2]> docheight)
gettrailobj().display="none"
else
gettrailobj().display=""
gettrailobj().left=xcoord+"px"
gettrailobj().top=ycoord+"px"
}

document.onmousemove=followmouse

if (displayduration>0)
setTimeout("hidetrail()", displayduration*1000)
</script>

Tukarkan pada kod, var trailimage=["URL GAMBAR ANDA", SAIZ LEBAR GAMBAR, SAIZ TINGGI GAMBAR].

Contoh : var trailimage=["http://kreatifbuzz.com/img.png", 90, 80]

Selamat berkreatif
;)

Tutorial : Macam Mana Nak Buat Share Facebook Button?

3 Celoteh Kalian




Salam. Aku nak buat tutorial macam mana nak buat butang SHARE Facebook di FB anda :D Haaaa ~ Suke tak? Suke tak? Suke tak? =.="
  • Pergi ke Dashboard > Design > Edit HTML
  • Tick Expand Widget Templates
  • Tekan ctrl + f dan cari code ini
<div class='post-header-line-1'/>
  • Copy code butang Share Facebook di bawah ini dan pastekan di BAWAH code tadi
<div style='float:right; margin-left:10px;'>
<script src="http://widgets.fbshare.me/files/fbshare.js"></script>
</div>

Tutorial : Transparentkan Gambar Anda

1 Celoteh Kalian
Yup.. Memang mudah untuk transparent gambar :)
Online pulak tu tanpa perlu INSTALL atau Download
Korang cuma pergi WEB NI >TEKAN<

Ok..
Ni pulak step nak transparentkan gambar :)
Senyum sikit...

1. korang bukak dulu laman web nyer tu..

2. korang upload gambar kat lappy atau komputer korang
Tak paham ??? tgk gambar kat bawah ni

Klik untuk besar

Tutorial : Masukkan font comel dalam lappy

1 Celoteh Kalian

Ha,yang aku bulatkan besar2 tu lah font yang comel-comel.Eh,kejap.Sebelum tu,aku nak bagi tahu korang yang ajar aku buat benda nie pon ialah Hajar and Syera.Thanks both of U.Nak terjah blog diorang nanti dulu.Lepas habis baca tuto nie baru boleh usha blog comel diorang tuh.

Tutorial : Button TOP

1 Celoteh Kalian
Tutorial : Button TOP 

Button top tu yang macam aku tunjuk dekat dalam gamba dekat atas nieyh.Button TOP nie fungsinya memudahkan korang ataupun orang yang tengok blog korang untuk kembali ke bahagian atas blog.Faham ? Kalau takde button nieyh,memang penat nak scroll dari bawah sampai atas.Nak nak pulak korang publishkan sekali 10 entry dalam main page..kan susah tu.Macam mana nak buat ? Follow steps below

  • Dashboard ---> Design ---> Page Element ---> Add Gadget HTML/Javascript
  • Copy dan paste code dekat bawah nieyh dalam ruangan HTML tadi




<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Top"><img src="URL Image"
    /></a>


Tutorial : LINK hover style 2011

0 Celoteh Kalian

1. Log In --> Design --> Edit Html
2. Tekan Ctrl+F search 
a:hover }
3. Copy and paste code ni di bawah a:hover }
color:#000000; background:url( URL GAMBAR);background-repeat:repeat;text-decoration:none}

4. pilih hover mana yang korang nak and copy URL dia ok .






























Icon Yang Comel

0 Celoteh Kalian
Hari ini saya bermurah hati nak senangkan korang yang nak cari glitter yang comel-comel dan cute.. Erm.. so, korang boleh ambil ajer URL kat bawah ni kalau ada yang berkenan... Nak wat amal jariah sikit.. Hehehe.. Byeeeee...

http://sl.glitter-graphics.net/pub/725/725451hqye09hovg.gif

http://sl.glitter-graphics.net/pub/475/475010nw15gbkh91.gif

Tutorial : Buat Dropdown Menu

0 Celoteh Kalian
Helo!
Sekarang ni , masa untuk buat tuto jer .
Kalau nak masuk contest pun , rasa cam jemu lah plak ! haha ^^
Oke , sekarang , saya nak share ngn korunk , macam mana nak buad dropdown menu.
Pada sesiapa yang tak tahu , apa itu DROPDOWN MENU.? Lihat gambar di bawah ;

Tutorial : Buat tulisan entri warna pelangi...

0 Celoteh Kalian
rainbow Pictures, Images and Photos

Salam Korang
<br>So ari nie nak ajar korang camne nak wat tulisan kat dalam entri korang Warna warni cam pelangi...<br>

Tutorial : Nak Buat kotak comel pada sidebar (fieldset)

2 Celoteh Kalian


... Assalamualaikum ...

Nampak tak gambar kat atas tu??ada tak sesape nak wat macam tu???Law ade
Jum tutorial..


Senang je..Copy kod je..Lepas tu ganti masuk ayat or image yang korang nak..
Ok jum mulakan..Copy paste kod dibawah di :

Dashboard>design/layout>add gadget>HTML..



Wan Hazel...Aucak aucak

Tutorial : Floating Object

0 Celoteh Kalian
Salam korang...
Kali nie saya nak wat Tutorial Floating Object lak..Nak letak Heartbeat pun leh gak....Erm..Tutorial objek terapung..ehehhe..cara nye senang je..

Jum tutorial...

Tutorial : Letak Like button/Recommend Button untuk Blog korang

0 Celoteh Kalian
Assalamualaikum...Hari nie saya nak wat tutorial mengenai Button dari Facebook..Nampak tak butang yang kat tepi tu?..
Apa faedah Wat Button tu??

Hmmm,.. Faedahnye boleh meningkatkan traffic korang...Kemungkinan akan ade orang klik kat link korang bila ade blogger yang mempunyai Facebook klik Button tu...

Eh..tak faham lah??

Tak faham..korang tengok gambar kat bawah nie plak...

Tutorial : Buat daftar/wat acc HeartBeat dan cara pasang HeartBeat

0 Celoteh Kalian
Ada sesiapa nak duit free tak?.. Jom teruskan bacaan anda.. jangan malas lak.. orang nak kasi duit free pun tak nak ker?.. So, teruskan baca ek.. God Luck ...

Jgn kedekut utk u click me i click u, sbb HB memang based on click2 yer--tak de isu fraud click!
let's say, kalau 100 org click ur HB banner everyday, dh dpt RM4, kalau sebln ---RM4 X 30 days =RM120 kan..tak ke byk tu...., as side income from blogging, other than Nuffnang :)
free money babe, takkan tak nak :p

Inilah tutorialnya :-

mula2 klik banner heartbeat kat blog ni yer...

Tutorial : Follow & Dashboard ala-2 tumblr

2 Celoteh Kalian
Ramai jugak yang tanya macam mana nak buat cem ni . macam mana , macam ni lah . haha , paham-2 jelah kan . senang je step dea .

1. Pegi Dashboard > Design > Add a widget
2. Copy dan paste kod bawah ni dekat add a widget tadi :
 <a style="display:scroll;position:fixed;top:45px;left:15px;" href="http://www.blogger.com/follow-blog.g?blogID=8702439162574725703" title="Follow"><img src="http://assets.tumblr.com/images/iframe_follow_alpha.png?468" /></a><a style="display:scroll;position:fixed;top:15px;left:15px;" href="http://www.blogger.com/home" title="Dashboard"><img src="http://assets.tumblr.com/images/iframe_dashboard_alpha.png?468" /></a>
3. Kod warna merah tuh korang pegi dekat Design dan tengok : (yang lain jangan sentuh k)
4. Itu lah blogID korang . save dan lihat hasilnya =)

Tutorial : Tulisan Membesar

0 Celoteh Kalian
Helow . Helow . Helow !

Hari ni , saya nak share ngan korang ciket , mcm mana nak bagi tulisan besar..
bila cursor tuh , sentuh LINK korang :)
Lyssa try2 je tadi , tgk2 menjadi jugak ! haha

Ikut Step dibawah :-

Log in > Design > Edit Html
Then , korang cari code di bawah : (Tekan Ctrl + F serentak utk memudahkan pencarian !)

a:hover

Tutorial : Link Warna Pelangi

0 Celoteh Kalian
Salam ukhuwah :)
Hai, korang tahu tak , macam mn nak buat link korang warna macam pelangi?
Tak tahu kan ? Tak tahu kan ?

Mari Sini Saya ajar =)

Ikut Step di bawah :

1. Dashboard > Design > Add Gadget > Html
2. Then , korunk copy and paste kod dekat bawah nih k ?

<script src="http://fwzynn.googlepages.com/rainbow.user.js" type="text/javascript">/*********************************************** * Script edited by Ynn at http://fwzynn.blogspot.com/* Please keep this notice intact***********************************************/ </script>

3. Then , save !
4. Check , jadi ke , tak ? :)

Tutorial: Round Hover

0 Celoteh Kalian
assalamualaikum ..
 sebelum tido nih,, saya nak buat satu tutorial yang direquest ..


sebenarnya, yang jadi bulat tu ialah hover ..
bila cursor sentuh kat mane2 gambar, gambar tu akan jadi bulat ..

ini cara2 nya k ..

Tutorial : Slide Float Widget

1 Celoteh Kalian
Zawa Hello Ramadhan

Okiee . Apa itu Slide Float Widget ??!

Korang tak tahu ? 
Alar ..macam mana nak cakap ehh  ,  bila tekan yang ini :

 

Tutorial : Kotak Kod Untuk Banner

0 Celoteh Kalian
Cara nyer , mudah saje. follow step sys ni ok :)



Log in > Dashboard > Design > Add Gadget > Html/JavaScript

Copy code kat bawah ni , and paste di ruangan html/javascript tadi tuh ok :

<center>
<img style="width: 167px; height: 157px;" src="URL BANNER KORANG" />
<center>*Copy And Paste it into your blog ok?:)</center>

<textarea cols="13" rows="3" style="text-align: center;"><a href="LINK URL BLOG KORANG/"><img src="URL BANNER KORANG" /></a></textarea></center>

Related Posts Plugin for WordPress, Blogger...