Cara Memasang Sitemap di Google Untuk Mempercepat Proses Index

Cara Memasang SiteMap di Google Untuk Mempercepat Index - SiteMap yang dimaksud disini bukan halaman tentang seluruh isi judul artikel blog yang dirangkum dalam satu Postingan, tapi Sitemap atau peta situs yang nanti akan di pasang di Google Webmaster. Ini dilakukan untuk mempercepat proses Index robot google pada artikel kita, tanpa melewatkan satu artikel pun.

Anda harus wajip melakukan ini supaya artikel anda cepat muncul di mesin pencari, dan Untuk membuat dan memasang Site map yang harus anda lakukan adalah ;

1. Masuk ke Webmaster Google, dan pastikan blog anda sudah terdaftar di webmaster
2. Pada halaman awal, klik url blog anda yang terdaftar di webmaster
3. Kemudian pilih Perayapan > Peta Situs > Tambahkan/Uji Peta situs (Submit Sitemap)

4. Pada kolom sitemap isi dengan feed atom.xml dibawah ini :

atom.xml?redirect=false&start-index=1&max-results=500

Jika artikel anda sudah melebihi 500, ganti dengan 1000.

5. Jika sudah klik Mengirim peta situs

Setelah anda selesai mensubmit sitemap akan ada pemberitahuan bawha sitemap anda telah terkirim, setelah itu anda hanya tinggal menunggu proses index kurang lebih satu hari. untuk lebih detailnya klik Check untuk melihat hasil Uji peta situs anda.

Penting nya cara ini adalah untuk lebih memaksimalkan pengindex di Google, supaya artikel kita cepat muncul di mesin pencari tanpa harus menunggu lama. Semoga bermanfaat..

Read More

Cara Membuat Efek Teks Tulisan Berjalan (Marquee) di Blog

Cara Membuat Efek Teks Tulisan Berjalan (Marquee) di Blog - Artikel ini merupakan panduan dasar dalam memberikan pernak-pernik untuk sebuah blog. Teks tulisan berjalan termasuk beberapa pernak pernik yang sering digunakan untuk memberikan tampilan beda untuk sebuah teks atau tulisan bahkan artikel pun bisa dibuat berjalan. Teks tulisan berjalan di blog biasanya disebut dengan Marquee. Jika diartikan dengan fungsinya, marquee tidak memiliki keterkaitan karena arti dari marquee sendiri adalah Tenda Besar dan bukan teks tulisan berjalan. Mungkin marquee merupakan bahasa pemograman yang memiliki arti teks tulisan berjalan, tapi entahlah yang penting yang saya tahu marquee memiliki fungsi agar teks tulisan didalam blog memiliki efek bergerak atau berjalan.

Teks tulisan berjalan atau marquee biasanya ditempatkan dibagian atas atau bawah blog dan sedikit sekali yang memasangnya dibagian sidebar atau bagian kanan kiri blog. Membuat tulisan teks berjalan dengan fungsi marquee ini memiliki beberapa efek kriteria atau karakteristik dalam tampilannya. Seperti efek berjalan secara umum, berjalan dengan efek berkedip, dan berjalan dengan efek berhenti jika disorot dengan kursor. Beberapa efek tersebut bisa anda lihat seperti Demo berikut ini

Tek Tulisan Berjalan Dari Kanan Ke Kiri
Tek Tulisan Berjalan Dari Kiri Ke Kanan
Tek Tulisan Berjalan Dari Kiri Ke Kanan Berkedip

Lalu bagiamana cara membuat tek tulisan berjalan di blog dengan beberapa efek selain seperti pada Demo yang saya pasang diatas? Untuk membuat efek marquee pada tulisan teks di blog, silahkan pilih beberapa efek teks tulisan berjalan berikut ini

Kode :

<marquee direction="left" scrollamount="2" align="center">Teks Tulisan Berjalan Dari Kanan Ke Kiri</marquee>

Kode :

<marquee direction="right" scrollamount="2" align="center">Teks Tulisan Berjalan Dari Kiri Ke Kanan</marquee>

