. Tutorial: January 2011 ---"Selamat Datang di Blog-Ku"---"Terima Kasih Telah Mengunjungi Blog-Ku"---"We Will Welcome 4 You"---
"YAA-RAHMAN" "YAA-ROHIIM" "YAA-MALIK" "YAA-QUDDUS" YAA-SALLAM" "YAA-MU'MIIN"

Friday, January 14, 2011

Cara Pasang Widget Label Cloud Blogumus di Blogger

,
Perlu anda ketahui bahwa cara memasang animasi flash label cloud untuk blogger itu sangat mudah. Anda cukup meng-copy dan paste kode berikut pada template blogger. Label cloud atau label awan ini dikenal dengan istilah blogumus ciptaan Roy Tanck yang awal pembuatannya dipakai untuk wordpress sebagai WP Comulus Pluggin. Memang masih dibutuhkan sedikit edit manual pada beberapa bagian yang disesuaikan dengan selera saja. Nantinya akan nampak animasi label cloud yang dapat berputar-putar seperti putaran globe. Jika ada yang tertarik untuk membuatnya, dapat mengikuti langkah berikut.
Cara membuat dan memasang animasi flash label cloud:

1. Masuk ke blog dengan id blogger anda.

2. klik Rancangan » Pilih Tata Letak dan klik Edit HTML » Jangan lupa untuk centang expand template widget. Cari kode di bawah ini atau yang mirip. Untuk memudahkan pencarian, tekan F3 atau Ctrl F pada keyboard anda.

<b:section class='sidebar' id='sidebar' preferred='yes'>



3. Jika anda sudah menemukannya, copy dan paste kode berikut tepat di bawah kode tadi (kode pada point dua).



<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>



4. Preview atau pratinjau blog anda. Bila pemasangan kode sudah tepat, maka label cloud blogumus sudah nampak pada sidebar blog. Kemudian simpan template anda.
Nah, untuk kode default blogumus tersebut, masih dapat diganti dan disesuaikan dengan desain template blog anda. Perhatikan kode ini:
* Lebar 240px
* Tinggi 300px;
* Warna Background putih #ffffff
* Test color grey
* Besar huruf "12"
Untuk mengganti default nilai lebar label "240" dan tinggi label "300" sesuai template blog anda, ubah kode yang diberi warna merah. Untuk merubah warna latar belakang putih menjadi warna lain silahkan ganti #fffff menjadi warna lain. Agar lebih mudah, gunakan kode warna pada postingan di blognya Bang Del. Kode-kode di atas terdapat pada baris berikut :

var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

Nah, jika anda merubah warna latar belakang maka sesuaikan juga dengan warna teks default di atas dark grey #333333 dengan warna lain. Untuk mengganti warna teks, jangan gunakan tanda #. Cukup ganti kode-nya saja karena "tcolor" adalah variabel untuk flash yang tidak menggunakan simbol warna seperti umumnya. Kode ini terdapat pada baris berikut :

so.addVariable("tcolor", "0x333333");

Untuk mengganti besar huruf, silahkan ganti nilai angka "12" yang terdapat di baris berikut :

so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");

Untuk mengatur nilai kecepatan putar animasi flash, anda dapat mengganti nilai 100 dengan nilai lain. Semakin besar semakin cepat dan semakin kecil putarannya akan semakin lambat. Angka ini terdapat pada baris berikut:

so.addVariable("tspeed", "100");

5. Jika semuanya sudah dipasang dan diganti, silahkan preview (pratinjau) lagi template blog anda.
Cara Pasang Widget Label Cloud Blogumus di Blogger

Cara Membuat Background Dalam Postingan Blog

,
Tips Kali Ini sangat Sederhana Untuk Mempercantik Tampilan Postingan Kita Dengan Warna Background dan Gambar....

1. Mengganti Warna Background:
-Codenya seperti berikut
<div style="background:kode_warna_disini;">

Postingan Anda Disini

</div>

2. Mengganti Background Dengan Gambar
-Codenya seperti berikut:

<div style="background:url(Url Gambar Sobat) no-repeat right top; text-align:justify; font-size:100%; padding:10px">

Postingan Sobat Disini Letaknya

</div>

3. Ganti Tulisan Yang berwarna MERAH dengan Code warna yang sobat inginkan dan warna BIRU dengan Url Gambar Sobat

Selamat Mencoba.........
Cara Membuat Background Dalam Postingan Blog

Saturday, January 1, 2011

Cara Pasang Tanggal dan Hari di Blog

,
Cara yang akan saya gunakan untuk memasang tanggal dan hari sangat mudah, anda tidak perlu mengganggu kode HTML Template, cukup membuka element halaman baru saja.
pertama-tama masuk ke Account Blogger anda – Pilih LAYOUT(rancangan) – Page Element – klik salah satu Gedget – pilih HTML/Javasript dan masukkan kode berikut ini ;

<script type="text/javascript">
now = new Date();
if (now.getTimezoneOffset() == 0) (a=now.getTime() + (7*60*60*1000))
else (a=now.getTime());
now.setTime(a);
var tahun=now.getFullYear()
var hari=now.getDay()
var bulan=now.getMonth()
var tanggal=now.getDate()
var hariarray=new Array("Minggu","Senin","Selasa","Rabu","Kamis","Jum'at","Sabtu")
var bulanarray=new Array("Januari","Pebruari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","Nopember","Desember")
document.write(hariarray[hari]+" "+tanggal+" "+bulanarray[bulan]+" "+tahun)
</script>

lalu simpan.
Jika sudah maka anda letakkan HTML java script tersebut kema saja yang anda mau.
Sebenarnya banyak cara untuk membuat tanggal dan hari tersebut tapi cara ini lah yang paling mudah.


