Cara Membuat Atau Menambah 3 Kolom Dibawah Header

hari ini akhirnya berkesempatan Lagi untuk mengurus Dapur setelah beberapa hari ini Dapur Ditinggalkan karna disibukkan Dengan Proyek Akhir dan Tugas Akhir Skripsi jadi Sekedar istrahat dan menghilangkan Jenuhnya Pikiran yang dipres selama satu bulan maka Dapur Tutorial Blogspot Sempatkan untuk membuat tutorial lagi.

Tutorial blog kali ini kembali membahas tetang cara menambah Eleman Halaman Pada Blog. Buat anda yang senang menambahkan aksesoris  dihalaman blog atau sobat ingin Memasang Space iklan300 x 250 trik ini sangat cocok untuk diterapkan. Tema Kali ini Dapur Tutorial Blogspot Akan Membahas Tetang  Cara Membuat Atau Menambah 3 Kolom Dibawah Header.


Cara Membuat Atau Menambah 3 Kolom Dibawah Header berhubungan dengan tutorial sebelumnya tentang Cara Membuat Atau Menambah 2 Kolom Dibawah Header. Dari tutorial tersebut kita akan menambahkan sedikit kode untuk Merubahnya menjadi 3 kolom.

Berikut Lankah-Langkah Untuk Menambah 3 Kolom Dibawah Header :
  1.  Pastikan anda sudah login ke akun blogger/blogspot
  2. Setelah ada berada pada halaman Panel Blog anda Pilih " Template"


  3. Klik Tombol Edit HTML


  4. Klik Tombol Proceed atau Tombol Lanjutkan  kemudian akan muncul halaman Edit HTML seperti berikut


  5. Jangan lupa Centang Expand Template Widget.


  6. Sebelum melakukan Edit HTML download lengkap template anda terlebih dahulu baca caranya Disini 
  7. Sekarang Cari kode ]]></b:skin> (gunakan tombol CTRL + F3 u/ memudahkan pencarian kode)
  8. Setelah ketemu Copas dan letakan kode berikut diatas kode ]]></b:skin> 
  9. <div id='box3' style='width: 35%; float: left; margin:0; text-align: left;'>
    <b:section class='box-widget' id='col3' preferred='yes' style='float:left;'/>
    </div> 
  10. Selanjutnya Cari kode <div id='main-wrapper'> atau <div id="main-outer"> atau <div class='main-outer'>
  11. Copas kode dibawah ini dan letakan diatas salah satu kode <div id='main-wrapper'>   atau <div id="main-outer"> atau <div class='main-outer'>
  12. <div id='box-kolom-widget'>
    <div id='box1' style='width: 35%; float: left; margin:0; text-align: left;'>
    <b:section class='box-widget' id='col1' preferred='yes' style='float:left;'/>
    </div>
    <div id='box2' style='width: 30%; float: left; margin:0; text-align: left;'>
    <b:section class='box-widget' id='col2' preferred='yes' style='float:left;'/>
    </div>
    <div id='box3' style='width: 35%; float: left; margin:0; text-align: left;'>
    <b:section class='box-widget' id='col3' preferred='yes' style='float:left;'/>
    </div>
    <div style='clear:both;'/>
    </div>
  13. Lankah terakhir klik Tombol Simpan Template 


  14. Selesai dan lihat hasilnya
Untuk melihat hasilnya silahkan anda masuk pada halaman Tata Letak atau Layout  jika ada Elemen tambahan Diatas Header Seperti dibawah ini berarti lankah-langkah diatas sudah anda lakukan dengan benar

Demikian Tutorial Kali ini tetang Cara Membuat atau Menambahkan 3 Kolom Dibawah Header Semoga bisa bermanfaat

Kanata Blogger Template

Kanata Blogger Template | Tutorial Blog

Template Features
Platform TypeBlogger / Blogspot
Template NameKanata Blogger Template
DescriptionKanata is a free blogger template adapted from WordPress with 2 columns, left sidebar and grunge style.
Template Authorhttp://btemplates.com/author/deluxe-templates/
Designer9th Sphere
Instructions URL How to install Blogger Template
Kanata Blogger Template
Source : btemplates.com

Cara Membuat atau Menambahkan 2 Kolom Dibawah Header


Sudah hampir satu bulan blog ini tidak di update dan sekarang mumpung lagi ada kesempatan jadinya saya duduk sejenak untuk berbagi informasi tetang cara membuat atau menambahkan 2 kolom di bawah header. Seblumnya Dapur Tutorial Blogspot Sudah Pernah Menyampaikan Tetang tutorial Cara Menambahkan Elemen Halaman Baru Dibawah Header Blog dan Cara Menambahkan Elemen Halaman Baru Di Atas Header Blog

Nah...Untuk menambahkan 2 kolom dibawah header tidak begitu sulit kita hanya memodifikasi sedikit dari kode tersebut.

Berikut langkah-langkah yang harus anda lakukan :
  1. Login menggunkan akun blog anda
  2. Setelah anda masuk ke Dashboard pilih Menu "Template"


  3. Klik  Tombol Edit HTML


  4. Klik Tombol Proceed atau Tombol Lanjutkan  kemudian akan muncul halaman Edit HTML seperti berikut


  5. Centang Expand Template Widget.


  6. Sebelum melakukan Edit HTML download lengkap template anda terlebih dahulu baca caranya Disini
  7. Sekarang Cari kode ]]></b:skin> (gunakan tombol CTRL + F3 u/ memudahkan pencarian kode) 
  8. Setelah ketemu Copas dan letakan kode berikut diatas kode ]]></b:skin>
  9. #box-kolom-widget { clear:both; } .box-widget { padding:0px 10px 10px 10px; border:1px dotted $bordercolor; }
  10. Sekaran Anda cari Kode <div id='main-wrapper'>   atau <div id="main-outer"> 
  11. Apabila sudah ketemu copas kode dibawah ini dan letakan diatas salah satu kode <div id='main-wrapper'>   atau <div id="main-outer">
  12. </div>
    <div id='box-kolom-widget'>
    <div id='box1' style='width: 50%; float: left; margin:0; text-align: left;'>
    <b:section class='box-widget' id='col1' preferred='yes' style='float:left;'/>
    </div>

    <div id='box2' style='width: 50%; float: left; margin:0; text-align: left;'>
    <b:section class='box-widget' id='col2' preferred='yes' style='float:left;'/>
    </div>

    <div style='clear:both;'/>
  13. Lankah terakhir klik Tombol Simpan Template


  14. Selesai dan lihat hasilnya
