Showing posts with label Tutorial Blog. Show all posts
Showing posts with label Tutorial Blog. Show all posts
Cara Mengganti Icon Pada Adress Bar

Cara Mengganti Icon Pada Adress Bar

Ada salah satu sobat yang bertanya melalui komentar "kang fatur gimana cara mengganti icon pada adress bar kaya yang punya kang fatur". OK untuk sobat raa_cassie mungkin ini jawaban dari saya, mudah-mudahan bisa membantu

Jika kita membuka suatu website atau blog maka seringkali kita menjumpai ada sebuah gambar atau icon pada address bar (kotak untuk mengetikkan alamat web). Dan jika kita punya blog di Blogspot maka icon default yang akan tampil adalah gambar seperti ini :
Bagi sobat yang tidak puas dengan icon/gambar tersebut, sobat bisa menggantinya dengan gambar sesuai dengan keinginan kita. caranya sangat mudah, yaitu dengan membuat gambar (gif, jpg, ico, dan lain2) dengan ukuran kira2 24x42 pixel sampai 32x32 pixel (sebenarnya ukurannya bebas sih, tapi biar filenya kecil dan proses membukanya cepat). Setelah itu .....

masuk ke "Layout --> Edit HTML" trus tempatkan script berikut sebelum kode </head>

<link href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYXV-70J6SPqy5CyYmsgrL05NVDLZbt3cXoveCNC7zTLDGylLPvZPfWPT1AZRwNFZyVaV3YwiyMnHI2covsCysRTWebL7N0KJSzsaQzik93cle27677irdrVpvSYzRDUzY9fmtWmq0Zwg/s1600/Title+Bar.gif' rel='shortcut icon'/>

Ganti huruf yang dicetak tebal dan merah dengan lokasi gambar dimana sobat menyimpannya. Sobat bisa menyimpan gambarnya di 000webhost atau bisa juga di photobucket dan juga di imageshack atau kalo sobat tidak mau pusing dibawah ini ada beberapa contoh icon/gambar beserta dengan linknya.

http://img87.imageshack.us/img87/5862/image1an1.gif
http://img110.imageshack.us/img110/6218/image2ie0.gif
http://img98.imageshack.us/img98/9617/image3cr0.gif
http://img134.imageshack.us/img134/633/image4hx4.gif
http://img139.imageshack.us/img139/83/image5oa7.gif
http://img509.imageshack.us/img509/6449/image6fu0.gif
http://img527.imageshack.us/img527/6543/image7go9.gif
http://img507.imageshack.us/img507/5774/image8wn8.gif
http://img150.imageshack.us/img150/5784/image9qo1.gif
http://img404.imageshack.us/img404/1214/image10vr1.gif
http://img412.imageshack.us/img412/3808/image11pc0.gif
http://img100.imageshack.us/img100/4658/image12du2.gif
http://img132.imageshack.us/img132/4733/image13lj1.gif
http://img145.imageshack.us/img145/7793/image14zg9.gif
http://img412.imageshack.us/img412/4403/image15jc7.gif
http://img264.imageshack.us/img264/7575/image16kn8.gif


Selamat mencoba....





Membuat Agar Blog Transparan

Membuat Agar Blog Transparan

Halo para sobat blogger yang bae-bae pada hari yang cerah ini akhirnyasaya meluangkan waktu untuk berbagi ilmu kepada sobat semua. Kali ini saya hanya untuk mengambulkan permintaan dari para sobat yang meminta "Supaya Blog Transparan"

O.K sesuai janji saya untuk memposting cara membuat blog transparan, ini tipsnya. Bagi yang memerlukan silahkan di coba. Walaupun ini adalah tip's yang tergolong mudah tapi siapa tahu sobat memerlukannya....

O.K kita langsung aja ikuti langkah-langkah berikut ini :

1. Seperti biasa login ke blog sobat
2. Dashboard/dasbor
3. Layout/tataletak
4. Edit HTML, centang "EXPAND TEMPLATE WIDGET" dan download lengkap template buat berjaga-jaga jika terjadi kesalahan.

Terus cari setiap kata :

background

contoh :

background: #000000;

Lalu ganti kode warnanya (teks yang tercetak merah) menjadi transparent, atau kurang lebi seperti ini

background: transparent;

atau sobat bisa juga melakukan dengan cara kedua yaitu buang saja value warna merah yang ada sehingga menjadi seperti ini :

background: ;

Cari di setiap posisi dimana sobat ingin posisi tsb terlihat bening/Transparan.
Contoh bagian Header, body, side bar, post footer, lower dll.
Nah mudah bukan ? setelah itu klik Save/simpan perubahan, dan lihat hasilnya....
Semoga tip's ringan ini bermanfaat bagi para sobat semua !!

Selamat mencoba ......,







Efek Opening Aneh

Efek Opening Aneh

Hahahah... kayak ga ada nama yang lain aja buat efek pembuka yang satu ini ! btw karena sudah bingung buat kasih namanya, terpaksa saya kasih nama n'tu ajah.....
setelah kang fatur posting Membuat Efek Roaming Windows akhirnya kangfatur buat lagi nie yang judulnya pake aneh, Kenapa diblang aneh yaa karena membuat Jendela kita menjadi mondar mandir kaya yang lagi pusing hehe. Okay... , jika para sobat tertarik, silahkan ikuti langkah-langkah berikut :


1. Sign in ke account blogger sobat
2. Pergi ke Layout | Page Elements tab untuk blog Sobat
3. Klik "Tambah Gadget" link yang muncul di sidebar tata letak Sobat untuk menambahkan script
4. Sobat akan melihat jendela popup dengan semua jenis Gadgets yang dapat ditambahkan ke blog Sobat.
5. Klik pada "HTML / JavaScript" gadget


Kemudian Copast(Copy paste) kode dibawah ini :

<script>
//Edited by Andreas fafandreo at october'2008
window.scrollBy(0, 1)
window.resizeTo(0,0)
window.moveTo(0,0)
//setInterval("move()",30);
setTimeout("move()", 1);
var mxm=50
var mym=25
var mx=0
var my=0
var sv=50
var status=1
var szx=0
var szy=0
var c=255
var n=0
var sm=30
var cycle=2
var done=2
function move()
{
if (status == 1)
{
mxm=mxm/1.05
mym=mym/1.05
mx=mx+mxm
my=my-mym
mxm=mxm+(400-mx)/100
mym=mym-(300-my)/100
window.moveTo(mx,my)
rmxm=Math.round(mxm/10)
rmym=Math.round(mym/10)
if (rmxm == 0)
{
if (rmym == 0)
{
status=2
}
}
}
if (status == 2)
{
sv=sv/1.1
scrratio=1+1/3
mx=mx-sv*scrratio/2
my=my-sv/2
szx=szx+sv*scrratio
szy=szy+sv
window.moveTo(mx,my)
window.resizeTo(szx,szy)
if (sv < 0.1)
{
status=3
}
}
if (status == 3)
{
c=c-16
if (c<0)
{status=8}
}
if (status == 4)
{
c=c+16
if (c > 239)
{status=5}
}
if (status == 5)
{
c=c-16
if (c < 0)
{
status=6
cycle=cycle-1
if (cycle > 0)
{
if (done == 1)
{status=7}
else
{status=4}
}
}
}
if (status == 6)
{
cycle=2
status=4
done=1
}
if (status == 7)
{
c=c+4
if (c > 128)
{status=8}
}
if (status == 8)
{
window.moveTo(0,0)
sx=screen.availWidth
sy=screen.availHeight
window.resizeTo(sx,sy)
status=9
}
var timer=setTimeout("move()",0.3)
}
</script>




