toturial: icon pada entri

Ini MaNA bLoGeGar AizAt == sElaMat MemBacA

teringin nak letak icon smile?? sedey?? atau apa saja?? ikuti langkah dibawah ini :)

mungkin icon dibawah tak banyak.. tapi sekurang2nya dapat la kitew sume tampilkan memek muka kita... :D :$

3 langkah mudah pasang icon smile di blogger :

1. Masuk ke template > edit HTML > Expand Widget Templates dan cari kode dibawah ini:

]]></b:skin>

2. Jika sudah jumpa copy code javascript di bawah, dan letakan dibawah kode ini ]]></b:skin>

<script src='http://louislim2.googlepages.com/addSmiley.js ' type='text/javascript'/>
3. Simpan dan lihat hasilnya.

Icon smile ini akan tampil secara otomatik pada blog kita setiap kali kita taip standar kode dari icon tersebut.

Standar kode smile yang bisa digunakan :

:) or :-) 
:D or :-D 
:$ or :-$ 
:( or :-( 
:p or :-p 
;) or ;-) 
:k or :-k 
:@ or :-@ 
:# or :-# 
:x or :-x 
:o or :-o 

tutorial - untuk buat menu tab...

Ini MaNA bLoGeGar AizAt == sElaMat MemBacA

Mempunyai tab menu ataupun navbar menu dalam sesebuah blog boleh digunakan oleh pemilik blog untuk meletakkan link yang penting atau link yang ingin diberi perhatian oleh pengunjung blog. Anda boleh lihat contoh tab menu yang ringkas di sini



Tutorial untuk membuat tab menu / navbar menu adalah seperti berikut.



1. Dari dashboard > design > edit html


2. Menggunakan fungsi find (ctrl + F), cari kod ]]></b:skin>
2.1 Jika tidak jumpa, cari kod </head>

3. Copy dan paste kod di bawah SEBELUM kod yang anda jumpa di langkah 2 @ 2.1

ul#list-nav {
list-style:none;
margin:20px;
padding:0;
width:525px
}

ul#list-nav li {
display:inline
}

ul#list-nav li a {
text-decoration:none;
padding:5px 0;
width:100px;
background:#FF0099;
color:#eee;
float:left;
text-align:center;
border-left:1px solid #fff;
-moz-border-radius: 5px;
}

ul#list-nav li a:hover {
background:#FF6699;
color:#000
-moz-border-radius: 5px;
}

utk tukar warna..... sila ambil kod warna disini http://superaifaaaizat.blogspot.com/2011/09/tutorial-senarai-kod-warna-untuk-blog.html

Contoh.:





4. Save template anda.

5. Kemudian, kembali ke dashboard, pergi ke design > page element > add a gadget > HTML/javascript

6. Copy dan paste kod di bawah di dalam HTML/javascript kemudian tukarkan 'Link' dengan link yang anda mahu letak di tab menu.
Contoh : <li><a href='http://ohbest.blogspot.com'>Home</a></li>

Selepas selesai masukkan link yang dikehendaki,
save.

<div>
<ul id='list-nav'>
<li><a href='Link'>Home</a></li>
<li><a href='Link'>About Us</a></li>
<li><a href='Link'>Services</a></li>
<li><a href='Link'>Products</a></li>
<li><a href='Link'>Contact</a></li>
</ul>
</div>

7. Drag ke bawah element header, save dan lihat hasilnya.:)






Nota 1: Untuk langkah 3, anda boleh ubah beberapa kod seperti warna background, border, dan radius. Bergantung kepada bagaimana tab menu yang anda mahukan.

Nota 2: Jika anda hendak tambah tab menu, copy paste barisan di langkah 6.


Happy blogging.:) 

tutorial - senarai kod warna untuk blog...

Ini MaNA bLoGeGar AizAt == sElaMat MemBacA

ini saya kongsikan senarai kod warna.....


ia perlu utk kita mengubah sesuatu warna terutama bila 


nak edit htmL bagi mengubah sesuatu warna... kerana 


perlukan kod warna...  enjoy...


contoh tutorial yang memerlukan kod warna bagi mengubah warna... klik sini

tutorial - gerakkan title blog anda.

Ini MaNA bLoGeGar AizAt == sElaMat MemBacA

Title blog secara default adalah dalam keadaan statik. Anda boleh tukarkan title blog anda dengan mudah dan juga anda boleh membuatkan ianya bergerak dari kanan ke kiri.




Tutorial untuk buatkan title blog bergerak adalah seperti berikut.


1. Dari dashboard > Design > Add a gadget > Html/Javascript

2. Copy dan paste code berikut dalam ruangan HTML/Javascript

<script language=javascript>
msg = "Title Blog Anda";


msg = "..." + msg;pos = 0;
function scrollMSG() {
document.title = msg.substring(pos, msg.length) + msg.substring(0, pos);
pos++;
if (pos > msg.length) pos = 0
window.setTimeout("scrollMSG()",200);
}
scrollMSG();
</script>

Note: Tukarkan 'Title Blog Anda' dengan apa sahaja yang anda mahu.

3. Save dan lihat hasilnya.:)


Update:
Mahu lebih banyak gerakan untuk title blog ini.? rujuk entrihttp://superaifaaaizat.blogspot.com/2011/09/tutorial-tiltle-bar-maker.html