Untuk melihat hasilnya silahkan anda masuk pada halaman Tata Letak atau Layout  jika ada Elemen tambahan Diatas Header Seperti dibawah ini berarti lankah-langkah diatas sudah anda lakukan dengan benar


Demikian Tutorial Kali ini tetang Cara Membuat atau Menambahkan 2 Kolom Dibawah Header Semoga bisa bermanfaat

Red Light Blogger Template

Red Light Blogger Template | Tutorial Blog

Template Features
Platform TypeBlogger / Blogspot
Template NameRed Light Blogger Template
DescriptionRed Light is a free blogger template adapted from WordPress with 3 columns, sidebar on the right and left, grunge style and vectorial elements.
Template Authorhttp://btemplates.com/author/falcon-hive/
DesignerTemplateLite
Instructions URL How to install Blogger Template
Red Light Blogger Template
Source : btemplates.com

Menu Dropdown dengan Background

Menu Dropdown dengan Background | Tutorial Blog

Dulu saya pernah posting cara Membuat Menu Dropdown, pada postingan ini kita akan membuat menu dropdown dengan background image.
Buat Sobat yang ingin mencoba silakan ikuti tutorial berikut :
  • Login ke blogger Anda, klik menu Design > Edit HTML.
  • Lalu beri centang expand widget templates, sebaiknya backup dulu template Anda.
  • Cari kode <b:skin><![CDATA[, lalu letakkan kode berikut diatasnya.
    <script>
    var last_expanded = &#39;&#39;;
    function showHide(id)
    {
    var obj = document.getElementById(id);
    var status = obj.className;
    if (status == &#39;hide&#39;) {
    if (last_expanded != &#39;&#39;) {
    var last_obj = document.getElementById(last_expanded);
    last_obj.className = &#39;hide&#39;;
    }
    obj.className = &#39;show&#39;;
    last_expanded = id;
    } else {
    obj.className = &#39;hide&#39;;
    }
    }
    </script>
  • Kemudian cari kode ]]></b:skin>, letakkan kode berikut ini diatasnya.
    .dropdown-b {
    background-image:url('http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/tombol_menu1.gif');
    text-align:center;
    width:165px;
    font-family: georgia, Helvetica, sans-serif;
    padding-left:20px;
    padding-right:20px;
    padding-top:10px;
    padding-bottom: 10px;
    margin-top: 4px;
    display:block;
    text-decoration: none;
    color: #000000;
    height: 8px;
    }
    .dropdown-bg {
    background-image: url('http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/tombol_menu2.gif');
    text-align:center;
    width:165px;
    font-family: georgia, Helvetica, sans-serif;
    padding-left:20px;
    padding-right:20px;
    padding-top:13px;
    padding-bottom: 10px;
    display:block;
    text-decoration: none;
    color: #000000;
    height: 8px;
    }
    .hide{
    display: none;
    }
    .show{
    display: block;
    }
    a{cursor: hand}
  • Lalu klik Save Template.
  • Kemudian klik menu Design > Page Element > Add a Gadget.
  • Pilih HTML/Javascript, lalu masukkan kode berikut ini :
    <a class="dropdown-b" onclick="showHide('dropdown-b-1')">Menu 1</a>
    <div id="dropdown-b-1" class="hide">
    <a href="URL" class="dropdown-bg">Link 1</a>
    <a href="URL" class="dropdown-bg">Link 2</a>
    <a href="URL" class="dropdown-bg">Link 3</a>
    <a href="URL" class="dropdown-bg">Link 4</a>
    </div>
    <a class="dropdown-b" onclick="showHide('dropdown-b-2')">Menu 2</a>
    <div id="dropdown-b-2" class="hide">
    <a href="URL" class="dropdown-bg">Link 1</a>
    <a href="URL" class="dropdown-bg">Link 2</a>
    <a href="URL" class="dropdown-bg">Link 3</a>
    <a href="URL" class="dropdown-bg">Link 4</a>
    </div><a class="dropdown-b" onclick="showHide('dropdown-b-3')">Menu 3</a>
    <div id="dropdown-b-3" class="hide">
    <a href="URL" class="dropdown-bg">Link 1</a>
    <a href="URL" class="dropdown-bg">Link 2</a>
    <a href="URL" class="dropdown-bg">Link 3</a>
    <a href="URL" class="dropdown-bg">Link 4</a>
    </div><a class="dropdown-b" onclick="showHide('dropdown-b-4')">Menu 4</a>
    <div id="dropdown-b-4" class="hide">
    <a href="URL" class="dropdown-bg">Link 1</a>
     <a href="URL" class="dropdown-bg">Link 2</a>
    <a href="URL" class="dropdown-bg">Link 3</a>
    <a href="URL" class="dropdown-bg">Link 4</a>
    </div>
  • Terakhir klik tombol Save. Selesai...
Silakan dicoba Sob, semoga berhasil membuat Menu Dropdown dengan Background.

Photoplus Blogger Template

Photoplus Blogger Template | Tutorial Blog

Template Features
Platform TypeBlogger / Blogspot
Template NamePhotoplus Blogger Template
DescriptionPhotoplus is a free premium blogger template with 3 columns, gallery-styled, perfect for photologs and minimalist. Excellent layout for blogs about photography.
Template Authorhttp://btemplates.com/author/dante-araujo/
DesignerDante Araujo
Instructions URL How to install Blogger Template
Photoplus Blogger Template
Source : btemplates.com

Optimasi SEO Menggunakan Anchor Text

Optimasi SEO Menggunakan Anchor Text | Tutorial Blog

Anchor text merupakan sebuah teks berisi tautan link yang menuju pada sebuah halaman. Anchor Text dapat meningkatkan pageview, memperbanyak backlink dan meningkatkan trafik. hal tersebut dapat membuat sebuah situs memiliki tempat penting pada halaman Search Engine Result Page (SERP).
Dalam membuat Anchor text sebaiknya mengandung kata kunci yang di targetkan, menarik, dan mengandung arti yang mudah di mengerti.
Berikut beberapa contoh penulisan kode html untuk membuat anchor text :
  • Membuat Anchor Text sesuai judul Blog.
    <a href="http://wadahtutorial.blogspot.com/">Tutorial Blog</a>
  • Membuat Anchor Text untuk salah satu artikel.
    <a href="http://wadahtutorial.blogspot.com/2011/12/widget-recent-comment-valid-xhtml.html">Widget Recent Comment Valid XHTML</a>
  • Membuat Anchor Text pada image.
    <a href="http://wadahtutorial.blogspot.com/"><img alt="Tutorial Blog" border="0" src="Url Image" />Tutorial Blog</a>