Setelah sobat paste kode diatas, silahkan sobat klik tombol Save/simpan o.k?
Jangan lupa, karena kita menginginkan agar gadget ini beraksi pada saat awal halaman dibuka, maka letakkan gadget ini pada posisi PALING ATAS !! baik pada side bar maupun tempat gadget lainnya o.K?
Dan lihat hasilnya !! hehehe... kalian dapet opening yang bikin dag-dig-dug pengunjung !!
Mudah bukan ?

Kalau sudah dipasang... silahkan anda bagikan ilmu ini pada teman-teman yang membutuhkan, Jangan pelit ya ?

Selamat mencoba !!

Menghilangkan Navbar Blogspot

Menghilangkan Navbar Blogspot

Sobat Monik mengajukan pertanyaan yang di tulis melalui shoutMix di Blog Kang Fatur yang ini. Beliau menanyakan bagaimana cara menghilangkan Navbar Blogger, dan kali ini saya akan mencoba membahasnya. Apa itu Navbar Blogger? navbar blogger adalah suatu frame yang berukuran kecil miliknya blogger yang terdapat di bagian atas blog. frame ini berfungsi untuk login ke blogger atau bisa juga sebagai jalan untuk melihat blog lain atau bisa juga untuk menandai blog yang sekiranya melanggar TOS blogger seperti blog yang mengandung unsur SARA ataupun pornografi untuk dilaporkan ke pihak blogger.


Apakah kita bisa menghilangkan Navbar Blogger? jika pertanyaannya seperti itu maka tentu jawabanya adalah bisa, akan tetapi sebelum menghilangkan navbar tersebut ada baiknya sobat berfikir-fikir dahulu dan silahkan baca TOS blogger secara seksama, karena resiko yang akan di pikul sangatlah berat yaitu akan di tutupnya account blogger sobat atau dengan kata lain sobat akan kehilangan blog kesayanangannya. Lumayan mengerikan bukan? memang beberapa waktu yang lalu tersiar kabar bahwa pernah ada yang menanyakan ke pihak blogger apakah boleh menghilangkan navbar blogger atau tidak? dan katanya sekarang pihak blogger membolehkan untuk menghapus navbar, tapi entahlah apakah berita tersebut benar atau tidak yang jelas sobat harus selalu membaca TOS secara seksama.

Masih bersikeras untuk menghilangkan navbar blogger? jika masih akan saya beritahu, akan tetapi resiko di tanggung masing-masing, saya tidak bertanggung jawab jika di kemudian hari terjadi sesuatu dengan blog sobat.

Untuk menghilangkan navbar blogger, sobat tinggal menambahkan kode di bawah ini pada style sheet CSS :

/* hilangkan navbar
----------------------------- */

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

Atau bisa juga menaruh kode berikut persis di bawah kode <body> :
<style type='text/css'>
#navbar-iframe {display:none;}
</style>

Mau pilih yang mana? keduanya mempunyai fungsi yang sama yaitu menghilangkan navbar blogger. Masih bingung juga dalam pemasangan kode di atas? silahkan ikuti langkah-langkah berikut ini :

Untuk template klasik

1. Sign in di blogger
2. Klik menu Template
3. Klik menu Edit HTML
4. Copy seluruh kode yang ada lalu save di komputer sobat sebagai backup data agar aman
5. Copy kode berikut lalu paste di atas kode </style>

/* hilangkan navbar
----------------------------- */

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

Klik tombol Simpan Perubahan Template
Selesai.

Untuk template baru

1. Sign in di blogger
2. Klik menu Layout
3. Klik menu Edit HTML
4. Klik link bertuliskan Download Template Seluruhnya, silahkan save dulu untuk backup data
5. Copy kode berikut lalu paste di atas kode ]]></b:skin>

/* hilangkan navbar
----------------------------- */

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}


6. Klik tombol Simpan Template
7. Selesai.

Selamat menikmati blog tanpa Navbar, semoga bermanfaat.



Membuat Widget Tersembunyi

Membuat Widget Tersembunyi

Para sobat bloger, Kang Fatur nongol lagi nie setelah satu bulan lebih ga posting-posting yaa malum jadi orang susah akhirnya waktu buat postingpun ga ada karena sibuk masalah pribadi. Walaupun sibuk yaa alhamdullilah dihari minggu ini Kang Fatur bisa posting lagi untuk berbagi dengan sobat-sobat blogger.

Kali ini Kang Fatur mao berbagi dengan sobat yaitu membuat Buku Tamu Tersembunyi hehe aneh yaa?? sebetulnya widget ini sudah banyak para blogger lain yang bikin tapi demi para pengunjung blog Kang Fatur, yaa Kang Fatur sediakan disini dan mudah-mudahan bermanfaat di hati para sobat.

Gak usah panjang lebar lagi tiba saatnya kita ke langkah-langkah pembuatan :

1. Seperti biasa Masuk ke account Blogger sobat, pilih "Layout" kemudian "Page Elements",
2. Klik "Add a Gadget" (yang mana aja oke), kemudian pilih "HTML/JavaScript",
3. Copy-paste kode di bawah ini:

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi26aVKnr3DxIhB83nei4nM2-QQbSBqnEHvpEDP6oWxxWgcjHBJuQvkmRpcyRdKkM36SJ092xBuwk15fsjylBlW6-pn591gxYkdMms6Q9DLf5a9-xCVaHV01FLZfF4-mFs2ZIe1ZAkJ4lLF/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

<!-- Ganti ini dengan kode Widget sobat -->

<br/>
Mau punya buku tamu seperti ini?<br/>
Klik di
<a href="http://ade-tea.blogspot.com/2009/11/membuat-buku-tamu-tersembunyi.html">
sini (Blog KangFatur)
</a>

<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>


4. Pada kode di atas, cari kode dan ganti kode tersebut dengan kode buku tamu yang sobat dapatkan dari situsnya,
5. Sobat juga bisa atur posisinya. Ubah aja nilai atribut top-nya. Kalau mau lebih ke atas dikit, ubah jadi 30px atau 20px, terserah sobat deeh hehe.
6. Border dan Backgrounnya juga bisa sobat ubah ubah O.K
7. Selamat mencoba!








Cara Mengganti Icon Pada Adress Bar

Cara Mengganti Icon Pada Adress Bar

