Tampilkan postingan dengan label Tutorial Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Tutorial Blog. Tampilkan semua postingan

Cara Submit Sitemap Blog Ke Google Webmaster

Cara Submit Sitemap Blog Ke Google Webmaster | Yepi Share - Bagi anda yang menginginkan Submit Sitemap Blog Ke Google Webmaster, mungkin anda mengalami kesusahan. Padahal sebenarnya mudah untuk kita lakukan.Berikut akan saya bahas tutorial Cara Submit Sitemap Blog Ke Google Webmaster dengan gambar agar anda dapat lebih mengerti :

Cara Submit Sitemap Blog Ke Google Webmaster
1. Jika anda belum mengetahui Feed blog anda silahkan anda kesini http://ctrlq.org/blogger
2. Setelah itu anda masukkan alamat Web/Blog anda ditempat yang sudah disediakan.
3. Kemudian klik Generate Sitemap, lihat gambar berikut :
Cara Submit Sitemap Blog Ke Google Webmaster
4. Selanjutnya akan tampil hasil generate berupa URL Feed yang digunakan untuk Submit Sitemap ke Google Webmaster, lihat gambar berikut :
Cara Submit Sitemap Blog Ke Google Webmaster
5. Kemudian anda buka Goolgle Webmaster, jika anda belum daftar silahkan melihat tutorialnya Disini.
6. Setelah anda masuk pada Dashboard Google webmaster, anda klik pada Optimization
7. Lalu anda pilih Sitemaps, lihat pada gambar :
Cara Submit Sitemap Blog Ke Google Webmaster
8. Sesudah anda masuk pada tab Sitemaps, anda klik ADD/TEST SITEMAP dan anda masukkan hasil      Generate URL dari http://ctrlq.org/blogger tadi.
Ingat yang dimasukkan url belakang dari url blog anda,
mis : http://www.yepishare.com/atom.xml?redirect=false&start-index=1&max-results=500
yang anda copy hanya atom.xml?redirect=false&start-index=1&max-results=500.
9. Klik Test Sitemap dahulu, lihat pada gambar :
Cara Submit Sitemap Blog Ke Google Webmaster
10. Setelah itu akan muncul kotak dialog klik View Result.
11. Jika mengalami Error, anda harus mencari URL Ganerate yang lain, lihat pada gambar :
Cara Submit Sitemap Blog Ke Google Webmaster
12. Apabila anda berhasil maka seperti gambar berikut :
Cara Submit Sitemap Blog Ke Google Webmaster
13. Jika anda berhasil seperti gambar diatas, anda tinggal mengulang lagi memasukkan URL, dan pilih Submit Sitemap.
14. Selesai

Demikian tutorial dari Cara Submit Sitemap Blog Ke Google Webmaster. Biasanya Sitemap di index oleh Google Webmaster ada yang hanya berjam-jam ada yang berhari-hari. So ditunggu aja sambil berdoa. Terimakasih anda sudah menyimak, semoga bermanfaat dan dapat membantu anda. Terimakasih atas kunjungannya.



Cara Daftar Blog ke Google Webmaster Tools

Cara Daftar Blog ke Google Webmaster Tools | Yepi Share  - Google Webmaster Tools merupakan layanan gratis milik perusahaan search engine raksasa, Google yang memungkinkan kita untuk untuk memantau dan mengoptimalkan blog atau web kita agar dapat dicrawl dan diindex dengan baik oleh Google. Layanan ini juga memungkinkan untuk meminta search engine melakukan crawling terhadap blog atau web dan memantau 'kesehatan' suatu blog/web. Tentunya hal  ini sangat penting manfaatnya bagi para blogger dalam melakukan optimalisasi blognya.
Untuk dapat menggunakan layanan Google Webmaster Tools anda harus mendaftar terlebih dahulu menggunakan akun Gmail atau akun Google lainnya. Bagi yang belum memiliki akun Google silakan mendaftar terlebih dahulu.

Berikut ini cara mendaftar dan melakukan verifikasi blog di Google Webmaster Tools :

1.)  Buka halaman www.google.com/webmasters/tools/ lalu Login lah menggunakan akun Gmail atau akun Google anda.

2.)  Kemudian pada halaman Google Webmaster Tools , Klik tombol Add a Site lalu masukkan alamat blog anda yang ingin didaftarkan. Setelah itu klik Continue.

 Daftar Google Webmaster Tools
