0 Cara Menambah Gadget di samping Header

Kalau header yang biasa seperti itu, di bagian sampingnya tidak akan bisa ditambah dengan gadget. Kalau begitu saya akan memberi tahu tentang cara menambah gadget di samping header. So anda harus duduk dengan manis dan perhatikan tips berikut ini :

1. Login ke blogger.com
2. Pilih Layout/Tata Letak ---> Edit HTML
3. Lalu cari kode seperti ini :

----------------------------------------------------------------------------
/* Header
===================================
*/
#header-wrapper {
width:900px;
margin:0 auto 0px;
background:$bgheadercolor url(http://ahom24.googlepages.com/magazine_01.jpg) no-repeat top center;
height:190px;
}

#header-inner {
width:900px;
background-position: center;
margin-$startSide: auto;
margin-$endSide: auto;
}

#header {
margin: 0px;
text-align: left;
color:$pagetitlecolor;
}
----------------------------------------------------------------------------
4. Lalu ganti kode tersebut dengan kode berikut ini !
----------------------------------------------------------------------------
/* Header
===================================
*/

#header-wrapper {
width: 900px;
margin:0 auto 0px;
background:$bgheadercolor url(http://ahom24.googlepages.com/magazine_01.jpg) no-repeat top center;
height: 190px;
}

#head-inner {
width:600px;
background-position: left;
margin-left: auto;
margin-right: auto;
float:left;
}

#header {
margin: 0px;
text-align: left;
color:#ffcc66;
}

#r_head{
width:300px;
float:left;
padding-top:10px;
}
----------------------------------------------------------------------------

Kode yang berwarna merah 900px adalah panjang header, kode yang berwarna hijau 190px adalah tinggi header.

5.Kemudian cari kode seperti di bawah ini !
----------------------------------------------------------------------------
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/>
</b:section>
</div>
----------------------------------------------------------------------------
6. Kalau sudah ketemu ganti kode tersebut dengan kode di bawah ini !
----------------------------------------------------------------------------
<div id='header-wrapper'>
<div id='head-inner'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/>
</b:section>
</div>
<div id='r_head'>
<b:section class='header' id='header2' preferred='yes'/>
</div>
</div>
----------------------------------------------------------------------------
7.Klik tombol simpan template.
Kemudian pilih Elemen Halaman, lalu lihat perbedannya.
----------------------------------------------------------------------------
Sebelum :

----------------------------------------------------------------------------
sesudah :

----------------------------------------------------------------------------
info ini diambil dari  sini klik

0 Cara Menambah Gadget di Atas dan Bawah Header

Tak usah banyak basa basi, ntar jadi basah hehe........
jika anda berminat untuk menambah gadget di atas dan di bawah header silahkan ikuti tips berikut ini :

1. Login ke blogger.com
2. Pilih Layout/Tata Letak ---> Edit HTML
3. Cari kode berikut ini !!

<b:section class="header" id="header" maxwidgets="1" showaddelement="no">

4. Biar cepat menemukannya tekan Ctrl+F
5. Kalau sudah ketemu ganti kode tersebut dengan kode berikut ini !!!

<b:section class="header" id="header" preferred="yes">

6. Klik tombol simpan template.
7. Kemudian klik tombol Elemen Halaman dan lihat perubahannya, jika ingin menambah gadget tinggal klik aja tulisan Tambah Gadget.
8. Jika ingin di letakkan di bawah header tinggal geser aja gadget yang baru dibuat tadi, lalu pindahkan di bawah header kemudian klik tombol simpan. Selesai dheee !! Assalamu’ alakum wr. wb.

Contoh Gadget di Bagian Atas Header

0 Cara mengelompokkan artikel dalam label/ kategori

Untuk mempermudah para pembaca yang mengunjungi blog kita ada baiknya kita mengelompokkan artikel berdasarkan kategori tertentu. Di Blogger untuk membuat kategori dikenal dengan istilah Label.

