Showing posts with label Tutorial Blogspot. Show all posts
Showing posts with label Tutorial Blogspot. Show all posts

Tehnik Membuat Menu Dropdown Horizontal Plus Search Enggine Blog M.1

Sory ni sobat sepertinya Posting Disc Tutorial Blogspot kali ini harus diawali dengan curhat. sudah hampir dua bulan ini saya mengerjakan Proyek Akhir dan Tugas Akhir Sekripsi namun sampai BAB I masih belum selesai-selesai gak tau kenapa pikiran saya selalu tertuju sama Blogger. Semenit saja tidak ngeblog prasaan  menjadi gk jelas mungkinkah sobat blogger ada yang mengalami hal yang sama ?.Saya sebenarnya sudah berusaha agar tidak memikirkan blog untuk sementara ini tetapi tetap saja saya tidak bisa hu.....kalu begini terus kapan lulusnya bahaya bisa-bisa jadi veteran dikampus.

Buat Sahabat Disc Mohon doanya ya semoga Skripsi saya cepat kelar !

Kembali Resep Tutorialnya. Master Chip Disc Tutorial Blogspot Saat ini  akan Menyampaikan Resep Tehnik Membuat Menu Dropdown Horizontal Plus Search Enggine Blog M.1 . Untuk Mendapatkan Resep Menu Dropdown tidaklah sesulit yang sobat bayangkan. apabila sobat tau triknya dalam 5 menit sobat bisa memasang menu dropdown pada halaman blog sobat. Menu Dropdown memang banyak sekali di gunakan oleh para blogger karena dapat membantu para visitor mencari apa yang mereka butuhkan dan dapat pula mempercantik tampilan pada blog sobat.Fungsi lainnya silahkan sobat cari sendiriya.