Cara Daftar Blog ke Google Webmaster Tools
3.)  Lalu pada halaman Verify Ownership kita diminta untuk melakukan verifikasi blog. Ada 4 pilihan dalam melakukan verifikasi blog, yaitu :

    >> Use your Google Analytics account
         Menggunakan kode Google Analitycs pada blog anda

    >> Add a DNS record to your domain's configuration
         Menambahkan DNS record pada domain registrar atau hosting provider

    >> Add meta tag to your site's home page
         Menyisipkan kode meta tag yang disediakan kedalam kode HTML blog.

    >> Upload an HTML file to your server
         Kita akan diminta untuk mendownload sebuah file HTML yg disediakan
         kemudian menguploadnya ke blog kita.
 
     Saya sarankan menggunakan metode Add meta tag to your site's home 
     page karena lebih mudah.

    Adapun berikut ini cara melakukan verifikasi menggunakan meta tag:
    a.) Pada halaman Verify Ownership tadi, klik Add meta tag to yous site's
         homepage
    b.) Kemudian, copy kode meta tag yang ada disana. Adapun bentuk dari
         kode meta tag kira-kira sebagai berikut
<meta name"google-site-verification" content="KLA651QPMpk3HAbnGRlFS87sKAGQPkioDJSK98SGnK" />
    c.) Login ke akun Blogger anda
    d.) Pilih Design >> Edit HTML
     e.) Sebaiknya backup dulu template anda dengan cara klik Download Full
          Template
    f.) Masukan kode meta tag tadi diantara tag <head> dan <body> (anda
        boleh meletakkannya dibawah tag <head> atau diatas tag <body>, pilih
        salah satu saja)
    g.) Klik Save Template. Sekarang meta tag sudah terpasang di blog anda,
        ikuti langkah selanjutnya

4.)  Setelah memasang kode meta tag atau melakukan verifikasi dengan salah satu metode diatas, kembali ke halaman Verify Ownership lalu klik Verify.

Demikian tutorial Cara Daftar Blog ke Google Webmaster Tools. Sekarang Blog anda sudah terdaftar dan terverifikasi di Google Webmaster Tools. Langkah selanjutnya agar blog lebih mudah dicrawl oleh spiderbot adalah dengan mensubmit sitemap blog anda ke Google Webmaster Tools. Sitemap digunakan untuk memberiahu search engine tentang suatu halaman blog atau web agar dicrawl. Dengan membuat dan mensubmit sitemap ke Google Webmaster Tools, blog anda memiliki kemungkinan lebih besar untuk cepat dicrawl dan diindex search engine Google. Terimakasih atas kunjungan anda.

Update Cara Submit Sitemap Blog Ke Google Webmaster

Cara Membuat Sitemap Daftar Isi Pada Blog

Cara Membuat Sitemap Daftar Isi Pada Blog | Yepi Share - Cara Membuat Sitemap Daftar Isi Pada Blog. Sebelumya saya pernah posting tutorial Cara Membuat Daftar Isi atau Sitemap Pada Blogger, namun kelihatannya banyak yang tidak berhasil menggunakan cara itu. Kini saya update cara baru Cara Membuat Sitemap Daftar Isi Pada Blog tentunya sudah saya praktekan dan berhasil. Bisa dilihat di Sitemap saya. Caranya Sebagai berikut :

1. Login Blogger
2. Masuk Ke Posting
3. Pilih Edit Laman / Edit Page
4. Klik Laman Baru/New Page , Seperti yang ada digambar berikut :
Cara Membuat Sitemap Daftar Isi Pada Blog
5. Pada  Page Title anda isi Sitemap atau Daftar Isi sesuka anda.
6. Pada Tab Page Anda Pilih Edit Html, lihat gambar berikut :
Cara Membuat Sitemap Daftar Isi Pada Blog
7. Setelah anda pilih Edit Html, copy-paste kode script dibawah ini :

<div align="center">
<span style="font-size: large;"><strong><span style="color: blue;">DAFTAR ISI ARTICLE</span></strong></span></div>
<script src="http://www.abu-farhan.com/script/daftarisiblogger/blogtoc-min.js">
</script>
<script src="http://yepishare.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script>


8. Pada tulisan yang berwarna MERAH anda ganti dengan URL Blog Anda.
9. Kemudian Tayangkan Laman / Publish Post