Kode :

<marquee direction="right" scrollamount="2" align="center"><blink>Teks Tulisan Berjalan Dari Kiri Ke Kanan Berkedip</blink></marquee>

Kode :

<marquee direction="left" scrollamount="2" align="center" behavior="alternate">Teks Tulisan Berjalan Bolak Balik Dari Kiri Ke Kanan</marquee>

Kode :

<marquee direction="right" scrollamount="2" align="center" behavior="alternate">Teks Tulisan Berjalan Bolak Balik Dari Kanan Ke Kiri</marquee>

Kode :

<marquee direction="down" scrollamount="2" align="center">Teks Tulisan Berjalan Dari Atas Ke Bawah</marquee>

Kode :

<marquee direction="up" scrollamount="2" align="center">Teks Tulisan Berjalan Dari Bawah Ke Atas</marquee>

Kode :

<marquee direction="up" scrollamount="2" align="center" behavior="alternate">Teks Tulisan Berjalan Bolak Balik Dari Atas Ke Bawah</marquee>

Kode :

<marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right" behavior="alternate">Teks Tulisan Berjalan Zig Zag</marquee></marquee>

Kode :

<marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right">Teks Tulisan Berjalan Zig Zag</marquee></marquee>

Kode :

<marquee onmouseover="this.stop()" onmouseout="this.start() " scrollamount="2" direction="up" width="100%" height="100" align="center">Teks Tulisan Berjalan Berhenti Jika Disorot oleh Kursor Mouse</marquee>

Kode :

<marquee onmouseover="this.stop()" onmouseout="this.start() " scrollamount="2" direction="right" width="100%" height="100" align="center"><a href="/">Teks Tulisan Berjalan Dengan Link Url</a></marquee>

Keterangan :
Direction : Mengatur arah gerakan teks (left, right, up dan down)
Scrollmount : Mengatur kecepatan gerakan. semakin tinggin nilainya semakin cepat
Align : Mengatur posisi teks (left, right, center, justify)
Behavior : Mengatur gerakan teks (scroll, slide, alternate)

Setelah anda memilih atau membuat efek tek tulisan sendiri, untuk memasangnya didalam blog, silahkan salin saya kode-kode yang telah saya tulisa diatas.
Anda bisa memasang efek teks tulisan berjalan tersebut dimanapun yang anda inginkan termasuk didalam postingan atau didalam artikel blog anda. Suka-suka andalah mau dipasang dimana, okey? Jika ada pertanyaan, mari kita diskusikan bersama dengan meninggalkan komentar untuk artikel ini Cara Membuat Teks Tulisan Berjalan (Marquee) di Blog

Read More

Cara buat Kolom Komentar Facebook di Blog

Cara Membuat Kolom Komentar Facebook di Blog yang saya tulis ini adalah sekian cara yang telah ada dan dibahas oleh teman-teman blogger tanah air dan mungkin cara yang saya buat ini adalah cara termudah dalam membuat kolom komentar facebook di blog. Kenapa saya bilang mudah? Karena hanya sedikit kode-kode yang perlu ditambahkan kedalam halaman pengeditan template blog anda. Cara membuat kolom komentar Facebook di blog ini telah saya terapkan kedalam blog saya sendiri tapi bukan di blog ini karena sudah banyak kode-kode yang telah saya pasang untuk blog ini.

Sebelum melanjutkan pembahasan mengenai cara membuat kolom komentar Facebook di blog ini, sedikit perlu saya jelaskan manfaat adanya kolom komentar Facebook di blog yaitu akan meningkatkan jumlah pengunjung blog anda melalui Facebook. Kok bisa? Karena setiap anda berkomentar maka komentar anda akan tampil di halaman beranda (biasanya ada di sidebar sebelah kanan Facebook) facebookers yang lain dan jika facebookers tersebut membaca update-an komentar anda dan mengkilk tautan komentar tersebut maka secara langsung facebookers tersebut akan diarahkan ke blog anda. Tapi ingat! kolom komentar Facebook di blog ini akan berfungsi maksimal jika yang berkomentar sedang dalam keadaan aktif dengan akun facebooknya atau tidak mencentang Post to Facebook yang ada didalam kolom komentar.