Ok Langsung saja kita bahas langkah-langkahnya.
  1. Tetap Seperti biasa anda harus login ke akun blogger anda
  2. Pilih menu "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. Sekarang silahkan anda Download lengkap template anda untuk mengantisifasi kesalahan Saat anda melakukan Edit HTML. 
  7. Sekarang Cari kode ]]></b:skin> (gunakan tombol CTRL + F3 u/ memudahkan pencarian kode)
  8. Sudah Ketemu Copas Kode Berikut dan letakan diatas kode ]]></b:skin> 
  9. /* Menu Horizontal Dropdown
    ----------------------------------------------- */
    #menuwrapperpic{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBmNnuFg8Rxf4qSHgCUbwSjrc0F5gYdFDVY5BfJw6chqXh37NewSeMzjOs6JoaaK88MuwmLYlTibnCAymJqpr6Vck7a7fZUJO-PiP-R0yfaENjxVgmj8xL13XqXih1-60k1SYq4Q2_qgc/s1600/nav.png) repeat-x;width:960px;margin:0 auto;padding:0 auto}
    #menuwrapper{width:960px;height:30px;margin:0 auto}.menusearch{width:300px;float:right;margin:0 auto;padding:0 auto}
    .clearit{clear:both;height:0;line-height:0.0;font-size:0}
    #menubar{width:100%}
    #menubar,#menubar ul{list-style:none;font-family:Arial, serif;margin:0;padding:0}
    #menubar a{display:block;text-decoration:none;font-size:12px;font-weight:700;text-transform:uppercase;text-shadow: 0px 1px 1px #000;color:#f2f1f1;border-right:1px solid #666;padding:9px 10px 8px}
    #menubar a.trigger{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGT1J9qxM0puvWBkXkJsiVgCqaMuHJ4i6Xb03ATP0icYyYARNt5kl5gO0ZvghhxWJaLlYU917QqW_Opd1YKkOQCwYrsy2GbzAyzh9gm0HIndqPxbey8G7PpMJ9JnQjYtclw2HDBoYJlSA/s1600/arrow_white.gif);background-repeat:no-repeat;background-position:right center;padding:9px 24px 8px 10px}
    #menubar li{float:left;position:static;width:auto}
    #menubar li ul,#menubar ul li{width:170px}
    #menubar ul li a{text-align:left;color:#fff;font-size:12px;font-weight:400;text-transform:none;font-family:Arial;border:none;padding:5px 10px}
    #menubar li ul{z-index:100;position:absolute;display:none;background:#222;padding-bottom:5px;-moz-box-shadow:0 2px 2px rgba(0,0,0,0.6);-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.6)}
    #menubar li:hover a,#menubar a:active,#menubar a:focus,#menubar li.hvr a{background-color:#222;color:#E98C0A}
    #menubar li:hover ul,#menubar li.hvr ul{display:block}
    #menubar li:hover ul a,#menubar li.hvr ul a{color:#edfdfd;background-color:transparent;text-decoration:none}
    #menubar li ul li.hr{border-bottom:1px solid #444;border-top:1px solid #000;display:block;font-size:1px;height:0;line-height:0;margin:4px 0}
    #menubar ul a:hover{background-color:#555!important;color:#fff!important;text-decoration:none}
  10. Kemudian Cari kode Berikut
  11. <div id='header-wrapper'>    
    .............
    </b:section>
        </div>

    Jika Tidak Ketemu Kode Diatas Cari Kode Yang Ini

    <div class='header-outer'>
        ...............................
    </b:section>
        </div>
  12. Setelah anda menemukan salah satu kode diatas Copas Kode Dibawah ini dan letakan dibawah kode diatas.
  13. <div id='menuwrapperpic'>
    <div id='menuwrapper'>
    <ul id='menubar'>
    <li><a href='/'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic2UyXuQ07iFBpt0d90pcpj76B78IUwrB-JLp7INgQr-Q20K1ZkgaXeTuz54KjnjMvEzq5H5pDQYgCi5NcuI1o8N9-eomL8iPPyBUWZ18vfpBsrY4yxS4qJT_bIwz53onvwDkP0AED8c8/s1600/home_white.png' style='padding:0px;'/></a></li>
    <li><a href='#'>About Us</a></li>
    <li><a class='trigger' href='#'>Contact Us</a>
    <ul>
    <li><a href='#'>Goggle +</a></li>
    <li class='hr'/>
    <li><a href='#'>Contact on Facebook</a></li>
    <li class='hr'/>
    <li><a href='#'>Contact on Twitter</a></li>
    </ul>
    </li>
    <li><a href='#'>Sport</a></li>
    <li><a href='#'>Culture</a></li>
    <li><a class='trigger' href='#'>Entertainment</a>
    <ul>
    <li><a href='#'>Music</a></li>
    <li class='hr'/>
    <li><a href='#'>Movie</a></li>
    <li class='hr'/>
    <li><a href='#'>Television</a></li>
    </ul>
    </li>
    <li><a href='#'>Health</a></li>
    <li><a class='trigger' href='#'>More</a>
    <ul>
    <li><a href='#'>Themes</a></li>
    <li class='hr'/>
    <li><a href='#'>Tutorial</a></li>
    <li class='hr'/>
    <li><a href='#'>Resource</a></li>
    <li class='hr'/>
    <li><a href='#'>Advertise</a></li>
    <li class='hr'/>
    <li><a href='#'>Javascript</a></li>
    </ul>
    </li>
    </ul>
    <div class='menusearch'>
    <div style='float:right;padding:4px 8px 0 0;'>
    <form action='http://www.google.com/search' method='get' target='_blank'>
    <input name='sitesearch' style='display:none;' value='http://URL-blog.blogspot.com'/>
    <input id='search-box' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;;' style='width:170px;border:none;padding:4px 10px; font:12px Arial;color:#666; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1CnJKsftsPGZ_-wRlEwbyseZd6JfGraflfWIimF7HGIFEx4ZVIC6qF7Ik3FbN3oMD2iO44ntyRQOMwW2xRGUR7m49XDEF10NnO9cd37AZ7XH2GA3uLTm7GuOxtNkZocvIls9t7z0w-Uk/s1600/field-bg.gif) no-repeat;' type='text' value='Search on this site...'/><input align='top' id='search-btn' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAjkXwbd7yensIshYTFyKO3YPSJo3NyPlsJApc5CI32Z_tz112A5abNC1aoRGo3e5bKllJOhRlVFDuDV7FnkuJEpS7ybozuP3n0bkCJfZCesz8xs7I634zPnoyWZ_KQwIySQQz1wYZ_Lk/s1600/bg_search.gif' type='image' value='Search'/>
    </form>
    </div>
    </div>
    <br class='clearit'/>
    </div>
    <div style='clear:both;'/>
    </div>
  14. Sehingga Susunannya Menjadi Seperti Ini
  15. <div id='header-wrapper'>    
    .............
    </b:section>
        </div>


    <div id='menuwrapperpic'>
    <div id='menuwrapper'>
    <ul id='menubar'>
    <li><a href='/'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic2UyXuQ07iFBpt0d90pcpj76B78IUwrB-JLp7INgQr-Q20K1ZkgaXeTuz54KjnjMvEzq5H5pDQYgCi5NcuI1o8N9-eomL8iPPyBUWZ18vfpBsrY4yxS4qJT_bIwz53onvwDkP0AED8c8/s1600/home_white.png' style='padding:0px;'/></a></li>
    <li><a href='#'>About Us</a></li>
    <li><a class='trigger' href='#'>Contact Us</a>
    <ul>
    <li><a href='#'>Goggle +</a></li>
    <li class='hr'/>
    <li><a href='#'>Contact on Facebook</a></li>
    <li class='hr'/>
    <li><a href='#'>Contact on Twitter</a></li>
    </ul>
    </li>
    <li><a href='#'>Sport</a></li>
    <li><a href='#'>Culture</a></li>
    <li><a class='trigger' href='#'>Entertainment</a>
    <ul>
    <li><a href='#'>Music</a></li>
    <li class='hr'/>
    <li><a href='#'>Movie</a></li>
    <li class='hr'/>
    <li><a href='#'>Television</a></li>
    </ul>
    </li>
    <li><a href='#'>Health</a></li>
    <li><a class='trigger' href='#'>More</a>
    <ul>
    <li><a href='#'>Themes</a></li>
    <li class='hr'/>
    <li><a href='#'>Tutorial</a></li>
    <li class='hr'/>
    <li><a href='#'>Resource</a></li>
    <li class='hr'/>
    <li><a href='#'>Advertise</a></li>
    <li class='hr'/>
    <li><a href='#'>Javascript</a></li>
    </ul>
    </li>
    </ul>
    <div class='menusearch'>
    <div style='float:right;padding:4px 8px 0 0;'>
    <form action='http://www.google.com/search' method='get' target='_blank'>
    <input name='sitesearch' style='display:none;' value='http://URL-blog.blogspot.com'/>
    <input id='search-box' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;;' style='width:170px;border:none;padding:4px 10px; font:12px Arial;color:#666; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1CnJKsftsPGZ_-wRlEwbyseZd6JfGraflfWIimF7HGIFEx4ZVIC6qF7Ik3FbN3oMD2iO44ntyRQOMwW2xRGUR7m49XDEF10NnO9cd37AZ7XH2GA3uLTm7GuOxtNkZocvIls9t7z0w-Uk/s1600/field-bg.gif) no-repeat;' type='text' value='Search on this site...'/><input align='top' id='search-btn' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAjkXwbd7yensIshYTFyKO3YPSJo3NyPlsJApc5CI32Z_tz112A5abNC1aoRGo3e5bKllJOhRlVFDuDV7FnkuJEpS7ybozuP3n0bkCJfZCesz8xs7I634zPnoyWZ_KQwIySQQz1wYZ_Lk/s1600/bg_search.gif' type='image' value='Search'/>
    </form>
    </div>
    </div>
    <br class='clearit'/>
    </div>
    <div style='clear:both;'/>
    </div>
  16. Kemudian Klik Simpan Template dan selesai........!

