Senin, 29 Agustus 2011

Cara Memasang Menu Scroll di Blog


m kesempatan kali ini saya akan sedikit berbagi tips bagaimana cara membuat dan memasang menu scrool di blog. Adapun fungsi dan kegunaan menu ini adalah agar daftar list artikel yang kita posting tidak memakan tempat karena lebar dan panjang menu bisa kita sesuaikan dengan lebar space halaman blog.
Mari kita perhatikan bersama kode HTML untuk membuat menu ini :

<div style="overflow:auto; width:400px ; height:100px ;border:1px solid #eee;padding:8px;margin:10px 0 0">

<ul><li><a href="http://www.masbugie.com/2010/04/cara-membuat-teks-atau-tulisan-berwarna.html">Cara Membuat Teks Berwarna di Postingan Blog</a></li></ul>


<ul><li><a href="http://www.masbugie.com/2010/04/cara-membuat-tabel-dan-kolom.html">Cara Membuat Tabel dan Kolom Blog</a></li></ul>


<ul><li><a href="http://www.masbugie.com/2010/04/cara-membuat-teks-berjalan-di-tab-dan.html">Cara Membuat Teks Berjalan di Tab dan Navbar Atas</a></li></ul>


<ul><li><a href="http://www.masbugie.com/2010/04/shoutmix-vs-cbox-ala-newbie.html">ShoutMix Vs CBOX ala Newbie</a></li></ul>

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

Dan nantinya akan memiliki tampilan seperti dibawah ini :


Dan sekarang cara memasang widgets menu scrool di blog :

  1. Login Blogger
  2. Klik Tata Letak / Layout
  3. Dalam menu Elemen Laman klik Tambah Gadget / Add Widget
  4. Pilih HTML
  5. Copy Paste kode diatas kedalam Gadget HTML tersebut
  6. Ubah tulisan berwarna biru dan sesuaikan dengan ukuran dan alamat url postingan blog kalian yach...
  7. Klik Save
Selesai....


Gampang kan,, nah semoga aja informasi ini bermanfaat buat kalian semua.   Salam blogger, heheh :)

Cara Menambahkan Lagu di Blog

Kalian bisa memasang lagu kesukaan kalian di blog, pastinya blog kalian  jadi lebih menarik kan.  Namun adapun kelemahannya, yaitu blog kalian jadi lebih berat dan membutuhkan loading lebih lama untuk membukanya.
Tapi, untuk kalian yang tertarik untuk pasang lagu di blog bisa lakukan langkah-langkah berikut ini:
1.       Buka  situs layanan mp3 online
2.       Copy kode html yang tersedia


3.       Log-in ke akun blogger kamu
Pilih Dashboard  -> Tata letak -> pilih elemen Halaman -> Tambah Gadget
4.     

PilPilih html/java script


5.       Masukkan kode html yang kalian peroleh dari situs layanan mp3online ke dalam kotak html/java script

6.       Buka blog kamu, jika sukses maka akan muncul widget mp3 online di blog kamu. Untuk memulai lagu kamu bisa tekan tombol play seperti winamp saja. Untuk menyembunyikan playlist tekan PL.



Untuk membuat lagu sendiri agar menjadi background blog, dan akan memutar lagu secara tomatis ada panduannya di Cara Memasang Background Lagu Sendiri

Semoga aja informasi ini bermanfaat buat kalian semua,,  salam Blogger...... ;)

Cara Membuat Banner di Blog


Agar blog kita kelihatan lebih bagus dan dinamis, ada baiknya kita pasang banner di beberapa sidebar atau header blog kita. Banyak pengunjung blog yang langsung tertuju ke arah banner, apalagi jika kita punya banner yang interaktif dengan pengunjung. Biasanya akan di berikan kode html yang nantinya akan di pasang di blog kita.

Bagaimana cara memasang banner di blog kita...??, ikuti ya cara ny di bawah ini...



  • kunjungi alamat flashvortex ini, kemudian kamu pilih menu BANNER.
  • setelah itu kamu pilih banner yang kamu suka
  • isilah kolom teks yang tersedia dengan teks yang ingin kamu tampilkan
  • sesuaikanlah pengaturan yang kamu inginkan, seperti ukuran banner dan warna teks tsb.
  • setelah semua selesai, klik bagian GERERATE ANIMATION, dan copy kode html yang di tampilkan.
  • Log-in ke blogger dengan ID kamu
  • Klik Tata Letak, dan Edit Halaman
  • Kemudian klik yang bertuliskan Tambah Gadget, bisa di sidebar, header atau bagian bawah template.