Ada salah satu sobat yang bertanya melalui komentar "kang fatur gimana cara mengganti icon pada adress bar kaya yang punya kang fatur". baik untuk sobat raa_cassie mungkin ini jawaban dari kang fatur, mudah-mudahan bisa membantu

Jika kita membuka suatu website atau blog maka seringkali kita menjumpai ada sebuah gambar atau icon pada address bar (kotak untuk mengetikkan alamat web). Dan jika kita punya blog di Blogspot maka icon default yang akan tampil adalah gambar seperti ini :
Bagi kamu yang tidak puas dengan icon/gambar tersebut, kamu bisa menggantinya dengan gambar sesuai dengan keinginanmu. caranya sangat mudah, yaitu dengan membuat gambar (gif, jpg, ico, dan lain2) dengan ukuran kira2 24x42 pixel sampai 32x32 pixel (sebenarnya ukurannya bebas sih, tapi biar filenya kecil dan proses membukanya cepat). Setelah itu .....

masuk ke "Layout --> Edit HTML" trus tempatkan script berikut sebelum kode </head>

http://kendhin.890m.com/sonictrik.gif' rel='SHORTCUT ICON'/>

ganti huruf yang dicetak tebal dengan lokasi gambar dimana kamu menyimpannya. Kamu bisa menyimpan gambarmu di 000webhost atau bisa juga di photobucket dan juga di imageshack atau kalo kamu tidak mau pusing dibawah ini ada beberapa contoh icon/gambar beserta dengan linknya.

http://img87.imageshack.us/img87/5862/image1an1.gif
http://img110.imageshack.us/img110/6218/image2ie0.gif
http://img98.imageshack.us/img98/9617/image3cr0.gif
http://img134.imageshack.us/img134/633/image4hx4.gif
http://img139.imageshack.us/img139/83/image5oa7.gif
http://img509.imageshack.us/img509/6449/image6fu0.gif
http://img527.imageshack.us/img527/6543/image7go9.gif
http://img507.imageshack.us/img507/5774/image8wn8.gif
http://img150.imageshack.us/img150/5784/image9qo1.gif
http://img404.imageshack.us/img404/1214/image10vr1.gif
http://img412.imageshack.us/img412/3808/image11pc0.gif
http://img100.imageshack.us/img100/4658/image12du2.gif
http://img132.imageshack.us/img132/4733/image13lj1.gif
http://img145.imageshack.us/img145/7793/image14zg9.gif
http://img412.imageshack.us/img412/4403/image15jc7.gif
http://img264.imageshack.us/img264/7575/image16kn8.gif


Selamat mencoba....





Posting Blog Mengunakan MS Office Word2007

Posting Blog Mengunakan MS Office Word2007

Bagi para pecinta Blog yang pingin selalu update blog tapi cuma punya koneksi internet yang minim. Ini ada salah satu alternatip agar blog selalu up to date, tanpa bikin bandwidth jebol. Semua orang tentu sudah sangat tahu dengan aplikasi ini. Microsoft Office Word (ato disingkat MS Word). Untuk versi 2007, sudah disediakan add on Post untuk Blog. Sedangkan Untuk versi sebelumnya, membutuhkan installasi aplikasi yang bernama BloggerForWord.
Untuk membuat post pada MS Word 2007, kita tinggal klik tobol Office pada sisi kiri atas jendela Word, klik New, pilih New Blog Post, Klik tombol Create. Maka akan muncul opsi untuk mendaftar ke pusat layanan Blog (Blogger, Wordpress dll).
Jika sudah tersambung dengan internet, maka kita bisa langsung membuat account dengan klik tombol Register Now, maka akan keluar pilihan penyedia blog seperti Windows Live Spaces, Blogger, Wordpress dll, seperti pada gambar di bawah ini. Selanjutnya klik Next..
Selanjutnya masukkan User Name dan Password account Blog kedalam kolom yang disediakan. Centang Remember Password jika pada computer pribadi. Jangan centang jika di computer public yang dapat digunakan orang banyak, karena sangat riskan. Klik OK
Selanjutnya akan muncul opsi Upload gambar. Jika memiliki tempat / alamat Uploag gambar tersendiri, maka kolom Picture Provider bisa diisi. Untuk kali ini, biarkan default.klik OK
Jika keluar pesan seperti di bawah ini, berarti manage account berhasil. Kelak jika akan melakukan Posting, kita tinggal klik tombol Publish pada toolbar. Jika kita akan menamba account baru, kita bisa klik tombol Manage Account pada toolbar.
Proses Setting account sudah selesai, kita pun bisa menulis post pada halaman yang telah disediakan. Untuk Accoun Wordpress, Kita dapat menambahkan Kategory Post melalui tombol Insert Category pada toolbar Ribbon.
Jika sudah selesai, kita dapat langsung melakukan posting dengan klik tombol Post, Post. Jika posting sukses, maka di atas header akan muncul text notifikasi bahwa posting ke Blog sukses dilakukan pada jam ...... tanggal...... seperti pada gambar di atas.

Selamat mencoba, moga bermanfaat dihati sobat.


Background Berbeda-beda Setiap Halaman

Background Berbeda-beda Setiap Halaman

Halo para sobat bloger khususnya kang fatur dateng lagi nie mao bagi bagi dengan sobat tercinta, pernah ada sobat yang meminta pada kang fatur tolong kang katanya saya ajarin cara membuat Background berbeda-beda seperti Backgrounnya kang fatur!!. Demi permintaan sobat akhirnya kang fatur bikin postingin yang berjudul "Bikin background yang berbeda untuk setiap halaman blog". Lumayan dech buat tampil agak lain dari yang lain. Narsis gitu ..., dan pengunjung ngga bakalan bosan menjelajah blog kita karena bisa tampil dengan background yang berbeda-beda di setiap halamannya O.K.

O.K. Jangan banyak banyol bentar lagi hari semakin malam, duduk udah pegal, kopi udah abis, rokok tinggal sebatang, perut udah laper, sebaiknya kita lanjutkan aja O.K.

Persiapan :

Memasang background utama :

Background utama yang kumaksud di sini adalah script backgroud yang terpasang langsung di Template blogmu, alias terpasang pada struktrur htmlnya. Ok kita lanjut yach.

1. Kopi kode di bawah ini, lalu edit dengan menggunakan worpad atau document txt.

body {background-image: url("http://alamat-gambar-sobat"); background-position: left; background-repeat: no-repeat; background-attachment: fixed;
color:$textcolor;
font: x-small "Trebuchet MS", Trebuchet, Verdana, Sans-serif;
font-size/* */:/**/small;
font-size: /**/small;
}


2. Gantilah http://alamat-gambar-sobat yang berwarna merah dengan url gambar sobat.

3. Kode center no-repeat; (hijau) bisa sobat ganti dengan left atau right. Ini adalah kode yang mengatur tata letak gambar pada blog sobat, apakah mau di taruh di tengah, di kanan atau di kiri.

4. Kode no-repeat; boleh sobat hapus bila akan menggunakan gambar yang kecil dan memerlukan pengulangan agar gambarnya menjadi penuh.