Demikianlah sobat Cara Membuat Sitemap Daftar Isi Pada Blog, semoga tutorial saya ini bermanfaat untuk anda sekalian. Jika ada pertanyaan silahkan berkomentar dibawah. Asal komentarnya jangan jorok yah kawan. Budayakan beretika ketika kita berbicara dengan orang lain. Terimakasih sudah berkunjung.

Cara Memberi Kotak Pencarian Pada Blogger

Cara Memberi Kotak Pencarian Pada Blogger
Cara Memberi Kotak Pencarian Pada Blogger | Yepi Share - Cara Memberi Kotak Pencarian Pada Blogger, kali ini saya share mengenai tutorial blogger nih sobat. Tutorial kali ini membahas mengenai kota pencarian pada blogger. Kadang - kadang template yang sudah kita download telah di lengkapi oleh kotak pencarian tapi bagaimana dengan template yang tidak mempunyai kotak komentar ? Solusinya gampang sobat tinggal copy paste kok. Yuk langsung saja simak nih tutorial Cara Memberi Kotak Pencarian Pada Blogger :



1. Pilih Rancangan
2. Add Gadget
3. Html Java Script
4. Pastekan kode  berikut ini untuk model kotak komentar seperi ini :

Model 2



<form id="searchthis" action="http://namablog.blogspot.com/search" style="display:inline;" method="get">
<input id="b-query" maxlength="255" name="q" size="20" type="text"/>
<input id="b-searchbtn" value="Search" type="submit"/>

Model 2


<form id="searchthis" action="http://namablog.blogspot.com/search" style="display: inline;" method="get">
<tr>
<td nowrap="nowrap" valign="top" height="16" align="left">
<input id="b-query" maxlength="255" class="textinputsearch" value="" name="q" size="22" type="text"/>
<input id="b-searchbtn" alt="Search" width="18" src="http://i396.photobucket.com/albums/pp48/putro16/search.gif" height="19" align="top" type="image"/>
</form>

5. Save

Begitulah Cara Memberi Kotak Pencarian Pada Blogger, mudah bukan. Bagi kamu yang belum ada kotak pencarian pada blognya silahkan di coba nih tutorialnya. Semoga bermanfaat. Terimakasih atas kunjungannya.

Cara Menampilkan Gambar Pada HTML Blogger

Cara Menampilkan Gambar Pada HTML Blogger - Yepi Share Everything | Kali ini saya akan share mengenai blogger yaitu, cara menampilkan gambar pada html blog. Dilihat dari judul sepertinya mudah untuk melakukan itu, tapi ternyata dalam prakteknya akan timbul eror pada template blog biasanya. Kebanyakan Script ini digunakan untuk menampilkan gambar space iklan pada blog. Langsung saja anda simak Cara Menampilkan Gambar Pada HTML Blogger  berikut :

Script :
<a href="URL SITUS" target="_blank"><img src="URL GAMBAR" alt="NAMA TAUTAN" width="50" height="30" border="0" /></a>