untuk membuat label tersebut ikuti petunjuk berikut ini:

1. Login ke blogger
2. Klik Posting --> Edit Post

* Membuat Kategori / Label

Pilih atau beri tanda centang pada artikel yang ingin diberi label/dikategorikan. Lalu pada Combo box (yang ada tulisannya "label action") pilih "New Label" lalu beri nama label tersebut.

* Menghapus Kategori / Label

Beri tanda centang pada postingan yang ingin dihapus labelnya, trus klik combo box trus klik label dibawah tulisan "Remove label"

* Mengganti Kategori / Label

Hapus dulu label yang ada, kemudian kasih label baru.

3. Cara menampilkan di blog:
1. Klik Template --> Page Elements
2. Tambahkan page elements kemudian pilih Label Kemudian diatur menurut selera…

0 Cara Menambah Widget di Bawah Header Blogspot

Kita tahu bahwa di bawah header blogspot tidak dapat diletakkan widget. Kenapa? itu adalah masalah template. Kode template telah mengunci header sehingga tidak bisa ditambahkan widget di bawahnya. Lalu bagaimana agar bisa ditambahkan? Ikuti metode di bawah ini :

Cari kode di bawah :

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='your blog title (Header)' type='Header'/>
</b:section>

Dari kode di atas terlihat, maksimal widget adalah satu, tidak ditampilkan add element, dan dikunci. Ubahlah menjadi seperti berikut :

<b:section class='header' id='header' maxwidgets='2' showaddelement='yes'>
<b:widget id='Header1' locked='false' title='your blog title (Header)' type='Header'/>
</b:section>

Bagian maxwidgets terserah Anda diisi dengan angka berapa sesuai kebutuhan Anda. Sekian..ada yang ingin menambahkan?

0 mengoptimalkam blog supaya cepat di index oleh SEO

sepantasnya sebelum kita mengundang atau mendaftarkan blog kita ke mesin pencari google dan yahoo ( lihat ). blog kita sudah di isi atau diberi sebuah meta tag, yaitu sebaris  informasi tentang conten dan deskripsi blog kita dengan serangkainya kata kunci atau sering di istilahkan dengan keywords ( sebaris kata atau phrases yang kita tentukan ).

Kata kunci apa yang cocok dengan blog kita ?

Tentu saja yang sesuai dengan isi blog. jangan sampai antara meta tag dan isi blog tidak bersesuaian. karena dengan memanipulasi kata kunci setidaknya akan merugikan dan membuang-buang waktu bagi pengguna internet yang mengharapkan informasi yang relevan.

Sebagai contoh jika blog kita membahas tentang parawisata, maka keywordnya adalah parawisata. Jika blog kita membahas tentang politik, maka keywordnya adalah politik.

Dan yang lebih bagus ketika membuat keyword harus di tambah dengan kata yang lebih spesifik lagi.

Misalkan tentang parawisata bisa di tambah dengan kata yang lebih specifik lagi, seperti Tip parawisata, panduan parawisata dll. Tentang politik : politik islam, politik uang, demokrasi politik dll.

Baiklah saya asumsikan kita telah menemukan kata kunci yang cocok untuk di pasang sebagai meta tag blog. tugas kita sekarang menyisipkanya ke dalam template new blogger kita.

1. buka blog kita dalam tab Template - klik Edit Html.

2. Cari kode ini ( masih dibarisan atas Html.)

<title><data:blog.pageTitle/></title>

2. Kemudian di bawahnya tambahkan atau masukan kode ini .

<meta content='ISI DESCRIPTION ' name='description'/>
<meta content='ISI KEYWORDS ' name='keywords'/>
<meta content='ISI AUTHOR NAME' name='author'/>

Isi Description : Isi dengan keterangan blog kita.
Isi Keywords : Isi dengan kata kunci yang di pisahkan dengan koma misalkan : Politik, Politik Order Baru, Demokrasi Politik.
Isi Author Name : isi dengan nama kita.

ilustrasi gambar.