Selamat Mencoba…..!
Cara Pasang Tanggal dan Hari di Blog

Cara Mengganti alamat situs web

,
Apabila anda sudah bosan dengan alamat situs web blog yang anda punya maka cukup mudah untuk merubahnya. Berikut tat caranya:

1. Pada area Dashboard klik Post pilih Publikasikan / Publishing

2. Muncul Halaman pengeditan alamat situs URL web kita

- Klik simpan perubahan
- Alamat URL blog sudah terganti

Mudah kan…!
Cara Mengganti alamat situs web

Cara Membuat Cursor Animasi

,
Langkah pertama untuk membuat cursor animasi adalah:

1. Carilah sebuah gambar yang berukuran kecil , anda bisa mendapatkannya lewat internet yang berhubungan dengan gambar animasi cursor contohnya: Free cursor animated, cursor animation. Anda bisa mencarinya di google search engine. Jika gambar yang diinginkan dari foto sendiri atau buatan sendiri maka anda harus meng-edit gambar terlebih dahulu.

2. Jika anda sudah mendapatkan gambar maka salin alamat email gambar tersebut, dengan cara KLIK KANAN pada gambar tersebut lalu pilih copy email address.

3. Jika sudah di kopy maka sisipkan pada code cursor seperti di bawah ini:

cursor: url("alamat gambar kursor");
font berwarna merah adalah code untuk membuat cursor. Sedangkan,
font berwarna biru adalah code alamat gambar
font berwarna biru anda isi dengan kode alamat gambar yang sudah di kopi

4. Sebagai contoh, jika saya menggunakan alamat kursor yang saya miliki, kode nya jadi seperti ini :
cursor: url("http://24rohman.googlepages.com/dragon3.ani");
5. Langkah selanjutnya adalah memasukan kode di atas ke dalam kode HTML template
6. Untuk template klasik :

1. Sign in di blogger.
2. Klik menu Template
3. Klik menu Edit HTML
4. Copy seluruh kode template yang ada, lalu save untuk backup data
· Untuk template klasik:
Cari kode yang mirip dengan kode di bawah ini, biasanya di tulis dengan body :

body {background:#fff;
margin:0;
padding:40px 20px;
font:x-small Georgia,Serif;
text-align:center;
color:#333;
font-size/* */:/**/small;
font-size: /**/small;
}

sisipkan kode alamat cursor di bawah font-size: /**/small;

1. Klik tombol Simpan Perubahan Template
2. Selesai. Silahkan lihat hasilnya.

· Untuk template baru

Caranya sama seperti yang di atas yaitu masuk ke body:
body {background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: justify;

sisipkan kode alamat cursor animasi di bawah text-align:justify;
Cara Membuat Cursor Animasi

Trik dan Cara Atasi Lupa Password Blogger

,

Bagi anda yang lupa dengan password anda ketika anda ingin masuk ke blog maka ada cara lain untuk menagani hal tersebut.
Caranya adalah…
1. Silahkan login ke ke http://www.blogger.com/forgot.g
2. Disana terdapat dua pilihan untuk mendapatkan password dan username yang kelupaan tadi. Saya menyarankan supaya menggunakan cara dengan isian alamat url blogger/blogspot.
3. Kamu tinggal mengikuti langkah-langkah yang diminta, caranya sangat mudah karena intruksi disampaikan dengan bahasa Indonesia.

Langkah selanjutnya informasi yang akan disampaikan oleh tim blogger akan dikirim ke alamat Email kamu. Jadi bukalah alamat Email kamu yang pertama kali kamu mendaftarkan blog kamu. Apabila tidak ada dalam pesan masuk, maka bukalah didaftar Spam.
Pada Email yang kamu terima ada beberapa informasi yang disampaikan diantaranya apabila kamu kembali kelupaan akan kata sandi atau name user kamu tinggal me-riset saja. Keterangan ini akan disampaikan dalam bahasa Indonesia, jadi sangat mudah untuk menjalankannya.
Semoga bermanfaat……
Trik dan Cara Atasi Lupa Password Blogger

Cara Membuat Daftar Isi

,
Cara Membuat Daftar Isi:

1. Login ke dashboard
2. Pilih rancangan
3. Ceklist expand widget
4. Edit HTML". Cari kode berikut :

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='JUDUL BLOG ANDA (Header)' type='Header'/>
</b:section>
</div>

Jika sudah ketemu, copy dan pastekan kode berikut tepat di bawahnya :

<ul id='nav'>
<li><a href='http://nama-blog-anda.blogspot.com/'>HOME</a></li>
<li><a href='http://nama-blog-anda.blogspot.com/search/label/kategori 1'>KATEGORI 1</a></li>
<li><a href='http://nama-blog-anda.blogspot.com/search/label/kategori 2'>KATEGORI 2</a></li>
<li><a href='http://nama-blog-anda.blogspot.com/search/label/kategori 3'>KATEGORI 4</a></li>
<li><a href='http://nama-blog-anda.blogspot.com/search/label/kategori 4'>KATEGORI 4</a></li>
</ul>

Setiap kata kategori 1, kategori 2, kategori 3, bisa anda ganti dengan label postingan anda yang anda jadikan kategori. Dengan cara diatas, anda tidak perlu repot seperti cara yang pertama. Setiap link kategori yang di klik pengunjung, akan menampilkan postingan pada label yang sama. Demikian tips membuat daftar isi, semoga muda dipahami dan selamat mencoba!
Cara Membuat Daftar Isi

Kode warna yang terpilih :