5. Kalau sudah selesai ngeditnya , balik lagi ke blog sobat. Cari kode seperti di bawah ini :

body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}


5. Hapus seluruh kode di atas, lalu gantikan dengan kode hasil editan sobat tadi.

6. Jika udah beres, klik SAVE

Nah sampai pada tahap ini, sobat sudah bisa melihat perubahan background blog sobat, klik aja View Blog.

Memasang background untuk halaman depan :

Halaman depan adalah halaman atau tampilan utama blog sobat. Di halaman ini sobat menempatkan berbagai widget/aksesoris yang wajib ada di halaman depan, diantaranya semisal tab menu, link para sobat kita, label, buku tamu atau widget-widget lain yang kita anggap perlu demi memudahkan pengunjug menjelajah isi blog kita.

Kerja kita kali ini agak sedikit praktis, karena css background dipasang seperti layaknya kita menambah widget/aksesoris ke sidebar blog.

Langkah pertama :

a. Copy script di bawah ini :

body {background-image: url("
<style type="text/css">
body {background-image: url("http://alamat-gambar sobat"); background-position: left; background-repeat: no-repeat; background-attachment: fixed; }.bkgspc {margin-top:10px;color:#909090;font-size:10px;font-family:Arial;}.bkgspc a {color:#909090;}</style><div class="bkgspc" align="center">
Visit InfoServe for <a href="http://ade-tea.blogspot.com/" target="_blank">Blog Kang Fatur</a>.</div>


b. Edit dengan menggunakan wordpad atau document.txt.

c. Ganti http://alamat-gambar-sobat (kode yang berwarna merah ) dengan url gambar sobat

d. Ganti kode (yang berwarna biru) dengan left atau right, kode ini merupakan kode yang mengatur letak gambar sobat itu nantinya.

e. Kode no-repeat; bloeh sobat hapus kalo memakai gambar dengan ukiran kecil atau berupa motif yang memerlukan pengulangan untuk bisa tampil penuh pada seluruh halaman

Langkah ke-dua :

Sekarang kita memasuki tahap kedua dimana kita akan memasang kode hasil editan tadi ke sidebar blog. pasti udah pada bisa dech. Namun ngga ada salahnya kalau kang fatur uraikan kembali di sini. yuuuu ...

Seperti biasa :

1. Login ke blogspot.
2, Klik Customize.
3. Klik Layout.
4. Klik Add a Gadget.
5. Pilih HTML/JavaScript.
6. Beri nama CSS1 pada kolom titel atau kolom judul, ini hanya penamaan saja. Terserah terserah sobat dikasih nama apa. Yang jelas, nama ini untuk mempermudah kita mencari widget ini nanti di ruang edit html.
7. Pastekan kode hasil editan kita tadi ke ruang conten.
8. Terus Save.

Langkah ke-tiga :

Sekarang kita masuk pada langkah ke_tiga, dimana kita akan mengatur kode css backround yang kita pasang dengan nama CSS1 pada sidebar tadi supaya tampil pada halaman depan dan akan menghilang bila kita bergerak ke halaman selanjutnya. Udah siap??? let's go ...

1. Login ke blogspot.
2, Klik Customize.
3. Klik Layout.
4. Klik Edit HTML
5. Conteng kotak Expand Widget Templates
6. Cari kode seperti di bawah ini : Kode yang berwarna biru merupakan kode tambahan yang membuat css background hasil editan kita tadi tampil di halaman utama atau front page.

<b:widget id='HTML20' locked='false' title='CSS1' type='HTML'>
<b:includable id='main'>
<b:if cond="data:blog.url == data:blog.homepageUrl">
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>


7. Klik save, lantas klik view blog untuk melihat hasilnya.

Ok, kita sekarang sudah punya 2 buah backround berbeda, istirahat dulu. Besok baru diteruskan lagi. Tapi kalo mau dilanjutkan ... yuuuuuk ...

Memasang background untuk halaman Selanjutnya :

Halaman selanjutnya adalah halaman yang akan tapil bila kita bergerak (misalnya ) dengan mengklik readmore atau menglik judul posting. Kalo kita ingin membuat backroundnya, maka langkah kita semakin ringan . Kan tadi sobat udah punya kode script yang dikasi nama CSS1 ? ingat kan. Nah kode tersebut sobat ganti namanya menjadi CSS2, ini umpamanya. Untuk memudahkan pencarian kode ini nantinya.

Namun biar lebih jelas, baiknya kang fatur uraikan sedikit di bawah ini. ok coy ...

1. Ikuti langkah pertama seperti pada saat kita membuat backround untuk halaman pertama tadi, dari point a sampai d. Yaitu mengedit kodenya dengan worpad atau document txt.

2. setelah selesai di edit, pasang ke side bar seperti biasa dan beri nama widget kita ini dengan nana CSS2.

3. Ikuti langkah ke-tiga dengan penempatan kode berwarna biru yang sedikit berbeda seperti tampak pada kode di bawah ini ; perhatikan baik-baik perbedaannya.

<b:widget id='HTML21' locked='false' title='CSS2' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:if>
</b:includable>
</b:widget>


4. Save dan view blog untuk melihat hasilnya.

Selamat mencoba semoga sukses dan bermanfaat di hati sobat :







Membuat "Tag Cloud" Widget

Membuat "Tag Cloud" Widget

Halo para sobat blogger!! Kang Fatur ada kabar gembira lagi nie buat para sobat khususnya yang pencinta blog Kang Fatur hehe PD amat ya?????.

Yeah! Tadi malam sedang mencari animasi "Tag & Clouds" widget. Kang Fatur menemukan situs menarik oleh Roy Tanck's. Penulis telah menulis sebuah skrip yang sangat baik untuk menampilkan tag, kategori yang berputar dalam 3D animasi. Tapi Roy Tanck's telah menulis skrip ini hanya untuk Wordpress yang disebut "WP-Cumulus": tetapi para blogger jangan bersedih hati, Kang Fatur sudah atur alias dsain lagi supaya bisa dipasang di Blogspot dan akhirnya Alhamdulillah bisa buat Blogspot juga hehe. dan baru pada Sore ini Kang Fatur bisa terbitkan (bagi-bagi) pada kawan/sobat.

O.K Para sobat semua tiba saatnya kita ke tahap pemasangan karena waktu semakin petang aja.

Seperti Biasa

1. Sign in ke account blogger sobat
2. Pergi ke Layout | Page Elements tab untuk blog Sobat
3. Klik "Tambah Gadget" link yang muncul di sidebar tata letak Sobat untuk menambahkan "Tag Clud".
4. Sobat akan melihat jendela popup dengan semua jenis Gadgets yang dapat ditambahkan ke blog Sobat.
5. Klik pada "HTML / JavaScript" gadget

Kemudian paste script berikut : tapi ada baiknya para sobat paste dulu di Notepad untuk merubah dulu

<script src="http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js" type="text/javascript"></script>
<div id="flashcontent" style="overflow: visible;"><embed quality="high" allowscriptaccess="always" flashvars="tcolor=0xffffff&amp;mode=tags&amp;distr=true&amp;tspeed=100&amp;tagcloud=&lt;tags&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;a href='http://LINK SOBAT DISINI.COM/'style='12'&gt;JUDUL LINK SOBAT DISINI&lt;/a&gt;&lt;/tags&gt;" type="application/x-shockwave-flash" height="300" src="http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf" id="tagcloud" bgcolor="#000000" width="300" name="tagcloud"></embed></div>
<script type="text/javascript"><br/>var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#000000");<br/>// uncomment next line to enable transparency<br/>//so.addParam("wmode", "transparent");<br/>so.addVariable("tcolor", "0xffffff");<br/>so.addVariable("mode", "tags");<br/>so.addVariable("distr", "true");<br/>so.addVariable("tspeed", "100");<br/>so.addVariable("tagcloud");<br/>so.addParam("allowScriptAccess", "always");<br/>so.write("flashcontent");<br/></script>Tag Cloud by <a href="http://kangfatur.blogspot.com/" starget="new">Kang Fatur</a>

PERHATIAN!!!
Cari kode seperti ini :
<a href='http://LINK SOBAT DISINI.COM/'style='12'>JUDUL LINK SOBAT DISINI</a>
Kemudian ganti kode yang berwarna Kuning dengan Link tujuan sobat lalu teks yang berwarna Merah ganti dengan Judul Link sobat yang akan ditampilkan.

Jika Tag Cloud Widget ini akan sobat sesuaikan baik itu warna Background, Warna Teks dan Width serta Hight nya sobat cari kode seperti dibawah ini :

1. Untuk warna Background cari kode bgcolor="#000000" kemudian ganti dengan kode warna yang diinginkan
2. Untuk warna teks cari kode tcolor="ffffff" emudian ganti dengan kode warna yang diinginkan
3. Untuk Lebar dan Tinggi cari kode height="300" dan width="300" ganti sesuai dengan keadaan template sobat,

Yaaa pokoknya atur aja deech O.K mungkin para sobat juga dah pada ngerti ya khan???

Setelah langkah demi langkah selesai klik Simpan dan lihat blog!!

Selamat mencoba!! semoga berhasil dan bermanfaat.


Menghilangkan Navbar Blogspot

Menghilangkan Navbar Blogspot

Kali ini saya akan mencoba membahasnya. Apa itu Navbar Blogger? navbar blogger adalah suatu frame yang berukuran kecil miliknya blogger yang terdapat di bagian atas blog. frame ini berfungsi untuk login ke blogger atau bisa juga sebagai jalan untuk melihat blog lain atau bisa juga untuk menandai blog yang sekiranya melanggar TOS blogger seperti blog yang mengandung unsur SARA ataupun pornografi untuk dilaporkan ke pihak blogger.


Apakah kita bisa menghilangkan Navbar Blogger? jika pertanyaannya seperti itu maka tentu jawabanya adalah bisa, akan tetapi sebelum menghilangkan navbar tersebut ada baiknya sobat berfikir-fikir dahulu dan silahkan baca TOS blogger secara seksama, karena resiko yang akan di pikul sangatlah berat yaitu akan di tutupnya account blogger sobat atau dengan kata lain sobat akan kehilangan blog kesayanangannya. Lumayan mengerikan bukan? memang beberapa waktu yang lalu tersiar kabar bahwa pernah ada yang menanyakan ke pihak blogger apakah boleh menghilangkan navbar blogger atau tidak? dan katanya sekarang pihak blogger membolehkan untuk menghapus navbar, tapi entahlah apakah berita tersebut benar atau tidak yang jelas sobat harus selalu membaca TOS secara seksama.

Masih bersikeras untuk menghilangkan navbar blogger? jika masih akan saya beritahu, akan tetapi resiko di tanggung masing-masing, saya tidak bertanggung jawab jika di kemudian hari terjadi sesuatu dengan blog sobat.

Untuk menghilangkan navbar blogger, sobat tinggal menambahkan kode di bawah ini pada style sheet CSS :

/* hilangkan navbar
----------------------------- */

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}


Atau bisa juga menaruh kode berikut persis di bawah kode <body> :

<style type='text/css'>
#navbar-iframe {display:none;}
</style>


Mau pilih yang mana? keduanya mempunyai fungsi yang sama yaitu menghilangkan navbar blogger. Masih bingung juga dalam pemasangan kode di atas? silahkan ikuti langkah-langkah berikut ini :

Untuk template klasik

1. Sign in di blogger
2. Klik menu Template
3. Klik menu Edit HTML
4. Copy seluruh kode yang ada lalu save di komputer sobat sebagai backup data agar aman
5. Copy kode berikut lalu paste di atas kode </style>

/* hilangkan navbar
----------------------------- */

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}


Klik tombol Simpan Perubahan Template
Selesai.

Untuk template baru

1. Sign in di blogger
2. Klik menu Layout
3. Klik menu Edit HTML
4. Klik link bertuliskan Download Template Seluruhnya, silahkan save dulu untuk backup data
5. Copy kode berikut lalu paste di atas kode ]]></b:skin>