Keterangan : 
 #  Ganti Dengan URl yang ingin anda masukan ke Menu Dropdown
width:960px; Panjang Menu Drop Down Horizontal yang bisa nda sesuaikan dengan template blog anda
http://URL-blog.blogspot.comGanti Dengan URL Blog atau Alamat Blog anda

Reques Tutorial Cara Menambah 2 kolom Dibawah Judul Posting

Alhamdulillah akhirnya pada malam ini Master Chef Disc Tutorial Blogspot dapat mempulish tutorial Cara menambah 2 kolom dibawah judul posting yang direques oleh sahabat Disc yaitu "Adzka" seperti berikut :


Sebelumnya mohon maaf buat sahabat Disc "Adzka" karena baru bisa posting tutorialnya sekarang karena Master Chef Disc Tutorial Blogspot harus berexperimen terlebih dahulu untuk mencoba memasangnya pada halaman blog Disc Tutorial Blogspot dan Alhamdulililah bisa berhasil. Hasil Experimen nya seperti gambar berikut :


Ya...mugkin dan semoga saja yang dimaksut sobat "Adzka" adalah ini.

Karena Blog Disc Tutorial Blogspot Belum membutuhkan 2 kolom Dibawah Judul Postingan tersebut, maka kolom tersebut Disc Tutorial Blogspot hapus kembali.

Untuk memasang 2 Kolom Dibawah Postingan langkah-langkahnya adalah sebagai berikut :
  1. Pastikan Sobat Blogger sudah login ke akun blog nya masing-masing
  2. Pilih Menu Template
  3. Klik pada tombol Edit HTML
  4. Klik Pada Tombol Proses Atau Lanjutkan
  5. Selanjutnya anda akan dibawa kehalaman seperti ini
  6. Centang pada kotak kecil bertulisan Expand Widget Templates
  7. Lakukan Download Template lengkap terlebih dahulu untuk mengantisifasi kesalahan (Baca caranya Download dan Upload template lengkap )
  8. Cari Kode Berikut Ini ]]></b:skin> (Gunakan Tombol CTRL + F dan F3 untuk mempermudah pencarian Kode)
  9. Apabila sudah menemukan kode tesebut Copy dan paste tepat diatas kode ]]></b:skin> 
  10. /*---Avatar---*/
    #bawahjudul {background:#262626 url(http://oketrik.googlecode.com/files/borderbg.gif) 51% 0 repeat-y;text-shadow:none;border:1px solid#4d4d4d;padding:15px;margin:0 0 10px;color:#a6a6a6}
    #bawahjudul .bagian-kiri{width:48%;float: right;color:#a6a6a6}
    #bawahjudul .bagian-kanan{width:45%;float:left;color:#a6a6a6}
    .clearfixed:after{content : ".";display:block;height:0;clear:both;visibility:hidden}.clearfixed  {display : inline-block;}
  11. Sekarang Cari Kode  <data:post.body/> (apabila anda menemukan 2 kode tersebut pilih kode yang kedua)
  12. Kalau sudah menemukan Kode tersebut Copy Kode Dibawah dan letakan tepat diatas kode <data:post.body/> 
  13. <b:if cond='data:blog.pageType == &quot;item&quot;'>

    <div class='clearfixed' id='bawahjudul'>
    <div class='bagian-kanan'>

    Letakan Kode Disini (kanan)

    </div>
    <div class='bagian-kiri'>

    Letakan Kode Disini (kiri)

    </div>
    </div>
    </b:if>
  14. Sekarang Klik Simpan
  15. Selesai dan Lihat hasilnya
Sampai disini tetang Cara Menambah 2 kolom Dibawah Judul Posting Semoga bisa membantu sahabat Disc "Adzka" ataupun sahabat Disc yang lain.

Cara Memasang Menu Navigasi Breadcrumbs Pada Blog

Pada Tutorial Sebelumnya Master Chef Disc Tutorial Blogspot sudah pernah membahas tutorial ini dengan Judul Teknik Membuat Menu Navigasi Breadcrumbs Blogspot namun Tutorial tersebut ternyata masih ada sobat blogger Disc Tutorial Blogspot "GB Magz " masih belum berhasil menggunakan trik tersebut


Berikut ungkap Sahabat Disc  "GB Magz "


Buat Sobat Blogger yang masih belum mengeti apa yang dimakasut dengan  Menu Navigasi Breadcrumbs Pada Blog dan manfaatnya Untuk SEO silahkan bacar Pada tutorial sebelumnya.

Ok buat sobat "GB Magz " Master Chef Disc Tutorial Blogspot Coba membantu dengan cara yang lebih mudah meskipun sedikit lebih mudah harus tetap mengutamakan ketelitian.