Okey, dan berikut cara membuat kolom komentar Facebook di blog

1. Buatlah sebuah aplikasi yang akan mengintegrasikan blog anda dengan Facebook. Untuk membuatnya, silahkan baca Cara membuat aplikasi Facebook
2. Jika sudah selesai membuat aplikasi facebooknya, buka akun blogger anda
3. Pilih menu Template >> Edit Html >> centang Expand Template Widget >> tekan tombol Ctrl+F di keyboard
4. Cari kode <b:skin><![CDATA[ dan tambahkan kode berikut sebelum atau diatas <b:skin><![CDATA[
   

   <meta content='profil.sriwahyuni' property='fb:admins'/>
   <meta content='259054834227698' property='fb:app_id'/>
   <script src='http://code.jquery.com/jquery-latest.js'/>
   <script src='http://panduan-template-blog-id.googlecode.com/files/CommentPages.js'/>
   <script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>

   
   
   Keterangan
   • Ganti profil.sriwahyuni dengan nama akun Facebook anda
   • Ganti 259054834227698 dengan ID Aplikasi Facebook anda yang telah anda buat
5. Cari kode <div class='post-footer-line post-footer-line-3'/> dan tambahkan kode berikut tepat dibawah <div class='post-footer-line post-footer-line-3'/>
   

   <b:if cond='data:blog.pageType == &quot;item&quot;'>
   <div class='fb-comments' data-num-posts='10' data-width='550' expr:data-href='data:post.url'/>
   </b:if>

   
   
   Keterangan
   • data-num-posts='10' merupakan jumlah komentar yang tampil. Silahkan anda ganti jika ingin menampilkannya lebih banyak
   • data-width='550' merupakan lebar kolom komentar. Silahkan diganti dengan menyesuaikan lebar area postingan blog. Bukan lebar blog
6. Selesai dan simpan Template blog anda. Lihat hasilnya di bagian bawah artikel atau diatas kolom komentar Blogspot

Itulah cara termudah dalam menampilkan atau membuat kolom komentar Facebook di blog. Jika ada yang pertanyaan, mari kita diskusikan bersama dengan meninggalkan komentar untuk artikel ini, Cara Membuat Kolom Komentar Facebook di Blog

Read More

Cara Membuat Aplikasi Facebook

Panduan Cara Membuat Aplikasi Facebook - Facebook merupakan sebuah media yang sangat komplit dengan fitur-fitur yang serba ada yang dapat digunakan oleh semua pengguna Facebook baik secara gratis ataupun berbayar. Orang yang telah mahir dalam menggunakan Facebook tidak serta merta dia hanya menggunakan Facebook sebagai media sosial seperti umumnya tapi dia akan lebih mengoptimalkan keberadaan Facebook ini untuk kepentingan-kepentingan yang akan memberikan keuntungan lebih baginya. Tentunya bukan sebagai media penipuan!

Salah satu fitur yang banyak digunakan oleh pengguna Facebook profesional adalah sebuah halaman Developer yang digunakan untuk membuat beberapa aplikasi tertentu yang bisa diintegrasikan dengan sebuah situs atau web blog. Salah satu aplikasi Facebook yang akan saya bahas adalah aplikasi komentar Facebook yang akan dipasang sebagai komentar di blog dengan hanya mengambil sebagain kecil dari aplikasi ini. Sebenarnya apalikasi Facebook ini tidak hanya digunakan untuk membuat kolom komentar Facebook di blog saja tapi pada tingkatan lebih lanjut, aplikasi ini akan lebih bermanfaat. Salah satunya adalah membuat blog di Facebook!

Okey, Berikut cara membuat aplikasi Facebook

1. Masuk (log in) ke akun Facebook anda atau langsung menuju ke https://developers.facebook.com/apps
2. Jika halaman aplikasi sudah terbuka. Facebook akan meminta untuk memasukkan password lagi, silahkan masukkan lagi passwordnya
3. Klik tombol Create New App seperti tampilan gambar berikut ini
   
4. Isi beberapa kolom seperti gambar berikut ini
   
   
   Keterangan
   • AppName : Isi dengan nama aplikasi anda. Gunakan nama yang valid dan jangan menggunakan nama dari nama-nama merek terdaftar
   • AppNamespace : Isi dengan nama yang sesuai dengan keinginan anda. Ini digunakan sebagai alamat space dari aplikasi anda yaitu http://app.facebook.com/namaspaceanda
   • WebHosting : Jangan dicentang
   Kalau sudah selesai mengisi kolom diatas, silahkan klik Lanjutkan
5. Pemeriksaan Keamanan. Silahkan masukkan kode captchanya
   
6. Akan muncul tampilan seperti berikut ini
   
   
   Keterangan
   • AppID : ID Aplikasi Facebook yang telah anda buat
   • AppSecret : ID Aplikasi khusus (tidak perlu dijelaskan)
   Silahkan anda salin dan simpan ID aplikasi Facebook anda
7. Selanjutnya isi beberapa kolom yang ada dibawahnya kolom ID aplikasi Facebook (kolom Informasi Umum), seperti yang terlihat pada gambar berikut ini
   
   Dari gambar diatas, anda hanya perlu menambahkan alamat Url blog anda di bagian kolom Situs web dengan Masuk Log Facebook >> Site URL
8. Klik Simpan Perubahan

Kini anda sudah memiliki sebuah aplikasi di Facebook yang bisa anda gunakan untuk keperluan anda dan untuk sementara ini, anda hanya membutuhkan ID Aplikasi Facebook anda untuk membuat kolom komentar di Facebook yang telah saya jelaskan.

Itulah cara membuat aplikasi Facebook sederhana. jika anda pertanyaan atau kesalahan dalam penulisan panduan ini, silahkan tinggalkan komentar anda di artikel ini, Panduan Cara Membuat Applikasi Facebook

Read More

Membuat Navigasi Menu Fixed Full RotateX

Membuat Navigasi Menu Fixed Full RotateX - Seperti yang terlihat pada umumnya di blog, Membuat Menu Navigasi akan dapat merangkum beberapa file atau tulisan anda yang tersusun dengan rapi dalam satu paket yaitu Menu Navigasi. Melanjutkan pembahasan sebelumnya tentang Membuat Menu Wrapper Melayang Di Atas Blog, saya menambahkan beberapa menu yang terletak diatas header dengan menggunakan Fixed Full RotateX seperti yang terlihat diatas header blog ini.

Kode Fixed bertujuan bilamana fungsi scroll mouse digeser menu tesebut akan tetap berada di posisi semestinya karena tidak akan ikut bergeser mengikuti arah scroll, sehingga walau pengunjung berada atau diposisi kolom komentar masih dapat melihat menu tersebut, sedangkan Full RotateX merupakan gaya untuk memanggil drop down menu apabila salah satu menu terlintas oleh scroll mouse.

Apabila ingin Membuat Navigasi Menu Fixed Full RotateX di blog, berikut kode CSS dan HTML yang dapat anda copy untuk keindahan blog anda :

#menufixed {position:fixed;top:0;left:0;width:100%;height:40px;z-index:999;}
.menu3Dflip {border-bottom:2px solid #cecece;margin:0 auto; text-align:center; position:relative; height:40px; z-index:999; background:#0091d6; -moz-perspective: 100px; -webkit-perspective: 100px; -o-perspective: 100px; perspective: 100px; }
.menu3Dflip ul.nav li {display:inline-block; display:inline;}
.menu3Dflip ul.nav {padding:0; margin:0; list-style:none; display:inline-block; -moz-transform-style: preserve-3d; -webkit-transform-style: preserve-3d; -o-transform-style: preserve-3d; transform-style: preserve-3d; }
.menu3Dflip ul.nav li {float:left; display:block; padding:0 4px;}
.menu3Dflip ul.nav > li {-moz-transform-style: preserve-3d;-webkit-transform-style: preserve-3d;}
.menu3Dflip ul.nav li a.top-a {display:block; text-decoration:none; margin-top:4px; float:left; height:36px;}
.menu3Dflip ul.nav li a.top-a b {display:block; padding:0 20px; font:bold 14px/30px arial, sans-serif; color:#fff;}
.menu3Dflip ul.nav li:hover a.top-a {background:red; border-radius:8px 8px 0 0; -moz-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4); -webkit-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4); -o-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4); box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4); }
.menu3Dflip ul.nav div {position:absolute; top:40px; left:4px; background:#09c; padding:5px 0 10px 0; border-radius:0 0 15px 15px; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -moz-transform-origin: 0px 0px; -moz-transform: rotateX(-90deg); -webkit-transform-origin: 0px 0px; -webkit-transform: rotateX(-90deg); -o-transform-origin: 0px 0px; -o-transform: rotateX(-90deg); transform-origin: 0px 0px; transform: rotateX(-90deg); -moz-backface-visibility: hidden; -webkit-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; }
.menu3Dflip ul.nav div.left {left:auto; right:4px;} .menu3Dflip ul.nav div ul {padding:10px 0; list-style:none; width:140px; margin:10px 5px 0 5px; float:left; display:inline; text-align:left; background:#fff; border-radius:6px; -moz-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4); -webkit-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4); -o-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4); box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4); }
.menu3Dflip ul.nav div ul.colLeft {margin-left:10px;}
.menu3Dflip ul.nav div ul.colRight {margin-right:10px;}
.menu3Dflip ul.nav div ul.colSingle {margin-left:10px; margin-right:10px;}
.menu3Dflip ul.nav div ul li {float:left; border-bottom:1px dotted #09c; margin:0 5px 0 5px; display:inline;}
.menu3Dflip ul.nav div ul li:last-child {border:0;}
.menu3Dflip ul.nav div ul li a {display:block; width:105px; text-decoration:none; font:13px/16px arial, sans-serif; color:#069; margin:0; padding:4px 0 4px 15px; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiWjFW8S58FtFFhGSePP0a3xY5EpLT0V7A3t5Q8YpeXYs5f_KDVNhxZ8GubMZy8L01lV5Tr3ETD0-Qtl0IVOQ2pWHwqpPiTfA5CCUQdCVoVlfV0AZ6v0hrddUrKn6bCJCCRn7ZDTg1Jhk/h120/arrow.gif) no-repeat left center;}
.menu3Dflip ul.nav div ul li a:hover {color:red; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiWjFW8S58FtFFhGSePP0a3xY5EpLT0V7A3t5Q8YpeXYs5f_KDVNhxZ8GubMZy8L01lV5Tr3ETD0-Qtl0IVOQ2pWHwqpPiTfA5CCUQdCVoVlfV0AZ6v0hrddUrKn6bCJCCRn7ZDTg1Jhk/h120/arrow.gif) no-repeat 1px center;}
.menu3Dflip ul.nav div.col1 {width:160px;}
.menu3Dflip ul.nav div.col2 {width:310px;}
.menu3Dflip ul.nav div.col3 {width:460px;}
.menu3Dflip ul.nav li:hover div { -moz-transform: rotateX(0deg); -webkit-transform: rotateX(0deg); -o-transform: rotateX(0deg); transform: rotateX(0deg); }

<div id='menufixed'>
<div class='menu3Dflip'>
    <ul class='nav'>
        <li><a expr:href='data:blog.homepageUrl' target='_blank'><b>Home</b></a></li>
        <li><a class='top-a' href='http://sahabatblogger77.blogspot.com' target='_blank'><b>Menu 1</b></a>
        <div class='col3'>
            <ul class='colLeft'>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 1</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 2</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 3</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 4</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 5</a></li>
            </ul>
            <ul class='col'>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 6</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 7</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 8</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 9</a></li>
            </ul>
            <ul class='colRight'>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 10</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 11</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 12</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 13</a></li>
            </ul>
        </div>
        </li>
        <li><a class='top-a' href='href='http://sahabatblogger77.blogspot.com' target='_blank'><b>Menu 2</b></a>
        <div class='col2'>
            <ul class='colLeft'>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 1</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 2</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 3</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 4</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 5</a></li>
            </ul>
            <ul class='colRight'>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 6</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 7</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 8</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 9</a></li>
            </ul>
        </div>
        </li>
        <li><a class='top-a' href='href='http://sahabatblogger77.blogspot.com' target='_blank'><b>Menu 3</b></a>
        <div class='col1'>
            <ul class='colSingle'>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 1</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 2</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 3</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 4</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 5</a></li>
            </ul>
        </div>
        </li>
        <li><a class='top-a' href='href='http://sahabatblogger77.blogspot.com' target='_blank'><b>Menu 4</b></a>
        <div class='col2 left'>
            <ul class='colLeft'>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 1</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 2</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 3</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 4</a></li>
            </ul>
            <ul class='colRight'>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 5</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 6</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 7</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 8</a></li>
                <li><a href='href='http://sahabatblogger77.blogspot.com' target='_blank'>Sub Menu 9</a></li>
            </ul>
        </div>
        </li>
        <li><a class='top-a' href='href='http://sahabatblogger77.blogspot.com' target='_blank'><b>Menu 5</b></a></li>
    </ul>
  <div style='text-align:left;position:absolute;position: fixed;top: 0;left: 5px;z-index: 999;overflow: hidden;'><img alt='Logo Blog' height='40' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0cRe0Ar7Qla2brmjcwVooNgerMQapKcy08Trxh46irjTuyN411K3wmGGVkJbNvn-CfMrD_33jPgXG6CZLPj5nG2iJSCfG39vI5WcnQssZE6GfWtUWVQ66v7p3h_7ybjmkvtdtOnC_PLc/s200/unduhan+(3).jpg' width='40'/></div><div style='text-align:center;position:absolute;position: fixed;left: 52px;z-index: 999;overflow: hidden;color:white;font-weight:bold;margin-top:-34px;border-bottom:3px solid red;'>SAHABAT BLOGGER 77</div>
</div>
</div>

Keterangan -

1. Letakkan Kode CSS diatas atau sebelum kode ]]></b:skin>
2. Copy Kode HTML, lalu Paste dibawah kode pembuka <body>
3. Pratinjau Template, jika terlihat Ok, lalu Simpan Template dan lihat hasilnya
4. Jika ada posisi blog yang tertutupi, cari kode #header{...} lalu sesuaikan margin topnya dengan menambahkan kode ( ;margin-top:30px; ), simpan kembali template dan lihat hasilnya

Namun apabila anda mengalami kesulitan dalam meng-Edit Template, hapus semua kode tadi yang sebelumnya sudah terpasang, dan simpan Kode CSS dan HTML pada widget HTML/Javascript. Caranya satukan kode CSS dan HTML diatas lalu tambahkan script <style type="text/css">Kode CSS</style>Kode HTML.

Contoh -

<style type="text/css">

#menufixed {position:fixed;top:0;left:0;width:100%;height:40px;z-index:999;}
.menu3Dflip {border-bottom:2px solid #cecece;..................;}

</style>

 <div id='menufixed'>
<div class='menu3Dflip'>
    <ul class='nav'>
        <li><a class='top-a' href='http://sahabatblogger77.blogspot.com' target='_blank'><b>Home</b></a>
        <li><a class='top-a' href='http://sahabatblogger77.blogspot.com' target='_blank'><b>Menu 1</b></a>
        <div class='col3'>
            <ul class='colLeft'>

Terakhir simpan perubahan.
Demikian akhir Membuat Navigasi Menu Fixed Full RotateX, semoga bermanfaat.

Read More