/* hilangkan navbar
----------------------------- */

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}



6. Klik tombol Simpan Template
7. Selesai.

Selamat menikmati blog tanpa Navbar, semoga bermanfaat.



Blog Transparent

Blog Transparent

Halo para sobat blogger yang bae-bae dihari minggu yang cerah ini akhirnya kang fatur meluangkan waktu untuk berbagi ilmu kepada sobat koe yang bae, kali ini kang fatur hanya untuk mengambulkan permintaan dari para sobat yang meminta "Supaya Blog Transparan"

O.K sesuai janji kang fatur untuk memposting cara membuat blog transparan, ini tipsnya. Bagi yang memerlukan silahkan di coba. Walaupun ini adalah tip's yang tergolong mudah tapi siapa tahu sobat memerlukannya....

O.K kita langsung aja ikuti langkah-langkah berikut ini :

1. Seperti biasa login ke blog sobat
2. Dashboard/dasbor
3. Layout/tataletak
4. Edit HTML, centang "EXPAND TEMPLATE WIDGET" dan download lengkap template buat berjaga-jaga jika terjadi kesalahan.

Terus cari setiap kata :

background

contoh :

background: #000000;

Lalu ganti kode warnanya (teks yang tercetak merah) menjadi transparent, atau kurang lebi seperti ini

background: transparent;

atau sobat bisa juga melakukan dengan cara kedua yaitu buang saja value warna merah yang ada sehingga menjadi seperti ini :

background: ;

Cari di setiap posisi dimana sobat ingin posisi tsb terlihat bening/Transparan.
Contoh bagian Header, body, side bar, post footer, lower dll.
Nah mudah bukan ? setelah itu klik Save/simpan perubahan, dan lihat hasilnya....
Semoga tip's ringan ini bermanfaat bagi para sobat semua !!

Selamat mencoba ......,







Cara Mengatur Judul Sidebar

Cara Mengatur Judul Sidebar