Beberapa hal yang perlu diperhatikan dalam penggunaan anchor text :
  • Kerapatan keyword dalam sebuah postingan. Beberapa forum SEO menyarankan kerapatan anchor teks yang baik minimal 300 karakter terdapat 1 anchor text.
  • Jumlah karakter anchor text maksimal 60 karakter, karena search engine biasanya mengambil 60 karakter terdepan dari keyword. Jika lebih terkadang search engine tidak mampu mengindeks keywordnya.
  • Anchor text untuk link di dalam blog sebaiknya berhubungan dengan judul postingan atau lebih baik jika keyword yang di gunakan juga terdapat di judul postingan, meta tag, judul blog, nama domain dan deskripsi blog agar robot searcgh engine memberi bobot relevansi yang tinggi. Jika halaman target di luar blog Anda sebaiknya gunakan keyword yang berhubungan dengan judul halaman yang akan di link.
  • Perhatikan pesaing Anda di google search, jika kita menggunakan blog yang masih rendah Pageranknya, sebaiknya lakukan optimasi dari keyword yang rendah saingannya. contoh: keyword Bisnis Online lebih ketat persaingannya dibanding keyword Teknik Bisnis Online, Bisnis Online untuk pemula. Usahakan mendapatkan backlink dengan keyword yang anda optimasi tersebut agar cepat muncul di halaman pertama mesin pencari.
  • Optimasi keyword seiring dengan peningkatan trafik, jika di dalam sebuah blog terlalu banyak link tetapi jumlah kunjungan berkurang, maka akan menyebabkan pagerank halaman tersebut berkurang. Dan bisa mempengaruhi google pagerank blog secara keseluruhan. Semakin banyak keyword yang anda pasang maka semakin banyak trafik yang dibutuhkan untuk mengimbangi, agar pagerank halamannya bisa bertahan atau meningkat.(sebagai catatan: setiap halaman mempunyai pagerank sendiri).
  • Anda bisa melakukan rotasi anchor teks, misalnya dalam 3 bulan pertama gunakan Cara Mudah Belajar Bisnis Online untuk pemula, kemudian 3 bulan berikutnya ganti dengan Teknis Bisnis Online, dalam melakukan rotasi sebaiknya gunakan potongan dari keyword awal, dengan catatan anda harus menambah kalimat baru untuk menempatkan keyword baru tanpa mengubah struktur kalimat lama.
  • Terus membuat keyword baru pada postingan baru, karena search engine senang jika mendeteksi update pada blog/website.
  • Anchor text Anda perlukan untuk membangun backlink, bisa dengan melakukan link antar halaman dalam sebuah blog, atau link dari blog lain ke blog anda.
  • Hindari penggunaan anchor teks yang kurang tepat, misal : d@wnload (kombinasi simbol dan alfabet), dan kata tidak baku lainnya.
  • Hindari menggunakan keyword yang tidak dikenali oleh search engine. misalnya dalam pertukaran link menggunakan kata : Namapemilikblog, url tetap terindeks, tetapi penempatan keywordnya yang kurang tepat,karena mungkin 50% pengguna internet jarang mencari nama atau url di search engine saat mencari blog, terkecuali jika blog anda sudah terkenal maka biasanya banyak pengunjung yang mengetikkan nama anda untuk menemukan blog.
Semoga artikel ini bermanfaat buat kita dalam optimasi blog.

Web Blog Blogger Template

Web Blog Blogger Template | Tutorial Blog

Template Features
Platform TypeBlogger / Blogspot
Template NameWeb Blog Blogger Template
DescriptionWeb Blog is a free blogger template with 2 columns, right sidebar, slideshow and abstract.
Template Authorhttp://btemplates.com/author/alexiel/
DesignerTemplate Mo
Instructions URL How to install Blogger Template
Web Blog Blogger Template
Source : btemplates.com

Masunurin Blogger Template

Masunurin Blogger Template | Tutorial Blog

Template Features
Platform TypeBlogger / Blogspot
Template NameMasunurin Blogger Template
DescriptionMasunurin is a free premium blogger template adapted from WordPress with 2 columns, right sidebar, rounded corners, space for ads and neutral colors.
Template Authorhttp://btemplates.com/author/themecraft/
DesignerPadd IT Solutions
Instructions URL How to install Blogger Template
Masunurin Blogger Template
Source : btemplates.com

Optimasi SEO pada Image

Optimasi SEO pada Image | Tutorial Blog

Image dapat menjadi salah satu sumber traffic dalam optimasi seo. Namun Image tersebut harus kita optimalkan, maksudnya Image yang kita beri "ALT TAG", hal ini merupakan bagian dari optimasi seo on page. Sama halnya seperti tag HTML normal lainnya yang digunakan sebagai teks alternatif ketika image/gambar tidak dapat ditampilkan.
Untuk mengoptimalkan image, dapat kita lakukan melalui dua cara, yaitu melalui nama file dan penggunaan alt tag. Alt berasal dari kata alternatif, hal ini memungkinkan kita untuk menentukan teks alternatif bagi gambar jika tidak dapat ditampilkan karena bermacam alasan, juga sebagai identitas gambar/image di search engine, misalkan saat kita mencari pada Google Image, maka Alt tag tersebut sangat berfungsi pada hasil pencarian. Ketika search engine menjelajah halaman web atau blog, mereka menganggap nama file dan alt tag sebagai isi gambar.
Berikut beberapa Tips yang mungkin bisa Anda gunakan dalam Optimasi SEO pada Image :
  • Jangan gunakan "gambar1.png" atau "gambar2.jpg" sebagai nama file. Cobalah gunakan nama file Anda sebagai kata kunci atau keyword, contoh, "seo-on-page.png" atau "alt-tag.jpg"
  • Gunakan nama file dan alt tag yang singkat tapi deskriptif, hindari penulisan alt tag yang panjang, karena terkadang mungkin bisa dianggap spam
  • Pasokan alt tag bisa menggunakan gambar sebagai link, hal ini bekerja sebagai anchor text
  • Format gambar dengan jenis file - JPEG, GIF, PNG, dan BMP
  • Simpan semua gambar dalam direktori yang sama.
Contoh penggunaan Alt tag pada Image / gambar
<a href="URL image"><img style="border-width: 0px; margin: 0px; title="title image" alt="alt tag image" src="URl image" align="right" border="0" width="180" height="120"></a>
Semoga artikel ini berguna bagi kita dalam meningkatkan Optimasi SEO.