Berikut langkah-langkah yang Harus sobat lakukan :
  1. Pastikan Sobat sudah masuk ke akun blogger milik sobat
  2. Pilih Template
  3. Klik Pada Tombol Edit HTML
  4. Klik pada Tombol Proces atau Lanjutkan
  5. Kemudian anda akan dibawa kehalaman seperti berikut
  6. Centak kotak kecil bertulisan
  7. lakukan Download Template Lengkap untuk mengantisifasi kesalahan dalam edit HTML (baca caranya Pada Tutorial Cara Upload dan BackUp Template blog)
  8. Cari kode berikut ini ]]></b:skin> (Gunakan Tombol CTRL + F dan F3 untuk mempermudah pencarian Kode)
  9. Setelah Ketemu Copy kode dibawah dan Paste Diatas kode ]]></b:skin>
  10. /*---Navi Breadcrumbs---*/
    #navi{padding:0px 5px;margin:0px 0px 8px 0px;color:#ffffff;-moz-border-radius:5px;font:11px trebuchet ms;}
  11. Sekarang Cari kode <b:if cond='data:post.title'> 
  12. Sudah ketemu Copy kode berikut dan letakan tepat dibwahnya kode apabila Kode ada dua gunakan kode yang pertama <b:if cond='data:post.title'>
  13. <b:if cond='data:blog.homepageUrl == data:blog.url'>
    <b:else/>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='navi'>Location : <a expr:href='data:blog.homepageUrl'>Home</a> &#187;
    <b:if cond='data:post.labels'>
    <b:loop values='data:post.labels' var='label'>

    <a expr:href='data:label.url + &quot;?&amp;max-results=10&quot;' rel='tag'><data:label.name/></a>

    <b:if cond='data:label.isLast != &quot;true&quot;'> , </b:if>
    </b:loop>
    </b:if> &#187; <data:post.title/>
    </div>
    </b:if>
    </b:if>
  14. Sekarang Klik Simpan
  15. Selesai dan lihat hasilnya
Demikian Tutorial Tentang Cara Memasang Menu Navigasi Breadcrumbs Pada Blog Yang bisa Disc Tutorial Blogspot Sampaian Pada Kesempatan Ini Semoga bisa membantu Shabat Blogger "GB Magz "beserta sobat blogger yang lainnya.

Tanya Jawab Tetang Cara Mengatasi Crawl Eror 404 Not Found

Crawl Eror merupakan sebuat fasilitas yang bisa ditemukan pada Google Web Master Tools. Sebenarnya Disc Tutorial Blogspot sudah lama Ingin menyampaikan hal ini namun selalu tertundal, Berhubung sobat "Helmy" sudah menyampikan pertanyaan  Seperti dibawah ini DiscTutorial Blogspot bisa membahasnya sekaran.



Sekilas Disc Tutorial Blogspot Jelaskan Mengenai Crawl Eror. Craw Eror merupakan Fasilitas didalam Google webmaster tools yang berfungsi untuk menampilkan atau memberikan informasi mengenai link Eror atau Link Yang Rusak yang ditemukan seach engine dalam sebuah web atau web blog.

Yang menyebabkan munculnya link Eror pada sebuah web atau web blog bermacam-macam dan salah satu penyebab paling umum yaitu pengguna blog menghapus artikel yang sudah dipulish dan keindex oleh mesin pencari google. Ketika Seach engine Google mengindek link eror tersebut dan kemudian seseorang mengklik link tersebut maka akan muncul halaman yang bertulisan Crawl Eror 404 Not Fount, artinya URL yang diminta tidak bisa dituju atau ditemukan.

Nah....Dari Pertanyaan Sobat Helmy yaitu Bagaiman mengganti URL yang Terditeksi Crawl Eror Dengan URL yang baru ?

Selama pengetahuan Disc Tutorial Blogspot Link Eror yang sudah masuk pada Crawl Eror tidak bisa diganti dan harus anda hapus. Banyak link eror yang sudah masuk ke Crawl Eror sangat berpengaruh pada reputasi blog anda dimata search engine Google.

Terus bagaimana caranya untuk menghapus Link Eror pada Crawl Eror Google Web Master Tool ?.

Dulu untuk menghapus link eror pada Crawl Eror Google Webmaster Tool sangat repot karena harus mengcopy Url tersebut satu persatu ke tempat penghapusan Link Eror namun sekarang Google Webmaster Tools sudah memperbaharui programnya meskipun masih dilakukan satu persatu tapi paling tidak anda tidak perlu mengcopy urlnya satu persatu.

Berikut Cara Menghapus Link Eror dalam Crawl Eror Google Webmaster Tools :
  1. Silahkan anda kunjungi halaman Web Google Webmaster Tool
  2. Sign in Menggunakan Akun Gmail anda
  3. Klik Pada Menu Diagnostics --> Crawl Eror
  4. Klik Pada Bagian Not Found dan klik pada URL Eror tersebutk



  5. Klik Mark  as Fixed



  6.  Klik Ok
  7. Lakukan langkah tersebut pada Link-Link eror lainnya
  8. Selesai
Hanya itu jawaban yang bisa Disc Tutorial Blogspot Sampaikan Buat sobat-sobvat Blogger yang punya jawaban yang lain mohon untuk share disini semoga bisa bermanfaat

Tanya Jawab Tentang Cara Mengetahui Konten Yang Di Copy Paste