Alhamdulilah walapun kerjaan banyak, di sekolah sibuk dan gak bisa liburan akhirnya kang fatur selesai juga membuat tips sederhana ini, demi teman khususnya buat para sobat blogger, kali ini kang fatur postting tentang cara "Mengatur Judul Sidebar"

Penampilan judul sidebar dapat sobat percantik dengan melengkapi kode-kode yang diperlukan agar penampilannya berbeda dengan sebelumnya (maksudnya kaya yang punya kang fatur gitu looch).

Kode awal untuk judul sidebar adalah .sidebar h2 { yang dibawahnya dapat sobat tambahkan kode-kode lain sesuai keperluan atau yang diinginkan.
O.K dech jangan ngomel-ngomel terus, yuk..sama-sama kita pelajari kode-kode yang dapat ditambahkan pada judul sidebar.
Jika para sobat ingin melalukan pengeditan pada judul sidebar, seperti biasa sobat harus melakukan langkah-langkah standar yaitu :

Masuk ke Blogger dengan ID sobat
Pilih Tata Letak
Pilih Edit HTML
Download Template Lengkap dengan tujuan jika hasil yang diharapkan tidak sesuai dengan keinginan sobat, template dapat dikembalikan pada keadaan semula.
Cari kode diatas tadi yaitu : .sidebar h2 {
Perhatikan kode tersebut pada bagian bawahnya, apakah sudah memiliki penambahan kode atau belum. Jika belum atau masih standar , coba sobat perhatikan kode sidebar dibawah ini yang telah dilengkapi dengan berbagai kode

PERHATIKAN YAA???

.sidebar h2 {

font-size:110%;

font-weight:bold;

text-transform:uppercase;

text-align:right;

border: 1px solid #000;

background:#6df466;

padding;5px;

}

Mari Kita bahas satu persatu :

  • Kode font-size:110%; : berfungsi untuk mengatur besarnya huruf. Satuan yang digunakan bisa pakai % atau pixels (px). Angkanya dapat sobat ganti sesuai keinginan
  • Kode font-weight:bold; : menunjukan judul yang tampil dengan huruf tebal. Kata bold dapat sobat ganti dengan normal jika penampilanya tidak ingin tebal atau ganti dengan italic jika ingin penampilan hurufnya miring.
  • Kode text-transform:uppercase; : menunjukan bahwa huruf yang tampil semuanya berupa huruf kapital (besar). Sobat dapat mengganti dengan kata lowercase (semuanya huruf kecil) atau capitalize (hanya huruf depannya yang besar).
  • Kode text-align:right; : Letak judul sidebar di bagian kanan. Sobat dapat mengganti dengan left jika ingin berada dikiri atau center jika ingin berada di tengah.
  • Kode border: 1px solid #000; : berfungsi untuk menampilkan garis di sekeling judul sidebar. Sobat dapat mengganti ukuranya dan warna dari garis tersebut.
  • Kode background:#6df466; : untuk menampilkan warna latar dari judul sidebar. Ganti kode warnanya dengan warna kesukaan sobat. Selain dengan menampilkan warna sobat juga dapat menampilkan sebuah image sebagai background judul sidebar. Perhatikan cara meletakan alamat image agar tampil sebagai background

background:url(http://www.alnect.net/blogcontest/banner_blog_contest.gif)no-repeat top left;

  • Ganti alamat image diatas dengan alamat image kepunyan para sobat. Kalau para sobat belum punya gambarnya atau gak mao repot repot silahkan sobat pake aja gambar hasil karya kang fatur di bawah ini, tinggal pilih sesuai keinginan sobat.

    Photobucket

    Alamatnya ini :

    http://i634.photobucket.com/albums/uu61/adetea/RGsdbar.gif


    Photobucket

    Alamatnya ini:

    http://i634.photobucket.com/albums/uu61/adetea/side1.gif

    Photobucket

    Alamatnya ini:

    http://i634.photobucket.com/albums/uu61/adetea/side3.gif

    Photobucket

    Alamatnya ini:

    http://i634.photobucket.com/albums/uu61/adetea/header.gif

  • Kode padding;5px; : untuk memberi jarak antara bagian pinggir judul sidebar dengan tulisan judul sidebarnya, dengan maksud agar kelihatan tidak mepet ke bagian pinggir.
  • Silahkan sobat coba untuk mengatur penampilan judul sidebar pada blog kesayangan sobat
  • Jangan lupa setelah selesai klik Simpan Template.

Lihat hasilnya, selamat mencoba semoga bermanfaat buat sobat-sobat koe, jangan lupa comentnya O.K.



Hantu Berkeliaran di Halaman Blog

Hantu Berkeliaran di Halaman Blog

Halo semuanya, para sobat koe kang fatur hadir lagi nie mao ngasih serpai buat para sobat blogger semuanya, kali ini kang fatur punya tips baru yaa walau pun tips ini sedikit lumayan tapi hasil jerih payah kang fatur hehe. Tips kali ini yaitu tentang cara membuat "Hantu Berkeliaran di Halaman Blog". Dulu pernah kang fatur posting tentang "Membuat Kupu-kupu dan Burung Terbang" dan ada seseorang "arsief.blogspot.com"yang minta lewat ShoutMix, kalau ga salah gini "kang fatur bisa gak bukan burung dan kupu-kupu yang berterbangannya???" Maka demi mengambulkan permintaan sobat. Kang fatur bikin yaitu "Hantu Berkeliaran di Halaman Blog" kalau soabt penasaran dan pingin lihat dulu silahkan klik disini atau disini


O.K. para sobat semuanya, kita gak perlu kesana kemari lagi ngomongnya karena waktu semakin mendesak dan kebetulan mao nyontreng nie hehe, kita langsung aja menuju istana cara pembuatannya :

1. Seperti biasa login dulu ke blog para sobat dengan ID masing-masing

2. Klik Tata Letak (layout)

3. Klik Tambah Gadget

4. Tambahkan HTML/Javascript

5. Kemudian copy paste script di bawah ini.

<script language="JavaScript1.2" src="http://h1.ripway.com/adetea/hantu.js"></script>


6. Setelah selesai klik tombol Simpan, dan lihat hasilnya!!!

Selamat mencoba, mudah mudahan tips ini bisa membantu para sobat, berikan kang fatur komentarnya


Judul Blog Menjadi Judul Postingan

Judul Blog Menjadi Judul Postingan

Sobat tau kan dengan judul blog? atau ada juga yang dengan title blog, judul postingan atau title postingan juga tau kan? Kalo di blognya kang fatur ini yang menjadi judul blog adalah "Blog Kang Fatur", sedangkan judul postingan adalah "Judul Blog Menjadi Judul Postingan".

Title blog biasanya berada didepan title postingan. Seperti yang dibilang ama orang-orang, mengoptimalkan title itu akan mempengaruhi dalam membuat blog kita berada dalam top rank hasil pencarian search engine. Nha jika kita menggunakan trik mengganti title blog dengan title postingan maka hal itu akan lebih bagus lagi buat masuk ke jajaran depan search engine.

Kalo menurut yang ahli dalam SEO (Search Engine Optimization) katanya cara ini akan membuat blog kita (para sobat) menjadi lebih Search Engine Friendly. Bagi yang pingin mencobanya silahkan ikuti langkah-langkah berikut ini,

1. Seperti biasa LogIn ke blog sobat
2. Klik Tata Letak
3. Masuk ke "Layout-->>Edit HTML
4. Cari kode ini seperti ini :

<title><data:blog.title/></title>

<title><data:blog.pageTitle/></title>(asli)


"Letaknya di bagian atas"

5. Kalau sudah ketemu, ganti dengan kode di bawah ini

<b:if cond='data:blog.pageType == &quot;index&quot;'>

<title><data:blog.title/></title>

<b:else/>

<title><data:blog.pageName/></title>

</b:if>



6. Setelah selesai klik Tombol Simpan Template

"INGAT!!!"

Untuk halaman utama titlenya akan tetap title blog sobat. tapi jika sobat coba buka salah satu postingan sobat maka nanti title postingmu akan menjadi title blog sobat.

Selamat mencobat, dan jangan lupa seperti biasa Comentarnya O.K.


Photobucket







Cara Mengganti Background Blogger

Cara Mengganti Background Blogger

Halo para sobat, lagi-lagi kang fatur dateng lagi nie mao ngasih tips baru buat para sobat dan trik ini pernah ada yang minta sama kang fatur, kalau ga salah begini "Kang fatur gimana ya caranya mengganti Background blog saya seperti blognya kang fatur", kali ini kang fatur baru sempat posting trik ini karena banyak kesibukan soalnya komputer rentalan teman kang fatur banyak yang rusak hehe, jadi kang fatur di suruh nyervis dech, jadi cerita nie hehe. O.K para sobat khusunya sama yang pernah minta trik ini ma kang fatur kali ini kang fatur insyaAllah akan memberikan atau menjelaskan lngkah-langkahnya sampai dengan selesai.

Kang fatur tidak akan panjang lebar kita langsung aja ke pokok pembahasan O.K.

Seperti biasa masuk ke account blogger sobat Dashboard/dasbor Layout/tataletak, Edit HTML "JANGAN di CENTANG " Expand template widget nya ok!!
Lakukan backup dengan "download lengkap template" takut ada kekeliruan.
kemudian cari kode dibawah ini :

body {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align: center;
color: $textColor;
background : #000000;
font-family: arial,verdana,helvetica,tahoma,Sans-serif;
font-size: 100%;
width: 100%;
}

Perhatikan teks yang berwarna merah!! tambahkan dengan kode seperti dibawah ini :

url(http://ALAMAT URL GAMBAR SOBAT);

dan jangan lupa tambahkan pula kode yang ada di bawah ini

background-attachment: fixed;

dan letakan di bawah kode tersebut, atau kurang lebih akan terlihat seperti ini :

body {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align: center;
color: $textColor;
background: #ff0000 url(http://ALAMAT URL GAMBAR ANDA);
background-attachment: fixed;
font-family: arial,verdana,helvetica,tahoma,Sans-serif;
font-size: 100%;
width: 100%;
}

Untuk teks yang warna kuning bisa sobat pilih dari dua pilihan sebagai berikut :
Fixed : agar letak gambar background tetap/statis
Scroll : agar gambar background ikut bergerak/bergeser saat kita men-Scroll mouse kita.

dan jangan lupa klik tombol Save/Simpan Perubahan!! lihat hasilnya
Nah, mungkin hanya itu saja tips kali ini dari kang fatur mudah-mudahan bermanfaat di hati para sobat khusunya kepada yang pernah meminta. jangan lupa komentarnya O.K kang fatur mao nerusin nyervis lagi....







Membuat Daftar Isi Blog

Membuat Daftar Isi Blog

Hidup hanya sekali hiduplah yang berarti untuk berbagi, itulah kata orang tua yang selalu di ucapkan dikala menasihati anaknya.

Untuk itu kali ini kang fatur mao menuruti nasihat orang tua siapa tau ada barokahnya kepada kita semua khususnya para sobat blogger sekalian. Kali ini kang fatur mao bagi-bagi sesuatu yang mudah-mudahan bermanfaat di hati para sobat, "sesuatu" yang dimaksud kang fatur disini yaitu cara membuat "Daftar Isi" pada blog, dan insyaAllah tips kali ini tidak akan membuat para sobat pusing sampai membuka Edit HTML segala macam yang membutuhkan waktu lama, tapi tips dari kang fatur ini cupkup para sobat melakukan copy paste aja.

O.K kang fatur tidak kesana ke mari lagi kita langsung aja pada pokok pembahasan :


1. Seperti biasa LogIn ke blog para sobat
2. Klik Tab Layout
3. Klik Tab Page Element
4. Klik Add Gadget
5. Klik pilihan menu HTML/JavaScript
6. Pada kolom Content, pastekan script di bawah ini

<div style="border: 2px inset #ff0000; overflow: auto; height: 220px;">
<script style="text/javascript" src="http://adetea.fileave.com/daftar isi.js"></script>
<script style="text/javascript">
var numposts = 1000;
var showpostdate = false;
var showpostsummary = false;
var numchars = 100;
var standardstyling = true;
</script>
<script src="http://NAMABLOGSOBAT.blogspot.com/feeds/posts/default?
orderby=published&alt=json-in-script&max-results=999
&callback=showrecentposts"></script>
</div>

Teks yang bertuliskan NAMABLOGSOBAT ganti dengan url para sobat. Setelah selesai klik tombol Simpan, dan lihat hasilnya!! gampang kan???
Selamat mencoba, dan mudah-mudahan tips ini dapat membantu, janga lupa komenatarnya O.K


Photobucket








Efek Kembang Api di Halaman Blog

Efek Kembang Api di Halaman Blog

Pada sore hari ini kang fatur mao bagi-bagi rejeki nie malaupun yang ringan-ringan hehe, kali ini kang fatur mao bagiin cara mebmuat "EFEK KEMBANG API" mungkin tips ini udah banyak yang sudah posting dulu-dulu tapi mudah-mudahan para sobat blogger masih ada yang memerlukan tips ini.

Jika para sobat ingin lihat contohnya silahkan sobat klik disini atau disini.
Kalau para sobat tertarik untuk memasangnya, silahkan lakukan dengan langkah-langkah berikut ini :

1. Seperti biasa masuk ke account blogger sobat
2. Dashboard/dasbo
3. Layout/tataletak
4. Tambah gadget pilih HTML/Javascript

Lalu pastekan kode dibawah ini kedalamnya kotak yang tersedia :


<script src="http://www.geocities.com/teaade@ymail.com/apie.js" type="text/javascript">

/***********************************************
* Script featured & available at Dynamic Drive at http://www.dynamicdrive.com/
* Please keep this notice intact
***********************************************/
</script>


Setelah selesai klik tombol sipan dan lihat hasilnya!! mudah juga bukan???

"Jagan Lupa Comennya"





Kursor Bermesraan Dengan Teks

Kursor Bermesraan Dengan Teks

Halo para sobat kang fatur, yang pada alim alim ada berita hangat nie buat para sobat sekalian yaitu Kursor Bermesraan dengan Teks kaya gambar yang di samping tuuuch, nempel terus kaya perangko hehehe (berpacaran kali)

O.K para sobat kenapa kang fatur ambil judul seperti itu ya mungkin karena judul-judulnya sudah abis di pake ama sobat-sobat yang lain. lagi pula kang patur sengaja ambil judul seperti ini mungkin agar timbul rasa penasaran di hati para sobat dan penasarn ingin mencobanya (supaya nempel terus di blognya kang fatur gitu loooch).


O.K para sobat maksud dari judul postingan kang fatur kali ini yaitu : Kemanapun kursor kita (para sobat) gerakan, maka selalu ada teks yang dengan mesra mengikutinya baik ke atas, ke bawah maupun ke samping seperti yang ada di sini atau di sini.
Apakah para sobat ingin memasangnya??? O.K kalau para sobat berminat ingin memasangnya kang fatur mau langsung aja ke langkah-langkahnya :


  1. Seperti biasa sign ke Blogger.
  2. Pilih Tata Letak, Edit HTML, HTML/JavaScript.
  3. Copy seluruh kode dibawah ini dan paste pada kolom yang tersedia.
  4. Klik Tombol Simpan.
  5. Selesai.

"KODE YANG HARUS DICOPY"



<style type="text/css">
/* Circle Text Styles */
#outerCircleText {
/* Optional - DO NOT SET FONT-SIZE HERE, SET IT IN THE SCRIPT */
font-style: italic;
font-weight: bold;
font-family: 'comic sans ms', verdana, arial;
color: #000;
/* End Optional */

/* Start Required - Do Not Edit */
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
/* End Required */
/* End Circle Text Styles */
</style>
<script type="text/javascript">

/* Circling text trail- Tim Tilton
Website: http://www.tempermedia.com/
Visit: http://www.dynamicdrive.com/ for Original Source and tons of scripts
Modified Here for more flexibility and modern browser support
Modifications as first seen in http://www.dynamicdrive.com/forums/
username:jscheuer1 - This notice must remain for legal use
*/

;(function(){

// Your message here (QUOTED STRING)
var msg = "KANG FATUR TEA";

/* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */

// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)
var size = 24;

// Set both to 1 for plain circle, set one of them to 2 for oval
// Other numbers & decimals can have interesting effects, keep these low (0 to 3)
var circleY = 0.75; var circleX = 2;

// The larger this divisor, the smaller the spaces between letters
// (decimals allowed, not negative numbers)
var letter_spacing = 5;

// The larger this multiplier, the bigger the circle/oval
// (decimals allowed, not negative numbers, some rounding is applied)
var diameter = 10;

// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
var rotation = 0.4;

// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
var speed = 0.3;

////////////////////// Stop Editing //////////////////////

if (!window.addEventListener && !window.attachEvent || !document.createElement) return;

msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,

mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},

makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},

drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},

init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},

ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};

o.id = 'outerCircleText'; o.style.fontSize = size + 'px';

if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};

})();