MusicBlog Blogger Template

MusicBlog Blogger Template | Tutorial Blog

Template Features
Platform TypeBlogger / Blogspot
Template NameMusicBlog Blogger Template
DescriptionMusicBlog is a free blogger template with 2 columns, right sidebar, exclusive design for Blogger, slideshow, social icons and vectorial elements.
Excellent layout for blogs about girls or music.
Template Authorhttp://btemplates.com/author/deluxe-templates/
DesignerDeluxe Templates
Instructions URL How to install Blogger Template
MusicBlog Blogger Template
Source : btemplates.com

Recent Comments Blogger dengan Avatar

Membuat Recent Comments Blogger dengan Avatar | Tutorial Blog

Tutorial kali ini sama saja dengan tutorial memasang Widget Recent Comment Valid XHTML, cuman kodenya aja yang berbeda. Jadi untuk tutorial yang lebih jelas silakan baca Widget Recent Comment Valid XHTML. Untuk postingan ini saya buat singkat saja.
Berikut caranya :
  • Buat widget HTML/JavaScript.
  • Beri judul Recent Comments atau apalah terserah Anda.
  • Lalu masukkan kode berikut :
    <style type="text/css">
    ul.tb_recent_comments{list-style:none;margin:0;padding:0;}
    .tb_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
    .tb_recent_comments li .avatarImage{padding:3px;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
    .tb_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
    .tb_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
    </style>
    <script type="text/javascript">
    //<![CDATA[
    // Recent Comments Settings
    var
    numComments = 5,
    showAvatar = true,
    avatarSize = 30,
    characters = 60,
    defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
    hideCredits = true;
    //]]>
    </script>
    <script type="text/javascript" src="http://html-scripts.googlecode.com/files/rcentcmmntavr.js"></script>
    <script type="text/javascript" src="http://wadahtutorial.blogspot.com/feeds/comments/default?alt=json&callback=tb_recent_comments&max-results=5"></script>
    Keterangan :
    numComments : 5, jumlah komentar yang ditampilkan
    avatarSize : 30, ukuran avatar dalam pixel
    characters : 60, jumlah karakter yang ditampilkan
    wadahtutorial.blogspot.com ganti dengan URL blog Anda.
    max-results=5, jumlah komentar yang ditampilkan, ganti sesuai keinginan Anda.
  • Terakhir klik Save. Selesai...
Selamat mencoba Membuat Recent Comments Blogger dengan Avatar.

Outubro Blogger Template

Outubro Blogger Template | Tutorial Blog

Template Features
Platform TypeBlogger / Blogspot
Template NameOutubro Blogger Template
DescriptionOutubro is a free blogger template with 2 columns, right sidebar, neutral colors and posts thumbnails.
Template Authorhttp://btemplates.com/author/templates-novo-blogger/
DesignerTemplates Novo Blogger
Instructions URL How to install Blogger Template
Outubro Blogger Template
Source : btemplates.com

Cara Menambahkan Elemen Halaman Baru Dibawah Header Blog

Setelah Dapur Tutorial Blogspot sukses posting tutorial blogspot tetang Cara Menambahkan Elemen Halaman Baru Diatas Header Blog  kali ini Dapur Tutorial Blogspot akan kembali menyampaikan cara menambahkan elemen halaman.

Elemen halaman yang akan ditambahkan kali ini berda di bawah header blog anda seperti gambar berikut


Fungsinya tetap sama sebagai tempat untuk meletakan widget yang pada umumnya digunakan oleh banyak orang untuk meletakan Iklan atau menu horizontal.

Berikut lankah-Lankah yang Harus anda lakukan untuk menabah Elemen Halaman baru dibawah Header :
  1. Login Menggunakan Akun Blogspot anda pilih menu "Template"


  2. Selanjutnya akan tampil seperti halaman berikut, klik pada tombol Edit HTML


  3. Klik tombol Next/Lanjutkan setelah itu anda akan dibawa kehalaman edit HTML seperti berikut


  4. Sebelum melakukan Edit HTML download lengkap template anda terlebih dahulu baca caranya Disini
  5. Sekarang Cari kode ]]></b:skin> (gunakan tombol CTRL + F3 u/ memudahkan pencarian kode) 
  6. Setelah ketemu Copas dan letakan kode berikut diatas kode ]]></b:skin>
  7. #under_header{
    margin:10px 0;
    padding:1%;
    width:100%;
    }
  8. Sekarang anda cari kode yang mirip dengan kode berikut ini
    • Kode Yang harus anda cari jika anda menggunakan template lama blogger
    • <div id='header-wrapper'> 
      <b:section class='header' id='header' maxwidget="1" showaddelement="no">
      <b:widget id='Header1' locked='true' title='test (Header)' type='Header'/>
      </b:section>
          </div>
    • Kode yang harus anda temukan jika anda menggunkan template baru blogger
    • <div id='header-outer'> 
      <b:section class='header' id='header' maxwidget="1" showaddelement="no">
      <b:widget id='Header1' locked='true' title='test (Header)' type='Header'/>
      </b:section>
          </div>
  9. Apabila sudah ketemu copas kode dibawah ini dan letakan dibawah kode diatas
  10. <div id="under_header">
    <b:section class='header' id='gadgetheader' preferred='yes'/>
    </div>
  11. Lankah terakhir klik simpan


  12. Selesai
Untuk melihat hasilnya silahkan anda masuk pada halaman Tata Letak jika ada Elemen tambahan dibawah Header Seperti dibawah ini berarti lankah-langkah diatas sudah anda lakukan dengan benar



Demikian Tutorial Kali ini tetang Cara Menambahkan Elemen Halaman Baru Dibawah Header Blog Semoga bisa bermanfaat

Cara Menambahkan Elemen Halaman Baru Di Atas Header Blog

Setelah sekian lama bergelut dengan Tutorial Dasar Blogspot atau blogger kali ini akhirnya menyentuh juga ke Tutorial Hack Halaman Blogspot atau blogger. Tentunya jika anda sudah mempelajari tutorial dasar Blogspot Yang Sudah Dapur Tutorial Blogspot Sampaikan sebelumnya seperti Tutorial Mengenal Dasar-Dasar Kode HTML, Cara Mengakses Atau Masuk ke Edit HTML Pada Tampilan Baru Blogspot maupun tutorial-tutorial dasar lainnya tentu anda tidak akan kesulitan dalam melakukan editing templete.