Sukurlah i Kali ini Master Chef Disc Tutorial Blog Kedatangan Pertanyaan Dari sahabat blogger Disc "Hilmy" yaitu Bagaimana Disc Bisa Mengetahui Blog Siapa Saja yang sudah melakukan Copy Paste sbb.



Untuk Sahabat Disc "Hilmy" dan Sahabat-sahabat Dapur Tutorial Blogspot yang lainnya Master Chef Disc Tutorial Blogspot akan Sampaikan Bagaimana dengan mudah mengetahui Konten atau Artikel anda jika di copy paste oleh blog orang lain.


Untuk mengetahui artikel milik kita sendiri yang dicopas oleh blog yang lain sebenarnya sangatlah mudah apabila konten blog yang sobat miliki hasil ketikan jari tangan anda sendiri.

Banyak cara yang digunakan oleh pengguna blog untuk mengamankan konten miliknya dan banyak juga Tool-tool gratis untuk mengaman artikel dan salah satunya Seperti yang Digunakan Disc Tutorial Blogspot yaitu menggunakan Blogcopy.com. Dengan anda menggunakan Blogcopy.com anda akan dapat memonitor terus blog anda setiap saat pada artikel mana yang dicopas.

Teknik Berikutnya Yang  Master Chef Disc Tutorial Blogspot gunakan yaitu dengan cara mengkopy sebagian paragraf artikel kemudiam masukan ke Search engin google. dengan demikian search egine google akan menampilkan hasil pencarian yang serupa Seperti dibawah ini :


disini ketahuan blog mana yang sudah copy paste konten milik blog kita.

Beberapa minggu yang lalu saat Disc Tutorial Blogspot sercing di google , Menemukan metode untuk mengetahui konten yang di Copy Paste yaitu Dengan Cara Menyisipkan Kata Unik atau Kata rahasia Kedalam Konten atau artikel blog anda.

Contohnya Pada Setiap Artikel Milik Disc Tutorial Blogspot pasti selulu ada kalimat " Disc Tutorial Blogspot" ini Dalah kalimat unik yang saya gunakan. Dengan demikaian Cukup Menulis Disc Tutorial Blogspot Pada Search Egine Google makan Search Egine akan menampilkan Hasil Pencarian Yang mengandung Kata Unik tersebut.

Mungkin Demikian Jawaban yang bisa Disc Tutorial Blogspot utarakan dan buat sobat blogger yang lain jika masih ada teknik yang lain bisa share disini.

Cara Menampilkan Atau Menyembunyikan Widget Blog Pada Halaman Tertentu

Jumpa lagi bareng Master Chef Disc Tutorial Blogspot. Kali ini Master Chef Disc Tutorial Blogspot akan Menyampaikan Resep tetang Cara Menampilkan Atau Menyembunyikan Widget Blog Pada Halaman Tertentu.

Sekilas Penjelasan mengapa harus ada tutorial tetang cara Cara Menampilkan Atau Menyembunyikan Widget Blog Pada Halaman Tertentu  yaitu karena untuk menjaga Estetika atau keindahan blog yang anda miliki. Seandainya anda memiliki blog yang suka memasang pernakpernik pada halaman blog dan pernak pernik tersebut anda tampilkan pada setiap halaman blog tentu akan terlihat monoton, pastinya juga akan banyak menghabiskan tempat.

Tapi sekarang bagaimana jika widget atau perak pernik tersebut diatur sedemikian rupa sehingga berubah pada setiap halamannya tentu akan menghasilkan keindahan sendiri pada blog anda dan akan menjaga kenyamanan pengunjung untuk terus berada pada blog anda.

Ok langsung saja kita ke inti pembahasan. Dibawah ini ada beberapa kode yang dapat anda gunakan untuk mengatur widget atau pernak pernik blog anda supaya tampil pada halaman tertentu saja.
  1. Kede ini hanya akan menampilkan widget pada halaman Home atau halaman utama saja
  2. <b:if cond='data:blog.url == data:blog.homepageUrl'>
    Posisi Widget Blog
    </b:if>
  3. Kede ini hanya akan menampilkan widget selain Homepage atau halaman pertama
  4. <b:if cond='data:blog.url != data:blog.homepageUrl'>
    Posisi Widget Blog
    </b:if>
  5. Kode ini hanya akan menampilkan widget pada Archive Page atau halaman arsip
  6. <b:if cond='data:blog.pageType == &quot;archive&quot;'>
    Posisi Widget Blog
    </b:if>
  7. Kode ini hanya akan menampilkan widget selain halaman Archive Page
  8. <b:if cond='data:blog.pageType != &quot;archive&quot;'>
    Posisi Widget Blog
    </b:if>
  9. Kode ini hanya akan menampikan widget pada halaman postingan saja
  10. <b:if cond='data:blog.pageType == &quot;item&quot;'>
    Posisi Widget Blog
    </b:if>
  11. Kode ini hanya akan menampikan widget selain halaman posting
  12. <b:if cond='data:blog.pageType != &quot;item&quot;'>
    Posisi Widget Blog
    </b:if>
  13. Kode ini hanya akan menampilkan widget pada halaman static page
  14. <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
    Posisi Widget Blog
    </b:if>
  15. Kode ini hanya akan menampilkan widget selain halaman static page
  16. <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
    Posisi Widget Blog
    </b:if>
  17. Kode ini hanya akan menampikan widget  pada postingan tertentu
  18. <b:if cond='data:blog.url == &quot;alamatpostingan&quot;'>
    Posisi Widget Blog
    </b:if>
  19. Kode ini hanya akan menampilkan widget selain postingan tertentu
  20. <b:if cond='data:blog.url != &quot;alamaatpostingan&quot;'>
    Posisi Widget Blog
    </b:if>