add gadget
  • Kemudian pilih yang HTML/Java Script

image
  • Copy paste kode HTML sobat kedalamnya, sobat bisa menambahkan judul diatasnya jika mau.

insert html
  • Lalu klik Simpan.
  • Selesai.

Semoga aja informasi yang sederhana ini bermanfaat buat kalian ya,, terima kasih. Salam blogger....... hehehe

Cara Merubah Background Photo dengan Photoshop

Wat nax nax 3ipa5, yang masih belum ngerti cara ngerubah background photo aku kasih tutorial nya. simak baik baik yaaaaa............
1. Buka photo yang ingin di edit
2.Tekan ctrl+J untuk menduplikat gambar


3. Pilih magic wand tool untuk seleksi warna background


4.Jika warna biru telah di seleksi maka hasil nya akan seperti ini


5. Pilih warna yang di inginkan (misalkan merah), klik menu LAYER pilih NEW FILL LAYER,dan SOLID colour
6. hasilnya akan seperti ini


7. selesai deh, mudahkan....


semoga kalian bisa mempraktekan nya ya,, salam blogger.... hahahaha

Cara Mengganti Tema Blog

Bagi kalian yang masih bingung mengganti tema blog,, nih saya kasih tutorial nya,,,,


1. kamu download dulu tema yang kamu suka di zoom template ato di sini juga bisa blogtemplate4u,,,, setelah itu 2. kamu klik tema yang kamu suka.....
3. setelah di download, extrak dulu file tersebut dengan winrar ato winzip...
4. buka folder hasil extrak tsb
5. kemudian km klik file yg bertanda panah seperti berikut 


6. copy kode html yang ada di sebelah kanan (pada gambar).
7. paste-kan di blog km. tapi sebelum di paste, km hapus dulu kode HTML yang ada di sana.
8.Untuk paste kode HTML caranya  login ke blog km, klik  rancangan, pilih edit html. paste kan di situ. seperti gambar berikut


9. Klik pratinjau untuk melihat hasil sementara, jika menurut kamu hasilnya bagus klik  simpan. Selesai deh..


Nah mudah kan mengganti tema ny,, semoga saja postingan ini bermanfaat buat km.    klu mnurut kamu postingan ini bermanfaat, kasih komentar ya atau follow aja.  TerimaKasih,, Salam Blogger,,,,,,,,,

Membuat Desain Tiga Kolom Di Blog

Secara default semua template yang disediakan Blogger hanya memiliki dua kolom: satu kolom utama dan satu sidebar (kolom samping). Pada tulisan ini saya akan memberikan tips memodifikasi template tersebut menjadi tiga kolom: satu kolom utama dan duasidebar. Dengan tiga kolom anda lebih leluasa untuk menempatkan berbagai fungsi tambahan, widget, hingga kode html/javascript untuk menambah fungsionalitas blog anda.

Langkah-langkah:
Sebelum mengubah apapun, pastikan untuk membuat backup templat asli. Setelah login, pada Dashboard Blogger klik Layout > Template > Edit HTML. Klik pada tulisan “Download Full Template” untuk menyimpan backup templat dalam file .xml di komputer anda.
Kini arahkan perhatian ke script CSS yang terdapat pada kotak. Scroll ke bawah tampilan script hingga anda menemukan baris berikut:
#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}
#main-wrapper {
width: 410px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
Kopi blok script Sidebar-Wrapper, lalu paste di bagian bawahnya. Jangan lupa ganti namanya dengan nama lain, misalnya Newsidebar-wrapper, sehingga keseluruhan baris di atas menjadi seperti ini (script tambahan saya beri warna merah):
#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}
#main-wrapper {
width: 410px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#newsidebar-wrapper {
width: 150px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
Pada properti float, anda dapat mengubah nilainya menjadi left atauright. Jika anda ingin tampilan sidebar mengapit bagian utama (main-wrapper), beri newsidebar nilai float: left. Artinya dia akan ditempatkan di sisi kiri halaman. Dan sebaliknya.
Anda dapat pula mengutak-atik lebar masing-masing komponen dengan mengubah nilai width. Misal, anda ingin melebarkan tampilan main-wrapper, pada blok main-wrapper ubah nilai default width: 410px menjadi, misalnya, 500px.
Setelah mengubah script tampilan blog, anda juga perlu mengubah tampilan Layout Editor untuk menyesuaikannya. Cari baris kode berikut:
/** Page structure tweaks for layout editor wireframe */
body#layout #header {
margin-left: 0px;
margin-right: 0px;
}
Tambahkan baris kode berikut tepat di bawahnya:
body#layout #outer-wrapper,
body#layout #header-wrapper,
body#layout #footer {
width: 750px;
padding: 0px;
}
body#layout #main-wrapper {
width: 400px;
margin-left: 20px;
}
body#layout #sidebar-wrapper,
body#layout #newsidebar-wrapper {
width: 150px;
}
Sehingga menjadi seperti ini:
/** Page structure tweaks for layout editor wireframe */
body#layout #header {
margin-left: 0px;
margin-right: 0px;
}
body#layout #outer-wrapper,
body#layout #header-wrapper,
body#layout #footer {
width: 750px;
padding: 0px;
}