Seperti judul diatas akan membahas tetang tehnik untuk menambakan Elemen halaman baru diatas Header blog. Yang saya maksut dari menambahkan Elemen halaman Baru Diatas Header blog adalah seperti pada gambar dibawah bagian yang ditunjuk oleh panah berwarna merah


Fungsinya tetap sama sebagai tempat untuk meletakan widget yang pada umumnya digunakan oleh banyak orang untuk meletakan Iklan atau menu horizontal.

Berikut lankah-Lankah yang Harus anda lakukan untuk menaba elemen baru diatas Header :
  1. Pastikan anda sudah masuk pada halaman blogspot anda pilih menu "Template"


  2. Akan muncul halaman berikut dan klik pada tombol Edit HTML


  3. Klik tombol Next/Lanjutkan setelah itu anda akan dibawa kehalaman edit HTML seperti berikut


  4.  Centang Expand Template Widget.
  5. Sebelum melakukan Edit HTML download lengkap template anda terlebih dahulu baca ranya Disini
  6. Sekarang Cari kode ]]></b:skin> (gunakan tombol CTRL + F3 u/ memudahkan pencarian kode) 
  7. Setelah ketemu Copas dan letakan kode berikut diatas kode ]]></b:skin>
  8. #gadget_header{
    margin:10px 0;
    padding:1%;
    width:100%;}
  9.  Sekaran Anda cari Kode <div id='header-wrapper'>   atau <div id="header-outer">
  10. Apabila sudah ketemu copas kode dibawah ini dan letakan diatas kode <div id='header-wrapper'>   atau <div id="header-outer">
  11. <div id="gadget_header">
    <b:section class='header' id='gadgetheader' preferred='yes'/>
    </div>
  12. Lankah terakhir klik simpan


  13. Selesai
Untuk melihat hasilnya silahkan anda masuk pada halaman Tata Letak jika ada Elemen tambahan Diatas Header Seperti dibawah ini berarti lankah-langkah diatas sudah anda lakukan dengan benar



Demikian Tutorial Kali ini tetang Cara Menambahkan Elemen Halaman Baru Diatas Header Blog Semoga bisa bermanfaat

Tips Dalam Mengganti Template

Tips Dalam Mengganti Template | Tutorial Blog

Untuk membuat blog terlihat lebih cantik biasanya kita menambahkan beberapa widget pada blog, atau mengedit css tempalate, bisa juga dengan mengganti template tersebut. Namun sebelum Anda mengedit atau mengganti template blog ada baiknya Anda perhatikan beberapa hal dibawah ini.
Tips berikut hanya menurut saya yang masih baru dalam dunia blogging, jadi kalau ada kesalahan harap di koreksi, jika ada tambahan dari Sobat blogger atau para master silakan Anda tulis di kolom komentar di bawah postingan ini.
Berikut Tipsnya :
  • Pastikan Sobat back up template anda terlebih dahulu. Caranya masuk ke dasboard > Design / Rancangan > Edit html, lalu klik Download Full Template / download template lengkap.
  • Simpan semua kode html yang Anda tambahkan pada template tersebut di sebuah Notepad. Jadi jika Anda memerlukannya sewaktu-waktu, Anda tinggal copy saja dari Notepad.
  • Simpan ke Notepad semua kode widget yang Anda gunakan.
  • Sesuaikan design template yang baru dengan design sebelumnya. Misal latar design sebelumnya berwarna hitam, sebaiknya untuk template baru juga menggunakan latar hitam. hal ini untuk menghindari warna latar yang sama dengan warna link text, seandainya pada waktu latar hitam Anda pernah memberi warna font putih pada sebuah Link, lalu Anda menggunakan warna latar putih pada template baru maka link tersebut tidak akan terlihat.
  • Sebaiknya gunakan blog dummy (blog cadangan) dulu, agar tidak berisiko jika salah, disana kita bisa  leluasa mengutak atik template, kalau sudah pas download template-nya lalu upload pada template blog yang ingin kita ganti templatenya.
  • Dalam mengganti template, sebaiknya jangan terlalu sering, agar para pembaca tidak bingung karena tampilan berubah terus, selain itu menurut beberapa blogger kalau terlalu sering mengganti template akan beresiko merusak keberadaan SEO yang sedang kita bangun.
Sekian tips dari saya, semoga bermanfaat buat Sobat yang ingin mengganti template.

Gunakan Tehnik Backlink MLM Untuk Dapatkan Backlink Berkualitas

Semua para blogger pasti akan berburu backlink untuk meningkatkan kwalitas blog mereka di mesin pencari terutama Search enggine google.tentunya tidak mudah untuk mendapatkan backlink yang banyak dalam waktu singkat apalagi jika anda hanya mencari backlink gratis.