Sekarang kita bahas bagaimana cara meletakan kode-kode diatas.
  1. Masuk ke akun Blogger sobat
  2. Pilih Menu Tata Letak atau menu Layout
  3. Pilih Widget yang ingin anda atur dengan klik Edit (Misalnya disini Disc Tutorial Blogspot Ambil widget "Tutorial Blog Dan SEO")
  4. Ambil Kode ID Widget tersebut (disini ID Widget ditemukan yaitu "HTML 3")
  5. Sekarang Pilih Menu Template
  6. Klik Pada Tombol Edit HTML
  7. Klik lagi pada tombol Proses atau Lanjutkan
  8. Silahkan Download Template lengkap terlebih dahulu untuk mengantisifasi kesalahan(baca tutorialnya DISINI)
  9. Centang Expand Template Widget 
  10. Cari Kode ID Widget (Contoh "HTML 3") yang sudah anda ambil pada langkah 4 (Gunakan Tombol CTRL + F dan F3 untuk mempermudah penarian kode)
  11. Setelah ketemu anda akan menjumpai kode elemen widget seperti ini
  12. <b:widget id='HTML1' locked='false' title='Join Me' type='HTML'>
    <b:includable id='main'>
    ......................................letak kode untuk menyembunyikan widget
      <!-- only display title if it's non-empty -->
      <b:if cond='data:title != &quot;&quot;'>
        <h2 class='title'><data:title/></h2>
      </b:if>
      <div class='widget-content'>
        <data:content/>
      </div>
      <b:include name='quickedit'/>
    .............................. letak kode penutup
    </b:includable>
    </b:widget>
  13. Letakan Kode untuk menyembunyikan widget misalnya kode untuk menampilkan widget hanya pada halaman home page saja, maka susunannya akan menjadi seperti ini
  14. <b:widget id='HTML1' locked='false' title='Join Me' type='HTML'>
    <b:includable id='main'>
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
      <!-- only display title if it's non-empty -->
      <b:if cond='data:title != &quot;&quot;'>
        <h2 class='title'><data:title/></h2>
      </b:if>
      <div class='widget-content'>
        <data:content/>
      </div>
      <b:include name='quickedit'/>
    </b:if>
    </b:includable>
    </b:widget>
  15. klik simpan
  16. Selesai dan lihat hasilnya
Demikian Tutorial Blog Tetang Cara Menampilkan Atau Menyembunyikan Widget Blog Pada Halaman Tertentu semoga bisa bermanfaat untuk sahabat Daput Tutorial Blogspot Semua.

Cara Mengganti Atau Merubah Tampilan Kursor standar pada blog

Waktu saya tetangah mencari informasi tetang Kontes SEO . Tak sengaja bertemu blog yang memilki tampilan kursor yang bagus dan saya tetarik mempelajari bagaimana kursor diblognya bisa dirubag, Master Chef Disc Tutorial Blogspot akhirnya bertanya sama simbah Google dan mendapatkan jawaban yang sangat banyak dari simbah.

Ternyata untuk memodifikasi  kursor setandar blog sangat mudah hanya perlu menambahkan beberapa kode pada template blog.

Berikut  langkah-langkah untuk mengganti kursor pada blog
  1. Pastikan Sobat Disc sudah login menggunakan akun blogspot sobat
  2. Pilih Menu Layout atau Tata Letak
  3. Klik Tambah Gaget atau Add a Gadget
  4. Lalu pilih HTML/JavaScript
  5. Tambahkan kode berikut didalam Box HTML/JavaScript yang sudah sobat pilih tadi
    1. Kode ini Mengubah kursor standar tetapi tidak berubah saat kursor diatas link
    2. <style type="text/css">
      body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjg-ZxMOJ27FaOY5tchfVW6FuPUoqws4aG2Le3Sn_aGZEpXLzT0o369_v393Os0e4SgQXp-cU7MPk9XSz37PKj5x7YVDluVy0zaWkbZKfi3PAAMl_26JjKWvqVMIwSSTxgmm00Q3wO0Xza3/s320/kursor++2.png"), auto;}
      </style>
    3. Kode ini mengubah Kursor standar dan tetap berubah saat kursor diatas link
    4. <style type="text/css">
      body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjg-ZxMOJ27FaOY5tchfVW6FuPUoqws4aG2Le3Sn_aGZEpXLzT0o369_v393Os0e4SgQXp-cU7MPk9XSz37PKj5x7YVDluVy0zaWkbZKfi3PAAMl_26JjKWvqVMIwSSTxgmm00Q3wO0Xza3/s320/kursor++2.png"), auto;}
      body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjg-ZxMOJ27FaOY5tchfVW6FuPUoqws4aG2Le3Sn_aGZEpXLzT0o369_v393Os0e4SgQXp-cU7MPk9XSz37PKj5x7YVDluVy0zaWkbZKfi3PAAMl_26JjKWvqVMIwSSTxgmm00Q3wO0Xza3/s320/kursor++2.png"), auto;}
      </style>
  6. Klik Simpan
  7. Selesai dan Lihat Hasilnya