body#layout #main-wrapper {
width: 400px;
margin-left: 20px;
}
body#layout #sidebar-wrapper,
body#layout #newsidebar-wrapper {
width: 150px;
}
Script di atas berfungsi untuk mengubah Layout Editor sehingga untuk selanjutnya anda lebih mudah menambahkan widget dsb, tidak harus repot kembali berurusan dengan kode-kode CSS. Layout editor akan berubah menjadi tiga kolom pula seperti ini:
layout editor
Setelah itu cari baris kode berikut (berada hampir di bagian paling bawah script):
<div id=’main-wrapper’>
<b:section class=’main’ id=’main’ showaddelement=’no’>
<b:widget id=’Blog1′ locked=’true’ title=’Blog Posts’ type=’Blog’/>
</b:section>
</div>
<div id=’sidebar-wrapper’>
<b:section class=’sidebar’ id=’sidebar’ preferred=’yes’/>
</div>
Tambahkan script berikut di atas div id=’main-wrapper’:
<div id=’newsidebar-wrapper’>
<b:section class=’sidebar’ id=’newsidebar’ preferred=’yes’>
<b:widget id=’NewProfile’ locked=’false’ title=’About Me’ type=’Profile’/>
</b:section>
</div>
Sehingga keseluruhan blok script di atas menjadi:
<div id=’newsidebar-wrapper’>
<b:section class=’sidebar’ id=’newsidebar’ preferred=’yes’>
<b:widget id=’NewProfile’ locked=’false’ title=’About Me’ type=’Profile’/>
</b:section>
</div>
<div id=’main-wrapper’>
<b:section class=’main’ id=’main’ showaddelement=’no’>
<b:widget id=’Blog1′ locked=’true’ title=’Blog Posts’ type=’Blog’/>
</b:section>
</div>
<div id=’sidebar-wrapper’>
<b:section class=’sidebar’ id=’sidebar’ preferred=’yes’/>
</div>
Selalu klik tombol “Preview” untuk melihat perubahan tampilan blog anda. Jika puas, baru klik “Save Change” untuk menyimpan perubahan yang anda buat secara permanen. Kini blog anda di Blogger manjadi tiga kolom!!
Sebagai gambaran, berikut blog eksperimental saya di blogger yang telah saya modifikasi menjadi tiga kolom (dari mula-mula templat minima):
Lihat kode HTML/CSS-nya (pada Mozilla Firefox: klik kanan > View Page Source) jika ingin mengevaluasi modifikasi script yang saya buat.
Jika anda tidak mau repot, di internet banyak terdapat situs yang menawarkan templat blogger tiga kolom gratisan. Cari dengan Google. Tutorial ini hanya ditujukan buat anda yang ingin ‘maju‘ dengan memodifikasi sendiri sekaligus belajar melakukan tweak HTML/CSS secara mandiri. Menyenangkan loh, kalau bisa melakukan sendiri!
Salam,

Membuat Menu Navigasi Horizontal dengan Sub Menu Navigasi Vertikal « Tutorial Blog dan SEO