Nah kali ini Dapur Tutorial Blogspot menemukan tehnik untuk mendapatkan Backlink yang sangat banyak dan berkualitas untuk itu simaklah tutorial ini dengan baik agar tidak terjadi kesalahan. Tehnik ini Dapur Tutorial Namakan Tehnik "Backlink MLM".
NB : 
Keberhasialan Tehnik ini adalah Kejujuran apabila anda bukan orang jujur jangan sekali-kali mengikuti tehnik ini karena tidak akan mendapat hasil dan percuma saja
Seblum masuk ke lankah-lankahnya Dapur Tutorial Blogspot akan jelaskankan cara kerjanya (untuk mempersingkat saya jelaskan melalui tabel berikut :

Ilustrasi jumlah backlink yang diperoleh
Pada Saat anda berada Pada Level 1 jumlah Backlink adalah "0" ketika anda berada pada level 2 jumlah Backlink adalah "2" pada level 3 jumlah Backlink sama dengan "4" setelah pada level 3 jumlah Backlink adalah "8" sekarang bayangkan jika anda pada level 10 Jumlah Backlink yang anda dapat "Jutaan Baclink" itu hanya dengan mengajak 2 pengguna blog saja bagai mana jika mengajak lebih dari itu, jadi tunggu apa lagi segera terapkan Tehnik Backlink MLM ini


Berikut Lankah-lankah untuk Menerapkan Tehnik Backlink MLM :

Buat entri baru pada blog anda kurang lebih mirip seperti postingan ini yang perlu dirubah adalah urutan link dibwah ini.


1.Google Level 10
2.Yahoo Level 9
3.Bing Level 8
4.Facebook Level 7
5.Twitter Level 6
6. Zoomtemplate Level 5
7. Humor Lucu Dan Aneh Level 4
8. Info terunik Level 3
9. Zone Templates Level 2
10. Dapur Tutorial Blogspot Level 1

Hapus Peserta No.1 Geser Peserta No.10 ke No.9 dan seterusnya, selanjutnya tambahkan Link blog anda pada No.10 atau pada Level Satu sehingga menjadi seperti ini :

1 Yahoo Level 10
2.Bing Level 9
3 Facebook. Level 8
4.Twitter Level 7
5. Zoomtemplate Level 6
6. Humor Lucu Dan Aneh Level 5
7. Info terunik Level 4
8. Zone Templates Level 3
9. Dapur Tutorial Blogspot Level 2
10. Url Blog Anda Level 1

Perlu anda ingat , kalau anda harus mulai dari level 10 sebab apabila anda langsung berada pada No.1 maka link blog anda akan langsung hilang

Sampai disini Tugas anda selesai dan anda akan mendapatkan Backlink yang banyak jika anda semua jujur

INI AKIBATNYA JIKA ANDA TIDAK JUJUR

Anda Membuat Entri baru Seperti postingan ini dan anda tidak merubah atau menggeser urutan link Dibawah

1. ........... Level 10
2. ........... Level 9
3. ........... Level 8
4. ........... Level 7
5. ........... Level 6
6. ........... Level 5
7. ........... Level 4
8. ........... Level 3
9. ........... Level 2
10. Dapur Tutorial Blogspot Level 1

Efeknya Link Blog kita semua tidak berubah dan hanya berada pada level 1.jika url blog berada pada level satu semua, berati tidak ada backlink yang kita peroleh untuk itu Jujurlah supaya tehnik ini berhasil.

Yang ikutan Program Baclink MLM ini jangan lupa tinggalkan jejak dengan memberikan komentar anda disini

Membuat Template Blog Secara Online

Membuat Template Blog Secara Online | Tutorial Blog

Cara yang satu ini banyak digunakan para blogger untuk mengganti template, walaupun ada cara yang lebih mudah yaitu dengan mendownload template jadi dan langsung menguploadnya, atau dengan menggunakan fasilitas Blogger template designer, namun dengan template hasil karya sendiri tentunya Anda memiliki kebanggaan tersendiri.
Dibawah ini ada beberapa situs online gratis yang dapat sobat gunakan untuk membuat template sendiri. Situs yang menyediakan fasilitas membuat template biasanya sudah menyediakan template template tertentu yang nantinya bisa anda edit sendiri. berikut ini situs yang menyediakan editing template secara online.
  • Profilebrand : menyediakan fasilitas edit template gratis, kebanyakan template yang disediakan untuk kita edit bertema jaringan sosial ( facebook, twitter, myspace dll )
  • Pimp my Profile : Untuk situs ini anda bisa membuat template blog, Myspace, dan friendster. Silahkan langsung saja ke situsnya.
  • DoTemplate : Dotemplate ini menyediakan 12 template XHTML dan CSS compliant dasar gratis yang bisa anda pilih sendiri. Anda bisa memilih salah satu dan kemudian mengkustomisasinya dengan mengubah warna, font, teks, posisi teks dan lain sebagainya pada background, container, footer, menu dan boks. Selain itu anda juga bisa menambahkan efek seperti drop shadow, gradien dan round corner. Layanan ini sangat menarik karena tidak memerlukan pengetahuan html yang terlalu banyak untuk mempergunakannya, selain itu ada pilihan untuk mengupload gambar anda sendiri. Setelah anda selesai membuat template blognya, anda bisa langsung mendownloadnya disana.
  • CSSEZ : ini adalah generator template online untuk blog wordpress dan movable type. Jika anda ingin menggunakan layanan ini, anda perlu registrasi gratis disini. Beberapa fiturnya yang bagus adalah memilih antara satu sampai empat kolom template, mengatur lebar kolom, padding, margin, border, font dan style link. Anda juga dapat mengupload gambar atau membuat sendiri dengan image maker.
  • Drupal Theme Generator : Generator ini adalah generator theme berbasis MS Excel untuk situs atau blog drupal yang menggunakan template PHP dan Xtemplate. Layanan ini gratis dan memiliki fitur yang kaya seperti generator theme random color, preview theme langsung, html color assistant, dan integrasi CSS, javascript, PHP dan kode html pada theme dari file eksternal dan lain sebagainya. Selain itu ada 9 theme yang bisa anda dapatkan ketika mendownload generator ini.
  • Eris Template Generator : Generator ini menyediakan 11 skin untuk blog anda dengan tiga pilihan kolom untuk setiap skinnya. Saat ini layanan ini mendukung diaryland, diary-x, movabletype, blogger, wordpress, b2 dan free html site template lainnya. Anda bisa menambahkan tagline, meta tag dan termasuk link ke index, arsip, email, notes, profile, buddylist dan juga 5 entri untuk diaryland, 10 entri untuk movable type, kalender untuk b2, blogroll untuk wordpress, XHTML compliant dan content copyright, webring, chat screen name dan button.
  • Firdamatic : Generator template online untuk blogger dan movable type ini memiliki pilihan dua dan tiga kolom, anda bisa memasukkan sendiri informasi pada boks relevan pada form online yang tersedian dan klik generate template, selain itu anda juga bisa menambahkan judul situs, url gambar dan memilih huruf dan warnanya.
  • www.maketemplate.com : Online generator ini mampu membuat template situs PHP, bersamaan dengan file CSS dan HTML. Anda juga bisa mengkustomisasi style sheet, header, sidebar, dan footer dengan menambahkan sendiri font, warna, margin dan alignment pada form online template generator. ANda juga bisa membuat sendiri scriptnya yang bisa anda kopi dan simpan untuk keperluan anda nanti.
  • PsycHo : Generator online template open source ini dapat diaplikasikan pada platform blogger, persian blog, dan blogFa. Anda bisa mengatur sendiri judul halaman, warna background body template, judul background, deskripsi, teks, spacing dan memilih hingga 4 pilihan kolom. Anda juga bisa preview template anda dan menyimpan kodenya. Layanan ini mudah digunakan tanpa pengetahuan html yang terlalu banyak.
  • Templatr : Templatr ini menyediakan lebih dari 20 layout dan pilihan formatting untuk berbagai elemen halaman termasuk halaman utama, header, footer, titles, margin, padding, border dan banyak lagi untuk keperluan wordpress blog. Selain itu, layanan ini juga menyediakan upload dimana anda bisa mengupload grafis/gambar . Setelah itu anda bisa mendownload template jika anda telah selesai dan mengaplikasikannya pada blog anda.
  • Weebly : Generator template yang rapi ini memiliki 15 desain pre-built yang bisa dikustomisasi dengan menambahkan elemen seperti iklan, feed icon, map, contact form, teks dan layout gambar, kolom google dan youtube video dan lain sebagainya. Jika anda sudah selesai anda bisa mempublikasikan situs/blog tersebut pada platform anda.
  • WordPress Theme Generator : Layanan generator online dapat membantu anda untuk membuat sendiri theme wordpress anda dengan mudah tanpa pengetahuan html dan css language. Layanan ini menyediakan pilihan untuk memilih sendiri nama blog, ukuran body, lokasi sidebar dan ukurannya, menambahkan kolom ketiga, layout menu, warna dan skema teks, anda juga bisa menambahkan tag cloud, arsip dan kotak pencarian. Selain itu anda bisa mengupload logo situs anda online dan membuat link-nya dari template. Jika anda telah selesai anda bisa melihat hasil kreasi anda dan mendownloadnya dalam file zip.
Selamat mencoba dan semoga sukses Membuat Template Blog Secara Online.

FreeDream Blogger Template

FreeDream Blogger Template | Tutorial Blog

Template Features
Platform TypeBlogger / Blogspot
Template NameFreeDream Blogger Template
DescriptionFreeDream is a free blogger template adapted from WordPress with 2 columns, right sidebar, rounded corners, minimalist, simple look, geometric motifs and vectorial elements.
Template Authorhttp://btemplates.com/designer/dreamweaver-gratuit/
DesignerDreamweaver Gratuit
Instructions URL How to install Blogger Template

FreeDream Blogger Template
Source : btemplates.com

Tombol To Page Down WordPress

Membuat Tombol To Page Down di WordPress.com | Tutorial Blog

Beberapa waktu yang lalu saya pernah posting tentang Membuat Tombol Back To Top di WordPress.com, pada postingan tersebut ada pertanyaan dari sobat ibnzuhri tentang membuat tombol back to down atau to page down di wordpress.com. Jadi pada postingan kali ini akan saya buat tutorial tentang Membuat Tombol To Page Down di WordPress.com.
Berikut tutorialnya :
  • Login ke Wordpess Anda, Klik Appearance > Widgets.
    Tombol To Page Down WordPress
  • Drag Text ke Sidebar.
    Tombol To Page Down WordPress
  • Lalu letakkan kode berikut pada area Text.
    <div style="display:scroll;position:fixed;top:300px;left:10px;"><a href='#footer' title='to page down'><img src='URL Icon' /></a></div>
    Ganti URL Icon dengan URL Image, Contoh :
    <div style="display:scroll;position:fixed;top:300px;left:10px;"><a href='#footer' title='to page down'><img src='http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/to-bottom.png' /></a></div>
    Untuk URL Icon, dapat Sobat gunakan Url yang lain. Jika sobat ingin memasang tombol page down dan page up sekaligus, Sobat dapat menggunakan kode berikut
    <div style="display:scroll;position:fixed;top:300px;left:10px;"><div><a href='#' title='to page up'><img src='http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/to-top.png' /></a></div><div><a href='#footer' title='to page down'><img src='http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/to-bottom.png' /></a></div></div>
  • Terakhir klik Save.
    Tombol To Page Down WordPress
Catatan : Karena setiap template berbeda, ada kemungkinan kode diatas tidak bekerja, namun pada blog wordpress.com saya cara ini sudah berhasil.
Semoga tutorial ini bisa membantu Sobat dalam membuat Tombol To Page Down di WordPress.com

Hadiah Page Rank Pertama Dapur Tutorial dari Google

Berawal dari kunjungan ke blog tetangga saya mendapatkan informasi kalau Google Update Page Rang lagi nah saya pun penasaran dengan blog Dapur Tutorial Blogspot ini apa Blog ini  yang baru berusia genap 2 bulan dengan pengunjung 10-15 perhari juga mendaparkan penggharggaan dari google.

Untuk mengetahui kebenarannya saya coba cek di PR Checker.info, Ternya setelah saya cek tiba-tiba....!, hem...........tidak disangka-sangka juga mendapat page rang dari Google ya.....namun Page Rang yang di dapat masih tergolong kecil yaitu Page Rang 1 tapi cukup membuat semangat blogging saya jadi lebih tinggi dari pada semangat menyelesaikan skripsi saya ha....ha....payah.....!.


Btw gimana ni dengan blog sobat ?, saya ucapkan selamat buat blog sahabat yang Page Rank nya meningkat dan buat sahabat blogger Dapur Tutorial Blogspot yang Page Rank nya turun jangan berkecil hati terus berjuang dan koreksi kembali apa kesalahannya.

SimpleVideoblog Template

SimpleVideoblog Template | Tutorial Blog

Template Features
Platform TypeBlogger / Blogspot
Template NameSimpleVideoblog Template
DescriptionSimpleVideoblog is a free blogger template with 2 columns, right sidebar, gallery-styled, perfect for photologs, minimalist, space for ads, footer columns and posts thumbnails.
Template Authorhttp://btemplates.com/author/free-blogger-template/
DesignerFBTemplate
Instructions URL How to install Blogger Template

HomeDesign Blogger Template
Source : btemplates.com

Dimana Posisi Terbaik Untuk Meletakan Link Blogroll ?

Dimana Posisi Terbaik Untuk Meletakan Link Blogroll ? saya merasa hal ini sangat penting untuk dibahas karena para blogger sampai saat ini masih memiliki 2 aliran berbeda dalam meletakan link blogroll atau kode tukar link dan saya juga merasa sangat penasaran setelah saya di tolak 2 kali untuk bertukaran link dengan blog yang meletakan blogrollnya pada bagian sidebar atau footer.

Yang Pertama saya ditolak karena saya meletakan blogroll pada postingan blog tapi tidak ada lasannya dan

Yang kedua saya ditolak karena meletakan bloggrol pada postingan blog itu curang dan tidak benar


Karena dua kali saya ditolak maka saya mencari kebenarannya apakah emang benar blogroll atau link teman yang baik itu diletakan pada sidebar blog bukan pada postingan.

Saya coba cari tau dari google tapi saya tidak menemukan sama sekali blog/web yang menjelaskan posisi terbaik untuk meletakan blogroll. dan akhirnya saya cari kebenarannya sendiri dengan mengecek index back link dari Seo Tool Alexa dan google webmaster tool. dan ternyata blogroll yang di letakan pada postingan blog dan sidebar blog sama-sama terindex oleh google.

Berikut data yang bisa Dapur Tutorial Blogspot tampilkan

Letak Blogroll pada bagian sidebar dan blogroll pada postingan
  1. Link Blogroll Blog Dapur Tutorial Blogspot didalam postingan blog

  2. Klik gambar untuk memperbesar

  3. Link Blogroll  Blog Dapur Tutorial Blogspot Yang ada pada Sidebar blog

  4. Klik gambar untuk memperbesar

Index back link menggunakan SEO Tool
  1. Dilihat dari web Alexa

  2. Klik gambar untuk memperbesar

  3. Dilihat dari Google Webmaster Toll

  4. Klik gambar untuk memperbesar

Jadi dari analisis data diatas tersebut kesimpulan saya apa bila kita meletakan blogroll pada bagian postingan blog dan sidebar blog akan tetap di index oleh google.

Itu hanya kesimpulan dari saya saja jika saya salah mohon untuk di perbaiki atau jika sobat blogger ada pendapat lain segera untuk disampaikan dan untuk para master blog mohon sarannya.

Dikabarkan, Google Adsense Sekarang Suport Blog Berbahasa Indonesia

Tepat pada taggal 1 Februari 2011 sebuah perusaaan Advertising yang terbesar didunia yaitu Google Adsense memberitaukan bahwa Adsense sekarang suport bahasa indonesia. Hem......ini merupakan kabar yang sangat mengembirakan tentunya menambah semangat kita semua. Berita ini langsung di samapaikan di blog resmi Google Adsense dan bisa langsung anda saksikan dengan mengunjunginya di Adsense.blogspot.com


Gambar diatas adalah gambar yang saya ambil langsung dari blog Google adsense.

Ya...mendengar kabar tersebut pastinya anda juga menginginkan akun adsense google termasuk saya, tapi saya terpaksa menunda untuk menghubungkan blog saya ke google adsense karena jumlah trafik yang masih jelak. dari pada nantinya berujung dengan band dari adsense sebaiknya sa mengurungkan niat saya terlebih dahulu.

Ok ni sekedar info buat sobat yang ingin membuat akun google adsense :
  • Untuk mengetahui situs seperti apa yang bisa diterima sebagai publizer silahkan baca pada panduan google adsense dengan klik DISINI
  • Lebih baik anda memiliki akun google terlebih dahulu sebelum mendaftar google adsense. Silahkan kunjungi langsung Form pendaftaran google adsense Disini
  • Apabila anda sudah mendaftar, maka tunggulan beberapa hari karena Tim adsense akan mereview apakan blog atau web anda memenuhi syarat untuk dipasang ikalan Google adasesnse
Demikian sekedar info mengenai adsense google kali ini semoga bermanfaat busa sahabat-sahabat blogger.Oh ya sebelumnya buat sobat yang sudah memiliki akun google adsense, sobat bisa langsung meletakan kode adsense pada blog sobat tanpa merubah kode didalamnya agar bisa tampil pada blog yang berbahasa indonesia.

Tehnik Membuat Menu Navigasi Breadcrumb Blogspot

Apa Itu Navigasi Breadcrumb ?, Pertanyaan itulah yang akan kita selesaikan kali ini.Ok akan sya jelaskan apa yang dimaksut dengan Navigasi Breadcrumb. Navigasi Breadcrumb yaitu sebuah tautan link internal yang terletak diatas atau dibawah halaman situs Web/Blog yang digunakan untuk mempermudah para pengunjung untuk kembali kehalaman sebelumnya.

Biar Lebih Jelas anda bisa lihat gambar berikut :


Perhatikan pada bagian gambar yang ditunjuk oleh warnah merah, itu lah yang saya maksut dengan Navigasi Breadcrumb. Pastinya ada sudah sering melihat menu Navigasi Breadcrumb ini di blog-blog yang lain dan untuk melihat demo aslinya anda bisa coba pada halaman blog Dapur Tutorial Blogspot yang juga sudah dilengkapi dengan Navigasi Breadcrumb ini.

Sekarang kita bahasa langkah-langkah untuk membuat menu Navigasi Breadcrumb.
  1. Pastikan ada sudah login kehalaman blog anda
  2. Pilih Template


  3. Klik Pada Menu Edit HTML


  4. Kemudian Klik Pada Tombol Lanjutkan


  5. Selanjutnya anda akan menjumpai halaman berikut


  6. Sebelum Melakukan Edit HTML sebaiknya anda Download Template Lengkap Terlebih Dahulu.
  7. Cari Kode ]]></b:skin> (Gunakan Tombol CTRL + F3 untuk mempermudah mencari kode)
  8. Copy dan Letakan kode dibawah ini dibagian atas kode ]]></b:skin>  
  9. .breadcrumbs {
    padding:5px 5px 5px 0px;
    margin: 0px 0px 15px 0px;
    font-size:95%;
    line-height: 1.4em;
    border-bottom:3px double #e6e4e3;
    }

  10.  Apababila sudah selesai sekarang cari kode <div class='post hentry uncustomized-post-template'> 
  11. Copy kode dibwah ini dan letakan diatas kode tersebut
  12. <b:if cond='data:blog.homepageUrl == data:blog.url'>
    <b:else/>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='breadcrumbs'>

    Browse &#187; <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
    <b:loop values='data:posts' var='post'>
    <b:if cond='data:post.labels'>
    <b:loop values='data:post.labels' var='label'>
    <b:if cond='data:label.isLast == &quot;true&quot;'> &#187;
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a>
    </b:if>
    &#187; <span><data:post.title/></span>
    </b:loop>
    </b:if>
    </b:loop>

    </div>
    </b:if>
    <b:else/>
    <b:if cond='data:blog.pageType == &quot;archive&quot;'>
    <div class='breadcrumbs'>
    Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; Archives for <data:blog.pageName/>
    </div>
    </b:if>
    <b:else/>
    <b:if cond='data:navMessage'>
    <div class='breadcrumbs'>
    <data:navMessage/>
    </div>
    </b:if>
    </b:if>
  13. Kemudian klik pada tombol simpan
  14. Sekarang lihat pada halam postingan blog anda jika menu Navigasi Breadcrumb muncul berarti anda sudah berhasil melakukan langkah-lankah diatas jika belum jangan menyerah dan berhenti mencoba
Demikian sekilas tetang Tutorial Blogspot  tetang cara membuat Membuat Menu Navigasi Breadcrumb Blogspot semoga berhasil dan bermanfaat.
 
Support : PING by :Ping-o-Matic | Pusat Promosi
Copyright © 2011. Tutorial dan Free Download - All Rights Reserved
Template Modify by Creating Website
Re Design by Bang Aris