Apabila Sobat belum memiliki URL mouse sendiri, Disc Tutorial Blogspot memiliki beberapa URL kursor yang bisa sobat Disc Tutorial Blogspot Gunakan Dibawah ini :


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUc_FpN-5yXr8MIm9WovLqf34FNPtwwcxNehx2MNcBjrKuAPHXs-W2JGmqJ9s4xhFZYXZcq0ZupCgCJyPZLZXnzW192RYewLoDcKs6fp2KHFFxPHnueuNI2kVWuRquERItsUYnGqBDIoyH/s320/kursor+1.png


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjg-ZxMOJ27FaOY5tchfVW6FuPUoqws4aG2Le3Sn_aGZEpXLzT0o369_v393Os0e4SgQXp-cU7MPk9XSz37PKj5x7YVDluVy0zaWkbZKfi3PAAMl_26JjKWvqVMIwSSTxgmm00Q3wO0Xza3/s320/kursor++2.png


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1Ze9mQkvd8l9gowAvlgr1zUKBJQz3wHw85jYeO980m_YVE1nJwW30Vjd-c5sqPZSd5kDfnxueFG8ybGN2hzDFxOqnnqyWcj5qMc0ANhhrKdKMnQLMHfB5rpZmkxUgSJbPntTA5aGtYfWT/s320/kursor++3.png
Demikian Tutorial Blog tentang Cara Mengganti Atau Merubah Tampilan Korsor standar pada blog Semoga bisa membantu Sahabat blogger semuanya.

Cara Memasang Meta Tag pada Blog

Cara Memasang Meta Tag Pada Blog itu resep Master Chep Disc Tutorial Blogspot Kali ini. Kira-kira Meta Tag itu apa dan untuk apa manfaatnya bagi blog.?.

Meta Tag itu adalah elemen atau tag dalam bahasa program HTML atau XHTML  yang digunakan untuk mengaplikasikan meta data dalam suatu web atau Weblog.

Sedangkam Fungsinya untuk mendeskripsikan atau memberikan pernjelasan mengenai web atau weblog kita kepada search engine.

Terus bagaimana pengaruh meta tag terhadap SEO ?. Banyak orang yang mengatakan Meta tag sangat penting untuk SEO dan banyak pula yang mengatakan tidak terlalu penting. Apabila dari sudut pandang Disc Tutorial Blogspot Sendiri Meta Tag  pada blog sangat penting karena dengan kita memasang Meta Tag pada Blog berarti kita sudah membantu Search engine untuk mengenal blog yang kita miliki.

Seperti Pepatah Mengatakan "Jika tak kenal maka tak sayang". Artinya jika search egine sudah mengenal blog yang anda miliki ada kemungkinan search engine akan menyangi blog sobat.

Meta tag yang dipasang pada blog sangat beragam jenisnya dan yang akan Disc Tutorial Blogspot Sampaikan Kali ini adalah salah Satu meta Tag Yang Disc Tutorial Blogspot Anggap sebagai Meta Tag yang Lumayan baik.

Berikut Langkah-langkah untuk Pasang Meta Tag Pada Blog.
  1. Silahkan Anda login Ke Akun Blogger sobat
  2. Pilih Menu Template


  3. Klik Pada Tobol Edit HTML


  4. Klik tombol Proses Atau Lanjutkan


  5. Anda akan menjumpai area edit HTML seperti gambar dibawah


  6. Sekarang Cari Kode <title><data:blog.pageTitle/></title> (Gunakan tomblo CTRL + F Atau F3 untuk memudahkan pencarian Kode)
  7. Sudah Ketemu hapus kode tersebut dan ganti dengan Kode Dibawah ini :
  8. <b:if cond='data:blog.pageType == &quot;index&quot;'>
    <title><data:blog.title/> | Deskripsi Singkat Blog</title>
    <meta content='deskripsi tentang blog anda' name='description'/>
    <meta content='kata kunci, kata kucni,' name='keywords'/>
    <b:else/>
    <b:if cond='data:blog.pageType == &quot;archive&quot;'>
    <title><data:blog.title/> | Deskripsi Singkat Blog</title>
    <meta content='deskripsi tentang blog anda' name='description'/>
    <meta content='kata kunci, kata kucni,' name='keywords'/>
    <b:else/>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <title><data:blog.pageName/> | <data:blog.title/></title>
    <meta expr:content='&quot;Download &quot; + data:blog.pageName + &quot;. deskripsi tentang blog anda&quot;' name='description'/>
    <meta expr:content='data:blog.pageName + &quot;, kata kunci, kata kucni, kata,&quot;' name='keywords'/>
    <b:else/>
    <title><data:blog.pageTitle/></title>
    </b:if>
    </b:if>
    </b:if>
    <meta expr:content='data:blog.title' name='author'/>
    <meta content='index, follow' name='robots'/>
    <meta content='2 days' name='revisit-after'/>
    <meta content='id' name='language'/>
    <meta content='id' name='geo.country'/>
    <meta content='Indonesia' name='geo.placename'/>
    <meta content='global' name='distribution'/>
    <meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
    <meta content='true' name='MSSmartTagsPreventParsing'/>
    <meta content='blogger' name='generator'/>
    <meta content='general' name='rating'/>
    Keterangan :
    1. Deskripsi Singkat Blog Isi dengan deskripsi singkat mengenai blog anda misalnya Free Download Software
    2. deskripsi tentang blog anda Cerikakan latar blakang blog anda contoh "Blog yang berisi kumpulan-kumpulan software gratis"
    3. kata kunci, kata kucni Isi dengan kata-kata kunci ( pisahkan dengan koma "," ) contoh. "Free download, Software gratis, kumpulan Software,computer"
  9. Terakhir Klik Simpan 
  10. Selesai
Demikian Resep Tutorial Master Chep Disc Tutorial Blogspot tetang cara pasang meta tag pada blogspot atau blogger semoga bisa bermanfaat.