</script>



PERHATIAN!!!

Tulisan yang berwarna mera silahkan para sobat ganti dengan nama sobat atau apa saja yang para sobat inginkan dan yang berwarna kuning sobat ganti dengan warna yang para sobat inginkan untuk kode warna silahkan klik disini.

Jika langkah langkah sudah selesai silahkan ekarang lihat hasilnya!! Gampang juga kan?? semoga bermanfaat bagi sobat. jangan lupa komentarnya.







Cara Pasang Flash di Blog

Cara Pasang Flash di Blog

Dalam perjalanan satu hari satu malam mengelilingi dunia lewat seperangkat komputer akhirnya kang fatur dateng lagi nie untuk bagi-bagi sesuatu kepada para sobat, kedatangan kang fatur kali ini yaitu untuk mengasih tahu bagi para sobat yang belum tahu, yaitu cara memasang flash di blogspot.

Buat para sobat yang masih bingung cara memasukkan flash atau gambar berekstensi.swf kedalam blog para sobat, seperti tulisan "selamat datang di .... " di blog ane ini, jangan kuatir ya ? atau lebih jelasnya liat aja di bagian header kang fatur tuuu di atas!! disini jawabannya ! perhatikan ya ?

Seperti biasa.... kita akan menggunakan cara yang Sangat Gampang aja alias instant aja daripada kita harus pusing buka tata Letak n Edit HTML gala sampai-sampai menghabiskan waktu dan uang untuk bayar perjam internet hehe