Tutorial :
1. Siapkan gambar. ( Gambar bisa anda upload di https://picasaweb.google.com atau di media upload gambar yang lainnya)

2. Setelah anda upload silahkan anda ambil link gambar yang sudah anda upload. Contoh gambar yang saya gunakan, ( https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIz1Ez4hym9lYVSJ0Ynx1aciV-MM3AKvPOOW46e8BDoBkQFmSWsgShAK3x3OzZctc_E_GukwrVLzr0c1qQLRHf69YYeA2HDfoJ370wcoBbINna5qKVzwpjmgOLchp3-p0iSXYXLOnOyJik/s728/ADS%2520728X90.png )

3. Anda masukkan pada Link Gambar anda di URL GAMBAR
 Contoh : <a href="URL SITUS" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIz1Ez4hym9lYVSJ0Ynx1aciV-MM3AKvPOOW46e8BDoBkQFmSWsgShAK3x3OzZctc_E_GukwrVLzr0c1qQLRHf69YYeA2HDfoJ370wcoBbINna5qKVzwpjmgOLchp3-p0iSXYXLOnOyJik/s728/ADS%2520728X90.png" alt="NAMA TAUTAN" width="50" height="30" border="0" /></a>

4. Setelah itu pada URL SITUS anda isi dengan URL yang dituju jika gambar itu di klik oleh pengunjung blog. Saya menggunakan URL ( http://www.yepishare.com )
Contoh :  <a href="http://www.yepishare.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIz1Ez4hym9lYVSJ0Ynx1aciV-MM3AKvPOOW46e8BDoBkQFmSWsgShAK3x3OzZctc_E_GukwrVLzr0c1qQLRHf69YYeA2HDfoJ370wcoBbINna5qKVzwpjmgOLchp3-p0iSXYXLOnOyJik/s728/ADS%2520728X90.png" alt="NAMA TAUTAN" width="50" height="30" border="0" /></a>

5. Pada NAMA TAUTAN silahkan anda isi terserah dengan gambar yang anda tampilkan. saya ambil nama Yepi Share Everything.
Contoh : <a href="http://www.yepishare.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIz1Ez4hym9lYVSJ0Ynx1aciV-MM3AKvPOOW46e8BDoBkQFmSWsgShAK3x3OzZctc_E_GukwrVLzr0c1qQLRHf69YYeA2HDfoJ370wcoBbINna5qKVzwpjmgOLchp3-p0iSXYXLOnOyJik/s728/ADS%2520728X90.png" alt="Yepi Share Everything" width="50" height="30" border="0" /></a>

6. Setelah itu Untuk width dan height yang saya beri warna kuning, silahkan anda ganti dengan ukuran sesuka anda. ( Width : Panjang Gambar & Height : Tinggi Gambar )

Nah begitulah sobat Cara Menampilkan Gambar Pada HTML Blogger, semoga sedikit tidaknya dapat membantu sobat dan semoga bermanfaat. Terimakasih atas kunjungannya yah sobat.

Cara Mudah Mengganti Cursor Pada Blog

Cara Mudah Mengganti Cursor Pada Blog - Hari ini saya ingin memperbaharui tutorial cara mengganti/merubah cursor blog blogger, karena tutorial Cara Mengganti Cursor Blog yang sudah pernah saya tuliskan dulu sudah panjang akhirnya saya putuskan untuk membuat artikel baru dengan judul Cara Mudah Mengganti Cursor Pada Blog

Panduan Cara Mudah Merubah Cursor Blog Blogger

tutorial ini saya bagi menjadi 2, yaitu untuk blogger baru dan lama.

Tutorial Mudah Merubah Cursor Untuk Blogspot Baru

1. Klik Tata Letak
Cara Pasang Widget Jam Di Blogger (http://blog.ahmadrifai.net)

2. Klik Tambah Gadget / Add A Gadget
Panduan Pasang Widget Jam Di Blogger (http://blog.ahmadrifai.net)

3. Pilih Gadget Html/JavaScript
Tutorial Pasang Widget Jam Di Blogger (http://blog.ahmadrifai.net)
4. Masukkan kode widget jam yang sudah saya sertakan di bawah
5. Simpan (kamu juga bisa memindahkan letak widget jam tersebut dengan cara menarik gadget tersebut)

Tutorial Mudah Merubah Cursor Untuk Blogspot Lama

1. Klik Menu Rancangan / Design
Panduan Pasang Widget Jam / Clock Di Blogger
2. Klik Tambah Gadget / Add A Gadget
Panduan Pasang Widget Clock Di Blogger (http://blog.ahmadrifai.net)

3. Pilih Gadget Html/JavaScript
Tutorial Pasang Widget Clock Di Blogger (http://blog.ahmadrifai.net)
4. Masukkan kode widget jam yang sudah saya sertakan di bawah
5. Simpan (kamu juga bisa memindahkan letak widget jam tersebut dengan cara menarik gadget tersebut)

Kode Cursor Untuk Blogger Yang Harus Di Pasang

Silakan copy dan paste kode berikut:
<style type="text/css">
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLnSgxqobTGekqikR7hyACq4Am35oKc8e8-7_hN4H25VB6dOYlrjDq7tqPfroIDcRRNABoBz46yNAGDLrTR-hH0-tYt57WnmlUy_lV0ZfWM16N6mMJ5OfhoD9oS_U0jZr1qVyvP_IGHink/s1600/jasablogsitus-web-id.gif"), auto;}
</style>
Catatan:
Silakan rubah tulisan yang saya beri warna Merah dengan url gambar cursor yang kamu suka.
Jika kamu menggunakan semua kode yang saya tuliskan di sini (tanpa mengganti bagian yang saya beri warna Merah) maka cursornya terlihat seperti ini
 
Update !!!
Agar corsornya berubah secara permanen walaupun diarahkan kelink silakan gunakan kode seperti ini:
<style type="text/css">
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLnSgxqobTGekqikR7hyACq4Am35oKc8e8-7_hN4H25VB6dOYlrjDq7tqPfroIDcRRNABoBz46yNAGDLrTR-hH0-tYt57WnmlUy_lV0ZfWM16N6mMJ5OfhoD9oS_U0jZr1qVyvP_IGHink/s1600/jasablogsitus-web-id.gif"), auto;}
body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLnSgxqobTGekqikR7hyACq4Am35oKc8e8-7_hN4H25VB6dOYlrjDq7tqPfroIDcRRNABoBz46yNAGDLrTR-hH0-tYt57WnmlUy_lV0ZfWM16N6mMJ5OfhoD9oS_U0jZr1qVyvP_IGHink/s1600/jasablogsitus-web-id.gif"), auto;}
</style>
Catatan : Yang harus dirubah sama dengan yang sudah saya tuliskan di atas
Selamat mencoba, dan semoga ini bisa mempermudah teman dalam mengganti cursor blog bloggernya.

Cara Memasang Widget Twitter Pada Blog Lengkap

Cara Memasang Widget Twitter Pada Blog Lengkap - berhubung twitter tidak kalah pentingnya sama halnya facebook, kali ini saya share Cara Memasang Widget Twitter Pada Blog Lengkap. Kebanyakan dari berbagai blog/web masing-masing memasang widget status terbaru twitter dan tombol follow twitter pada blog/webnya masing-masing. Oleh karena itu saya akan membagikan tutorial ini dengan gambar supaya tampak jelas. Berikut tutorial Cara Memasang Widget Twitter Pada Blog Lengkap selengkapnya :


1. Log in twitter anda https://twitter.com/

2. jika anda sudah pada dashbor pilih gambar berikut :
kemudian anda pilih pengaturan sama seperti gambar diatas

3. Setelah itu anda masuk diarahkah ke dalam akun anda, kemudian anda pilih Profil.

4. Setelah itu anda akan dibawa ke dalam profil anda :
disini ada tulisan Anda juga dapat menambahkan Twitter ke situs Anda di sini . Nah pada tulisan tersebut anda klik.

5. Anda akan masuk ke sumber daya pada twitter. Ada Tombol, Widget, Logo Dll
silahkan anda pili salah satu.

>  Jika anda menginginkan Follow Twitter untuk Blog, silahkan anda ikuti tutorial dibawah ini:
1. Pilih pada Tombol Twitter (Klik)
2. Pilih pada Ikuti
 3. Kemudian Ambil kode dan letakkan pada Blog anda.

>  Jika anda menginginkan Status Terbaru Twitter Tampil Pada Blog, silahkan ikuti langkah berikut :
1. Pilih pada Widget (Klik)
2. Kemudian pada tampilan seduahnya anda, Pilih Situs Web Saya
 3. Pada tampilan selanjutnya anda pilih Widget Profil
 4. Pada tampilan selanjutnya, silahkan anda silahkan anda isi dengan selera hati anda :
    1. Pengaturan
    2. Preferensi
    3. Tampilan
    4. Ukuran
 5. Terakhir silahkan anda pilih Selesai & Ambil Kode
 6. Setelah itu tinggal anda Copy - Paste Kode kedalam web/blog anda.

Begitulah sobat mengenai tutorial Cara Memasang Widget Twitter Pada Blog Lengkap, semoga artikel ini bermanfaat dan dapat membantu anda. Akhir kata saya ucapkan terimakasih atas kunjungan anda.

Cara Menambah 2 Kolom Dibawah Header

   Cara Menambah 2 Kolom Dibawah Header - Kali ini saya share mengenai tutorial blog, tutorialnya yaitu Cara Menambah 2 Kolom Dibawah Header. Terkadang design template kita tidak memiliki 2 Kolom atau 2 Add Gadget di bawah header namun dengan tutorial Cara Menambah 2 Kolom Dibawah Header, itu akan menjadikan template blog anda memiliki 2 Kolom dibawah header. So tidak ada kata tidak bisa sebelum kita berusaha untuk menemukannya. Ok langsung saja kita menuju topik Cara Menambah 2 Kolom Dibawah Header, sebagai berikut :




1. Login Blogger anda
2. Pilih Rancangan dan Kemudian Pilih Edit HTML
3. Saya anjurkan anda Download Template Lengkap anda terlebih dahulu
4. Kemudian Centang  Expand Template Widget
5. CTRL+ F dan cari kode ]]></b:skin>
6. Setelah itu copas kode dibawah ini sebelu kode ]]></b:skin>

#box-kolom-widget { clear:both; } .box-widget { padding:0px 10px 10px 10px; border:1px dotted $bordercolor; }

7.Setelah itu cari kode <div id='main-wrapper'> atau <div id="main-outer"> 
8.Setelah itu copas kode dibawah ini diatas kode <div id='main-wrapper'> atau <div id="main-outer"> 

</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;'/>


9. Dan yang terakhir save template

   Nah begitulah sobat mengenai Cara Menambah 2 Kolom Dibawah Header, saya berharap anda berhasil dalam menerapkan tutoroial ini di blog anda. Saya ucapkan sekian terimakasih. salam sukses selalu :)

Cara Membuat Header Blog Menjadi 2 Bagian

   Cara Membuat Header Blog Menjadi 2 Bagian - Sudah lama Yepi Share Everything ngak posting mengenai blogger. Tuk kali ini saya akan share mengenai Cara Membuat Header Blog Menjadi 2 Bagian, dimana template biasanya header template blog hanya 1 bagian saja. Bisa dilihat pada gambar berikut ini :


Header 2 Bagian,Membuat Header Menjadi 2 Bagian

   Biasanya Header 2 Bagian memiliki fungsi sendiri-sendir yang pertama atau kita sebut header pertama untuk  Judul dan Deskripsi blog dan yang Header 2 biasanya untuk penempatan Gambar atau Iklan atau Html/JavaScript yang lainnya. Ok langsung saja, silahkan anda simak tutorial Cara Membuat Header Blog Menjadi 2 Bagian selengkapnya :



  • Seperti biasa dalam keadaan log in pada account sobat






  • Klik rancangan






  • Klik Edit HTML






  • Bisa Download Template Lengkap jika khawatir gagal






  • Sekarang cari kode CSS seperti yang mirip beikut:
    /* Header
    ----------------------------------------------- */
    #header-wrapper {
    width:930px;
    margin:0 auto 10px;
    border:1px solid $bordercolor;
    }
    #header-inner {
    background-position: center;
    margin-left: auto;
    margin-right: auto;
    }
    #header {
    margin: 5px;
    border: 1px solid $bordercolor;
    text-align: center;
    color:$pagetitlecolor;
    }







  • Ganti kode diatas dengan kode dibawah ini:
    /* Header
    ----------------------------------------------- */
    #header-wrapper {
    width:930px;
    margin:0 auto 0px;
    background:#ffff;
    height:180px;
    }
    #header-one {
    width:50%;
    background-position: left;
    margin-left: auto;
    margin-right: auto;
    float:left;
    }
    #header {
    margin: 0px;
    text-align: left;
    color:$pagetitlecolor;
    }
    #header_two{
    width:50%;
    float:left;
    padding-top:10px;
    }

    Perhatikan kode yang berwarna merah pada bagian awal, sesuaikan lebar atau angka width dengan lebar header template sobat.






  • Sekarang cari kode seperti berikut:
    <div id='header-wrapper'>
    <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
    <b:widget id='Header1' locked='true' title='Tempat Eksperimen Kecil (Header)' type='Header'/>
    </b:section>
    </div>







  • Setelah menemukan kode diatas, sisipkan kode warna merah berikut dengan penempatan yang menyarupai contoh dibawah ini:
    <div id='header-wrapper'>
    <div id='header-one'>
    <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
    <b:widget id='Header1' locked='true' title='Tempat Eksperimen Kecil (Header)' type='Header'/>
    </b:section>
    </div>
    <div id='header_two'>
    <b:section class='header' id='header2' preferred='yes'/>
    </div>
    </div>







  • Klik Simpan Template






  • Selesai





  •    Nah begitulah sobat mengenai Cara Membuat Header Blog Menjadi 2 Bagian, Semoga anda berhasil dan bermanfaat untuk anda sekalian.

    Cara Memasang Widget Hanya di Halaman Awal / Depan

       Cara Memasang Widget Hanya di Halaman Awal / Depan  - Pernahkah anda terfikir untuk menjadikan halaman awal (homepage) blogspot anda berbeda dengan halaman isi? Misalnya, widget-widget tertentu hanya muncul di homepage tapi tidak muncul dibagian dalam. (iklan atau link ke situs lain yang hanya membeli spot untuk halaman depan saja). Bisakah kita membuatnya ? Jawabnya bisa.

    Artikel berikut akan menjelaskan cara bagaimana sebuah widget atau link hanya tampil di bagian depan (homepage) blogspot.

    1. Seperti biasa, login ke dashboard blogspot.

    2. Masuk ke Layout > Add gadget dan pilih tipe gadget yang anda perlukan, kemudian simpan.

    3. Saatnya menambah sedikit kode sehingga widget yang baru anda tambahkan itu hanya tampil di bagian homepage saja. Masuk ke Edit HTML.

    4. Normalnya, widget dalam tampilan template dimulai dengan kode berikut ini.

    <b:widget id=


    Sebagai contoh, widget untuk label terlihat sebagai berikut:
    <b:widget id='Label1' locked='false' title='Title' type='Label'>

    dan widget html terlihat sebagai berikut:

    <b:widget id='HTML1' locked='false' title='' type='HTML'>

    sedangkan daftar list akan tampil seperti berikut:

    <b:widget id="LinkList2" locked="false" title="Title" type="LinkList">
    3. Cari kode untuk widget yang akan anda ubah.
    (Jika ingin tahu secara pasti apa widget id yang perlu anda ubah, cobalah lihat source code blog anda. In Firefox : View » Page Source sedangkan In IE : View » Source )

    Tepat di bawah widget id, anda dapat melihat tag b:includable seperti berikut..

    <b:includable id='main'>
    Pada titik ini, sebagian besar tugas kita sudah selesai, kita hanya perlu menambahkan sedikit kode di bawah tag b:includable tersebut, kodenya adalah :
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
    dan terakhir, kita harus menutup tag b:if . Cukup tambahkan kode berikut sebelum penutup tag b:includable.
    Seperti ini:

    </b:if>
    </b:includable>


    Nah, hasil akhir kode adalah seperti screenshoot di bawah ini:


    Jangan lupa simpan hasil pekerjaan anda. Kini, widget dimaksud hanya akan tampil di halaman depan / homepage saja.

    Memasang Widget Hanya Pada Halaman Postingan

    Kalau yang ini kebalikan dari kode sebelumnya. Kode ini hanya akan menampilkan widget atau gadget di Halaman Postingan blog saja  Sedangkan di halaman Home Page atau halaman utama widget tersebut akan hilang.

    <b:widget id='HTML10' locked='false' title='Judul-Widget' type='HTML'>

    <b:includable id='main'>

    <b:if cond='data:blog.pageType == &quot;item&quot;'> <!-- Hide widget at HOME Page -->

    <!-- 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>

    Widget Hanya Pada Link atau URL Tertentu Saja 

    Kalau kamu mempunyai satu halaman blog yang paling sering dikunjungi oleh visitor mungkin kamu ingin meletakkan tambahan iklan yang hanya akan muncul pada halaman itu. Hal yang perlu kamu lakukan hanyalah meletakkan kode yang berwarna merah dibawah ini dan mengganti Blog_Page_URL dengan link blog kamu yang paling banyak diminati tersebut.


    <b:widget id='HTML14' locked='false' title='Judul-Content' type='HTML'>

    <b:includable id='main'>

    <b:if cond='data:blog.url == &quot;BLOG_PAGE_URL&quot;'><!-- Put Widget On Specific Link-->

    <!-- 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>

    Memasang Widget di Label Tertentu

    Selain memasang widget atau gadget di link atau postingan tertentu kamu juga bisa memasangnya hanya pada label yang kamu inginkan.

    <b:widget id='HTML15' locked='false' title='Judul-Content' type='HTML'>

    <b:includable id='main'>

    <b:if cond='data:blog.url == "http://BLOG_NAME.blogspot.com/search/label/LABEL_NAME"'><!-- Put Widget On Specific Label-->

    <!-- 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>