Cara Membuat Atau Memasang Widget Social Bookmark Melayang Di Blog

Memasang Widget Social Bookmark , ya itulah tema Master Chip Disc Tutorial Blogspot Kali ini.Sebelumnya apakah sobat sudah tau apa yang dimaksut dengan Social Bookmark ? Buat para Master pastinya bukan hal yang baru lagi mengenai ini. Buat para pemula tenang saja sebelum kita bahas cara memasang Social Bookmark,  Master Chip Disc Tutorial Blogspot akan jelaskan sekilas apa yang dimaksut dengan Social Bookmark dan Manfaatnya.


Social Bookmark itu adalah Situs-situs yang menyediakan jasa untuk anda menyimpan alamat-alamt URL serta Deskripsi secara singkat untuk para Usernya.Adabanyak situs Social Bookmark saat ini anda bisa temukannya dengan mudah di goodang bah google dengan kanta kunci "Daftar Situs Social Bookmark"

Terus Apa manfaatnya ?. Tentu banyak sekali manfaat yang bisa diperoleh dari situs Social Bookmark bebebrapa diantaranya yaitu :
  1. Anda dapat Submit artikel blog anda dan
  2. Artikel anda akan menjadi cepat terindext oleh Search Engine
  3. Memperbaiki Serp (Search Engine Result Pages )
  4. Memperoleh Backlink
  5. Meningkatkan Page Rank
Nah Sekarang Sudah pahamkan apa itu Social Bookmark dan manfaatnya untuk Blog sobat. Sekarang kita akan pelajari bgaimana caranya untuk Membuat Widget Social Bookmak Melayang Disisi halaman Blog
  1. Login terlebih dahulu menggunakan akun blogger anda
  2. Pilih Menu Template

  3. >
  4. Klik Pada Tombol Edit HTML


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


  6. Sekarang silahkan anda Download lengkap template anda untuk mengantisifasi kesalahan Saat anda melakukan Edit HTML.(Baca Caranya DISINI )
  7. Cari Kode ]]></b:skin> (Gunakan Tombol CTRL + F Atau F3 untuk memudahkan pencarian)
  8. Setelah kode ditemukan Copas Kode dibawah dan letakan di atas kode ]]></b:skin>
  9. /* Social bookmark
    ----------------------------------------------- */
    #divStayTopLeft {left:5px;position:fixed;top:15px;}
    .sidetab {}
    .sidetab ul {list-style-type: none;margin: 0;margin-top: 220px;margin-left: -2px;padding: 0;}
    .sidetab ul li {border-bottom: 0;margin-bottom: 0;padding: 0;}
    .sidetab a {background: none;display: block;height: 25px;margin-top: 0px;padding: 2px;width: 25px;}
    .sidetab a:link, .navlist a:visited {color: #555;text-decoration: none;}
    .sidetab a:hover {border: none;background: #e8e8e8;}
    .sidetab .button a {background:none;height: 25px; width: 25px;}
  10. Sekarang Cari Kode </body> Setelah ketemu copas kode dibawah dan letakan diatas kode </body> tersebut
  11. <div id='divStayTopLeft'>
    <div class='sidetab'>
    <ul class='navlist'>
    <li class='button'><a href='http://dapur-tutorial.blogspot.com/feeds/posts/default'><img height='25' src='http://upic.me/i/ci/rss_48.png' title='Subscribe to RSS feed' width='25'/></a></li>
    <a class='addthis_button_facebook'><img alt='Facebook' height='25' src='http://upic.me/i/8n/facebook_32.png' width='25'/></a>
    <a class='addthis_button_delicious'><img alt='Delicious' height='25' src='http://upic.me/i/k6/delicious.png' width='25'/></a>
    <a class='addthis_button_email'><img alt='Email' height='25' src='http://upic.me/i/bo/emailsmall.jpg' width='25'/></a>
    <a class='addthis_button_favorites'><img alt='Favorites' height='25' src='http://upic.me/i/ij/favorites.png' width='25'/></a>
    <a class='addthis_button_twitter'><img alt='Twitter' height='25' src='http://upic.me/i/bx/twitter_32.png' width='25'/></a>
    <a class='addthis_button_google'><img alt='Google' height='25' src='http://upic.me/i/fm/gsmall.jpg' width='25'/></a>
    <a class='addthis_button_digg'><img alt='Digg' height='25' src='http://upic.me/i/0v/mdigg.png' width='25'/></a>
    <a class='addthis_button_more'><img alt='More' height='25' src='http://upic.me/i/5e/wmore.png' width='25'/></a>
    </ul>
    </div>
    </div>
    <script src='http://s7.addthis.com/js/250/addthis_widget.js?pub=xa-4a65e1d93cd75e94' type='text/javascript'/>
    <script src='http://hackublog.googlecode.com/files/FloatingMenu.js' type='text/javascript'/>
  12. kemudian cari lagi kode ]]></b:skin> dan copy kode dibawah dan paste di bawahnya kode ]]></b:skin>
  13. <script src='http://jamu-martin.googlecode.com/files/related-maskolis.js' type='text/javascript'/>
  14. Klik Simpan Template 


  15. Selesai dan lihat Hasilnya
Demikian Resep Disc Tutorial Blogspot Tetang Cara Membuat Atau Memasang Widget Social Bookmark Melayang Di Blog salamat mencoba semoga bermanfaat

 
Penanggung Jawab Handika Septian Akniagara | Supported by Artikel Terkait Blog