0 Menambah widget Google Translate ke blogspot

Mungkin ada diantara teman-teman yang ingin memasang / menambag "widget Google Translate" di blog anda sehingga blog anda bisa di translate seketika ke bahasa yang anda suka

Sebenarnya ada sebuah situs yang menawarkan layanan gratisan, yang bisa anda manfaatkan. jadi tidak perlu pusing memikirkan rumitnya script, karena scriptnya telah disediakan oleh situs tersebut, anda hanya pelu meng-copy-nya dan memasang (tambah/pasang) script widget widget Google Translate ke blog anda.

Gadget/widget Google Translate, sebenarnya bisa anda tambahkan dengan menambah gadget translator yang telah tersedia di dalam List Gadget Blogger, pada saat melalukan perintah Tambah Gadget, tetapi ada alternatif lain, yang sebenarnya lebih sederhana bentuknya, Anda hanya perlu melakukan copy script kemudian memasukkannya ke Gadget html/javascript
1. Anda masuk ke alamat : http://translate.google.com

2. di samping ada 3 pilihan, anda pilih Tools and Resources

3. Tentukan bahasa yang anda suka
4. Copy scrip
5. masuk ke acount blog anda, lalu tambahkan " Gadget html/javascript" seperti gambar berikut

6. Paste scrip yang di copy tadi, perhatikan gambar diatas



atau jika anda males mencari script, karena anda ingin yang gampang, copy saja script berikut :
1. script untuk bahasa indonesia

---

<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'id'
  }, 'google_translate_element');
}
</script><script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>


2. script untuk bahasa inggris

---

<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'en'
  }, 'google_translate_element');
}
</script><script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

lihat hasilnya

0 Membuat Nomor Halaman / Page Number di Blogspot

Baru beberapa hari lalu saya menemukan artikel yang benar-benar saya cari.
Adalah bagaimana cara membuat halaman berurut 123 /page 123 navigation untuk blog di blogger/blogspot.

Kode membuat halaman 123 di blogspot ini,saya dapat dari hasil karya besar Bp.Wijaya di ariawijaya.com
Anda bisa mengunjungi website dan tutorial 123 page navigation ini di situsnya langsung dalam tutorialnya 'Membuat Navigasi Page Number Blogspot',atau anda bisa langsung klik

Untuk hasilnya akan seperti gambar dibawah ini:

Sedangkan contoh hasil kode navigasi berurut ini,anda bisa lihat di sini.

Langkah Cara Membuat Page Navigasi Angka / Number 123dst pada Blog.


Pertama,pergilah ke dashboard blogger anda,selanjutnya,pilih tata letak,dan pilih edit html.
Seperti biasa,contreng option expand widget templates,selanjutnya cari kode berikut:
--------------------------------------------------------------------------------
]]></b:skin>
--------------------------------------------------------------------------------
Setelah ketemu,letakkan kode dibawah ini persis diatasnya kode css ( ]]></b:skin> )

--------------------------------------------------------------------------------
.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}

--------------------------------------------------------------------------------
Lalu,cari lagi kode seperti ini:
--------------------------------------------------------------------------------
</body>
--------------------------------------------------------------------------------
Jika sudah ketemu,tepat diatasnya letakkan script dibawah ini:
--------------------------------------------------------------------------------
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/>
</b:if>
--------------------------------------------------------------------------------
Langkah terakhir,carilah kode berikut:
--------------------------------------------------------------------------------
'data:label.url'
--------------------------------------------------------------------------------
Jika sudah ketemu,hapus kode tersebut dan gantilah kode berikut:

--------------------------------------------------------------------------------
'data:label.url + &quot;?&amp;max-results=5&quot;'
--------------------------------------------------------------------------------
Sekarang,simpan templates anda,dan anda bisa lihat hasilnya sekarang :D
--------------------------------------------------------------------------------
selesai
--------------------------------------------------------------------------------

---

referensi sumber : http://ariawijaya.com/javascript:void(0)