Seperti biasa....

1. Masuk ke Blog sobat
2. Klik Tab Tata Letak
3. Klik Tab Elemen Halaman
4. Klik Tambah Gadget
5. Klik pilihan menu HTML/JavaScript
6. Pastekan script di bawah ini ke dalam kolom konten tersebut

<embed pluginspage="http://www.macromedia.com/shockwave/download/index.cgi? P1_Prod_Version=ShockwaveFlash" quality="high" width="970" src="http://kang fatur ganteng.swf" wmode="transparent" height="160" type="application/x-shockwave-flash"></embed>

PERHATIAN!!!!!

Tulisan yang berwarna MERAH menunjukan alamat dimana file swf atau flash sobat !! dan tinggal diganti dengan URL atau alamat File Flash para sobat.

Misalnya sobat sudah memiliki URL dari file Flash yang telah ter-upload di suatu situs, ya tinggal diganti aja dengan alamat URL tersebut ! paham kan ????
Kalau belum memiliki file yang ter-upload, ya upload dulu gambar flash para sobat oceh !! banyak alamat untuk meng-upload file koq. Kalau kang fatur mah menggunakan jasa http://fileave.com/ . Kalau para sobat ya terserah cari aja di google !! banyak alamat situs penyedia layanan upload OK ? atau kalau males cari n kebetulan belum tahu klik aja disini atau disini

Masih lanjut soooob teruuuuus? masih ada sisa waktu seperapat lagi nyampe 4000

Oke..... Tulisan/angka yang berwarna GREEN menunjukkan seberapa lebar atau tingginya flash itu akan muncul pada halaman blog sobat yaitu dalam ukuran PX (pixel)!!!
Trus jangan Lupa klik tombol SAVE atau Simpan Perubahan dan Lihat Hasilnya........ !! sekarang para sobat sudah memiliki tayangan flash pada blog para sobat!!
dah ngertikan ayeuna rahasiana ? untuk supaya flash kita bagus dan gampang bikinnya ada softwarenya disini tinggal download.

Nah kalau dah ngerti and paham, silahkan di share dan di bagikan ilmu ini ke teman-teman yang lain, biar semua teman bisa menggunakan fasilitas tersebut. !! Jangan jadi orang pelit ya ? ga bagus ! apalagi kita bikin blog pada blogspot kan gratiss

Oceeh Selamat mencoba !! dan jangan lupa komentarnya??? mudah-mudahan bermanfaat