Mumpung mood lagi bagus,mumpung doku lagi tebel dan mumpung blog lagi sepi,saya mencoba untuk memposting kembali kaitannya belajar menghias blog.
Bukan suatu kesengajaan,menu navigasi dengan sub menu ini juga saya peroleh dari hasil surfing berbagai blog tutorial untuk blogspot.

Bagi kamu yang penasaran bagaimana cara membuat menu navigasi dengan sub menu,bisa ikuti langkah berikkut ini.


Langkah dan Cara Membuat Menu Navigasi dengan Sub Menu Untuk Blogger

  • Pertama,pergilah ke Dashboard  blog yang akan anda beri menu navigasi dengan sub menu ini.

  • Selanjutnya pilih tab Edit Html 
  • Setelah itu,contreng tulisan / checkbox 'Expand Widget Templates' (Gb.3).
setelah itu carilah kode seperti ini ]]></b:skin> (Gunakan Ctrl+F pada keyboard untuk mempermudah pencarian),setelah ketemu letakkan kode dibawah ini tepat diatas kode]]></b:skin> tersebut.

  • #NavbarMenu { background: #000; width: 400px; height: 10px; font-size: 11px; font-family: Trebuchet MS, Tahoma, Verdana; color: #fff; margin: 0px; padding: 0px; } #NavbarMenuleft { width: 400px; float: left; margin: 0; padding: 0; } #nav { margin: 0; padding: 0; } #nav ul { float: left; list-style: none; margin: 0; padding: 0; } #nav li { list-style: none; margin: 0; padding: 0; } #nav li a, #nav li a:link, #nav li a:visited { background: #222222; height: 15px; color: #fff; display: block; font-size: 11px; font-family: trebuchet ms, ; text-transform: none; text-decoration: none; margin: 0; padding-top:6px; padding-bottom:5px; padding-left:13px; padding-right:13px; border-right: 1px solid #000; } #nav li a:hover, #nav li a:active {background: #222222; color: #ffffff; margin: 0; padding-top:6px; padding-bottom:5px; padding-left:13px; padding-right:13px; text-decoration: none; } #nav li li a, #nav li li a:link, #nav li li a:visited { background: #ffffff; width: 150px; color: #222222; font-size: 11px; font-family: trebuchet ms,; font-weight: normal; text-transform: none; float: none; margin: 0; padding: 7px 10px; border: 1px solid #000; } #nav li li a:hover, #nav li li a:active { background: #222222; color: #ffffff; padding: 7px 10px; } #nav li { float: left; padding: 0; } #nav li ul { z-index: 9999; position: absolute; left: -999em; height: auto; width: 170px; margin: 0; padding: 0; } #nav li ul a { width: 140px; } #nav li ul ul { margin: -32px 0 0 171px; } #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul { left: -999em; } #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { left: auto; } #nav li:hover, #nav li.sfhover { position: static; }
  • Setelah itu Simpan Templates.
  • Sekarang giliran kita menentukan dimana tempat menu navigasi submenu ini akan kita letakkan.
  • Pilih Tab Rancangan / Tata Letak pada Dashboard blog anda,seperti (Gb.1),selanjutnya klik tulisan 'Add New Widget / Tambah Gadget'(Gb.4),dan pilihlah Html / Javascript(Gb.5)

  • Setelah itu letakkan kode berikut pada widget HTML / Javascript tersebut.

    <div class='menuhorisontal'>
    <ul id='nav'>

    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Utama Ganti Sesuai Keinginan</a>
    <ul>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'></ul> </li>

    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>

    <li><a href='http://tulis_alamat_url_tujuan'>Utama Ganti Sesuai Keinginan</a>
    <ul>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    </ul> </li>
    <li><a href='http://tulis_alamat_url_tujuan'>Ganti Sesuai Keinginan</a> </li>
    </ul>
    </div>
  • Lalu simpan,selesai dan lihat hasilnya :D

** Untuk http://tulis_alamat_url_tujuan gantilah sesuai tujuan kamu kemana link akan diarahkan,misal;
http://pelajaran-blog.blogspot.com/2009/03/membuat-menu-navigasi-css-di-element.html dan tulisan Ganti Sesuai Keinginan gantilah denga keterangannya,misal dengan keteranganMembuat Navigasi Css dengan Sub Menu,maka dalam penulisannya;
<li><a href='http://pelajaran-blog.blogspot.com/2009/03/membuat-menu-navigasi-css-di-element.html'>Membuat Navigasi Css dengan Sub Menu</a> </li>