tutorial - tiltle bar maker

Ini MaNA bLoGeGar AizAt == sElaMat MemBacA

Sebelum ini sudah ada tutorial untuk buat title blog bergerak dari kanan ke kiri, untuk kali ini, dibawakan terus title bar generator.

contoh title bar (title blog)



Pilihan yang ada untuk title bar maker ini.


Anda boleh memilih pelbagai jenis gerakan yang anda mahukan dan setting yang begitu mudah.

Title bar generator adalah seperti di bawah.



1. Masukkan maklumat yang anda mahu.

2. Klik preview untuk tengok contoh paparan. Dan jika berpuas hati, klik pada 'OK, generate code!'

3. Code yang anda perolehi, copy dan paste pada HTML/javascript blog anda.
(dashboard > design > add a gadget > HTML/javascript ) [link tutorial]

4. Siap. Senang dan mudah kan.:)

toturial-bagaimana nak disablekan right clik...

Ini MaNA bLoGeGar AizAt == sElaMat MemBacA

Adakah anda tidak suka orang lain mengambil apa sahaja kandungan dalam blog anda.?
Dan pada masa yang sama anda tidak suka dengan kod² yang berserabut yang perlu di edit dalam 'edit html'. Kini ada cara mudah untuk realisasikan hasrat anda.:)

Kenapa Perlu Disable Right Click.?
Kebiasaannya,seseorang pemilik blog akan menggunakan fungsi ini untuk megelakkan orang lain mengambil apa yang ada dalam blog mereka. Samada tidak senang ayat mereka ditiru bulat² (copy paste), ataupun untuk mengelakkan bandwidth habis digunakan. Kebiasaan alasan yang aku selalu baca adalah kerana ada orang yang copy entri mereka bulat².

Berikut adalah contoh msg yang akan keluar apabila anda aktifkan disable right click






Berikut adalah cara yang mudah untuk menggunakan fungsi ini.


1. Copy kod ini.

<script language=JavaScript>
<!--


//edit by unwanted




var message="Masukkan Mesej Anda Disini";


///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}


function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}


if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}


document.oncontextmenu=new Function("alert(message);return false")


// -->
</script>

2. Paste pada "HTML/javascript" dalam blog anda.
Dashboard >Layout>Add a Page element >html/javascript. Kalau masih kurang jelas, klik sini.

Apabila sudah siap, save dan lihat kesannya pada blog anda.:)
klik sini utk toturial save anergy...

TOTURIAL - bagaiman a nak letakkan kod HTML!!

Ini MaNA bLoGeGar AizAt == sElaMat MemBacA

Apabila memasuki dunia blogging, antara perkara yang tidak dapat dielakkan adalah untuk menghias blog sendiri. Terdapat beberapa cara untuk menghias blog samada menukar template, memasang widget yang telah disediakan oleh blogger.com ataupun meletakkan sumber² lain dari luar yang biasanya melibatkan kod html/javascript.
Selain untuk menghias blog, kod html/javascript juga mempunyai fungsi² lain bergantung kepada tujuan apa kod itu dihasilkan.



Penambahan yang ingin dilakukan biasanya akan melalui perkara yang sama iaitu kod yang diperolehi perlu di 'paste'kan di ruangan html/javascrip.

Tutorial ini akan menunjukkan bagaimana hendak meletakkan kod html/javascript bagi sesebuah blog.


1) Login ke dalam blog anda seperti biasa. Kemudian dari 'dashboard', klik 'Design'
UPDATE: untuk template terbaru, klik pada DESIGN



2)Setelah anda klik 'design', dia akan auto masuk bahagian 'page element'. Kemudian pada 'page element' anda itu, klik pada 'add a gadget'


3)Selepas itu anda akan lihat banyak senarai yang ada, cari "HTML/javascript", kemudian klik pada "+"


4)Satu paparan kosong akan dibuka, kemudian paste code yang anda mahu letak dalam blog ke dalam ruangan kosong. kemudian tekan "save"

5)Siap. Anda boleh lihat hasilnya dengan klik preview. Anda juga boleh mengubah kedudukan code itu dengan hanya drag pada mana² kawasan page element itu.Apabila anda sudah puas hati, klik 'save' untuk kekalkan kedudukan.:).

TUTORIAL - energy save utk blog anda...

Ini MaNA bLoGeGar AizAt == sElaMat MemBacA

Blog anda boleh diletakkan dalam mode energy saver jika anda mahu. Kalau dunia realiti ada Earth Hour untuk menunjukkan sokongan kepada penjimatan tenaga, blog anda pun boleh.:)



Contoh blog apabila diletakkan energy saver seperti gambar di bawah.




Tutorial untuk letakkan energy saver ini seperti berikut.


1. Dari dashboard > design > edit html.
(backup template untuk langkah berjaga²)

2. Dengan menggunakan fungsi Find (ctrl + F), cari kod </head>

3. Copy kod di bawah dan paste SEBELUM kod </head>

<script language='javascript' src='https://sites.google.com/site/unwanted86/javascript/savetheenvironment.js' type='text/javascript'/>

Contoh:



4. Save dan lihat hasilnya.

Nota: Anda perlu biarkan selama 1 minit untuk energy saver memulakan operasi.:) 
selemat mencuba...