Klik tombol 'Buat Popular Post' di bawah ini jika anda merasa konten/postingan yang sedang anda baca sangat menarik dan bermanfaat bagi anda.

Cara Membuat Menu Bar

Cara Membuat Menu bar di Blog, Dimana kita lihat tidak semua tamplate yang menyediakan Menu bar ini. Contohnya saja Tamplate bawaan blogger sendiri. Menu bar ini sebenarnya sama saja seperti Menu Label bawaan blogger tetapi bawaan blogger letak nya di belahan sidebar.juga bisa kita lihat menu label bawaan blogger membutuh tempat, kelihatan nya kurang menarik. Nah untuk teman yang ingin menambah Asesories menu bar ini tentu saja bisa. dengan bantuan kode script ke dalam tamplate anda. Menu bar ini terletak di bawah Header. Mau tau Bagaimana cara Membuat Menu bar nya??? Ikuti cara-cara di bawah ini. Baca Cara menambah Search Engine pada menubar

Berikut langkah-langkah cara Membuat menu bar di blog anda:


  • Login terlebih dahulu ke blogger
  • Klik Tata Letak
  • Edit HTML
  • Cari kode ]]></b:skin>
  • Kemudian Copy Paste kode di bawah ini persis diatas kode ]]></b:skin>

    #NavbarMenu
    {
    background:#ccc;
    width:968px;
    height:32px;
    color:#FFF;
    font:bold 8px Arial, Tahoma, Verdana;
    clear:both;
    margin:0 auto;
    padding:0}
    #NavbarMenuleft
    {

    width:955px;
    float:left;
    margin:0;
    padding:0
    }

    #nav li
    {
    list-style:none;
    float:left;
    margin:0;
    padding:0
    }

    #nav li a,#nav li a:link,#nav li a:visited
    {
    color:#fff;
    display:block;
    text-transform:capitalize;
    font:normal 12px Georgia, Times New Roman;
    margin:0;
    padding:12px 11px 8px
    }

    #nav li a:hover,#nav li a:active
    {
    background:#ccc;
    color:#FFF;
    text-decoration:none;
    border-right:1px solid #296204;
    border-bottom:1px solid #296204;
    border-left:1px solid #296204;
    margin:0;
    padding:12px 9px 8px
    }

    #nav li li a,#nav li li a:link,#nav li li a:visited
    {
    background:#ccc;
    width:200px;
    color:#fff;
    text-transform:capitalize;
    float:none;
    border-bottom:1px solid #0d2601;
    border-left:1px solid #0d2601;
    border-right:1px solid #0d2601;
    font:normal 14px Georgia, Times New Roman;
    margin:0;
    padding:7px 10px
    }

    #nav li li a:hover,#nav li li a:active
    {
    background:#184303;
    color:#fff;
    padding:7px 10px
    }

    #nav li a.enclose,#nav li a.enclose:visited
    {
    border-top:1px solid #000
    }

    #nav li ul
    {
    z-index:9999;
    position:absolute;
    left:-999em;
    height:auto;
    width:170px;
    margin:0;
    padding:0
    }

    #nav li ul a
    {
    width:140px
    }

    #nav li ul ul
    {
    margin:-75px 0 0 171px
    }

    #nav li:hover ul ul,#nav li:hover ul ul ul,#nav li.sfhover ul ul,#nav li.sfhover ul ul ul
    {
    left:-999em
    }

    #nav li:hover ul,#nav li li:hover ul,#nav li li li:hover ul,#nav li.sfhover ul,#nav li li.sfhover ul,#nav li li li.sfhover ul
    {
    left:auto
    }

    #nav li:hover,#nav li.sfhover
    {
    position:static
    }

    #subnavbar
    {
    background:#004313;
    width:968px;
    height:24px;
    color:#FFF;
    margin:0;
    padding:0
    }

    #subnav li a,#subnav li a:link,#subnav li a:visited
    {
    color:#f9fc01;
    display:block;
    font-size:11px;
    text-transform:capitalize;
    margin:0 5px 0 0;
    padding:3px 13px
    }

    #subnav li a:hover,#subnav li a:active
    {
    color:#DCD900;
    display:block;
    text-decoration:none;
    margin:0 5px 0 0;
    padding:3px 13px
    }

    #nav ul,#subnav ul,#subnav li
    {
    float:left;
    list-style:none;
    margin:0;
    padding:0
    }

    *,#nav,#subnav
    {
    margin:0;
    padding:0
    }



  • Kemudian cari kode
    <div id='header-wrapper'>
    <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
    <b:section class='headerright' id='headerright' preferred='no'>
    <b:widget id='HTML3' locked='false' title='' type='HTML'/>
    </b:section>
    </div>

    Cari Berdasarkan <div id='header-wrapper'>






  • Kemudian Copy paste kode di bawah ini di bawah kode tersebut
    <div id='NavbarMenu'>
    <div id='NavbarMenuleft'>
    <ul id='nav'>
    <li><a expr:href='data:blog.homepageUrl' title='This Blog Address'>Beranda</a></li>
    <li><a href='http://jayaputrasbloq.blogspot.com/2009/12/informasi-pemasangan-iklan.html'><b>Pasang Iklan</b></a></li>
    <li><a href='http://jayaputrasbloq.blogspot.com/2009/12/cara-menghasilkan-uang-dari-blog-anda.html' title='This Bisnis Online'>Bisnis Online</a></li>
    <li><a href='http://jayaputrasbloq.blogspot.com/search/label/Template%20Design' title='This tamplate design'>Template Design</a></li>
    <li><a href='http://jayaputrasbloq.blogspot.com/search/label/Twitter' title='This twitter'>Tutorial Twitter</a></li>
    </ul></div>
    </div>






  • Ganti Alamat link diatas yang berwarna merah dan biru dengan link yang anda miliki




  • Kemudian Simpan tamplate anda dan lihat hasilnya





    • Selamat mencoba......

      Membuat Kata Penutup di Blog

      Kata penutup di Blog merupakan salah satu trik dari pemilik blog atau admin untuk menyampaikan suatu pesan terima kasih kepada para pengunjungnya karena telah membuka blognya. Anda pasti sudah pahamkan maksud saya mengenai penutup blog itu. Script ini saya coba di Blogspot dan belum saya praktekkan di Wordpress.

      Cara buatnya :

      1. Login ke account blogger anda.
      2. Klik Layout --> Edit HTML.
      3. Cari kode </head> di dalam template anda. Tekan ctrl + F untuk menemukan kode </head>, lalu enter.
      4. Copy pastekan script di bawah ini tepat dibawah kode </head> :



      script type='text/javascript'>
      // goodbye alert
      function goodbye(){
      alert('Bagaimana Pendapat Anda Tentang Blog Saya ? Silahkan Kembali dan Beri Komentar Anda! Terimah Kasih !!');
      }
      parent.window.onunload=goodbye;

      </script>



      5. Klik Simpan Template.

      Silahkan ganti teks (Bagaimana Pendapat Anda Tentang Blog Saya ? Silahkan Kembali dan Beri Komentar Anda! Terimah Kasih !!) dengan teks anda sendiri.

      Membuat Kata Sambutan di Blog

      Agak sedikit mirip dengan Kata untuk penutup blog, tips membuat kata sambutan bagi pengunjung blog sebelum pengunjung masuk ke halaman blog anda, trik ini hanyalah trik untuk menyambut kedatangan tamu blog dengan kata2 sambutan dari anda sebagai admin blog. Ada dua type kata sambutan yang bisa anda gunakan pertama berupa kata sambutan dari admin blog dan kedua adalah kata sambutan dari admin berupa pertanyaan dari admin mengenai pengunjung blog anda. Jika ingin mencoba menggunakan tips ini silahkan ikuti petunjuknya :

      Kata Sambuatan model 1, yaitu berupa kata sambutan dari Anda :

      1. Login ke account blogger anda.
      2. Klik Layout --> Edit HTML.
      3. Cari kode </head> di dalam template anda. Tekan ctrl + F untuk mencari kode </head>, lalu enter.
      4. Copy pastekan script di bawah ini tepat diatas kode </head> :



      <SCRIPT language='JavaScript'>alert("WellCome To Seby-Antoe.Com(Silahkan baca baca ya !!)");</SCRIPT>


      Keterangan :
      + Ganti tulisan yg warna merah pada script dengan kata kata anda sendiri

      5. Kemudian klik Simpan Template.

       
      Photography Templates | Slideshow Software