Menambahkan Gambar Disamping Judul Posting

Cara menambahkan gambar disamping judul posting blog.

Gambar diatas dengan lingkaran merah adalah contoh gambar yang ditempatkan di samping kiri posting blog, gambar tersebut akan muncul di setiap posting blog yang ada. Akan saya coba jelaskan secara detail, agar bisa di mengerti. Ikuti langkah-langkah dibawah ini.

1. Login ke blogger, ke pangaturan template.
2. Selanjutnya klik edit HTML dan cari kode ]]></b:skin> dan pasang kode berikut di atas kode ]]></b:skin>
h3.post-title {
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwsbTAnLSl1nFRg7w74pHLWYv6J7Xw6yRk2MgGT2Z1Is8aY_6tZu-KQ6igprQr_6Ibf06ylMpf-VlXK_IFc37Lh-HFnRKHpAYQr5gEaOpZetxjS4ybOsMqwvRWVAto5xIhn0bzvNdlpXfB/s1600/32x32.jpg")no-repeat;padding:10px 0px 0px 40px;}
3. Save template, Selesai.

Keterangan kode langkah 2:

url("gambar.jpg") adalah kode url sumber gambar yang akan digunakan.
no-repeat membuat gambar tidak berulang.
padding:10px 0px 0px 40px; mengatur posisi tulisan judul posting.

Jika gambar ingin ditempatkan disebelah kanan atau tengah judul posting blog. Tambahkan kode berikut disamping no-repeat; contoh: no-repeat top right;

•  right untuk bagian kanan.
•  center untuk bagian tengah

Untuk membuat icon dengan gambar sendiri, silakan baca di cara membuat icon website. Dan untuk cara mengambil URL dari gambar sendiri, baca di cara upload dan ambil url gambar.

Itulah sedikit cara untuk mendesain blog sendiri, dengan menambahkan gambar disamping judul posting blog, yang akan muncul disetiap posting artikel yang ada di blog. Silakan baca juga cara membuat tulisan bayangan di blog di judul, deskripsi blog bagian tab, sidebar dikiri-kanan blog, sampai judul posting, bisa kita beri tulisan bayangan. Semoga Bermanfaat.

Cara Mengganti Tulisan Beranda,Posting Lama,Posting Lebih Baru

Cara mengganti tulisan beranda, posting lama, posting lebih baru di blog dengan kata-kata sendiri atau dengan gambar navigasi halaman.Tulisan tersebut berada di bawah bagian akhir pada saat kita membuka artikel, atau bagian bawah dari daftar posting di halaman awal blog. Untuk blog berbahasa inggris biasanya bertuliskan home, next, previous. Untuk lebih jelasnya lihat gambar dibawah ini.

Tulisan seperti contoh gambar diatas itulah yang akan kita ganti. cara mengganti tulisan beranda, posting lama, posting lebih baru di blog. Ikuti langkah-langkah dibawah ini.

1. Login ke blog, dan pilih pengaturan template.
2. Selanjutnya klik Edit HTML dan cari 3 kode Biru dibawah ini. Gunakan Ctrl F untuk mempermudah Pencarian.
1. expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
Keterangan: Posting Lebih Baru(Previous)

2. expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
Keterangan: Posting lama(Next)

3. <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
Keterangan: Beranda(Home)
3. Jika hanya ingin mengganti tulisannya saja dengan kata-kata kita sendiri. maka ganti Format kode diatas menjadi seperti ini.
expr:title='data:olderPageTitle'>Selanjutnya</a>
expr:title='data:newerPageTitle'>Sebelumnya</a>
<a class='home-link' expr:href='data:blog.homepageUrl'>Rumah</a>
4. Ganti kode warna merah dengan kata yang kamu inginkan. Untuk beranda/home ada 2 kode yang sama, ganti kedua2nya. Selanjutnya Preview, jika sudah berubah baru save.
5. Jika ingin mengganti tulisannya dengan gambar, maka tambahkan Url gambar, Contoh:
expr:title='data:newerPageTitle'><img src='http://c.dryicons.com/images/icon_sets/blue_velvet/png/32x32/back.png'/></a>

expr:title='data:olderPageTitle'><img src='http://b.dryicons.com/images/icon_sets/blue_velvet/png/32x32/forward.png'/></a>

<a class='home-link' expr:href='data:blog.homepageUrl'><img src='http://c.dryicons.com/images/icon_sets/blue_velvet/png/32x32/home.png'/></a>
6. Kode warna Biru itu URL gambar dengan tambahan formtanya. Beranda/home ada 2 kode yang sama, ganti kedua2nya. Jika sudah, silakan dipreview dulu, klo sudah berubah baru save.
7. Untuk mengganti dengan gambar lain, ganti url gambar, dengan url gambar yang kamu inginkan. Format gambar seperti dibawah ini.
<img src='URL gambar kamu'/></a>
8. Coba cari digoogle gambar, dengan kata kunci icon home. Cari gambar yang ada pilihan ukurannya. Pilih gambar ukuran 32 atau sesuai dengan yang kamu inginkan. Selanjutnya Copy URLnya(klik kanan tepat digambar dan pilih copi URL gambar) dan masukan kodenya di format kode diatas.
9. Salah satu web yang menyediakan icon gambar adalah http://dryicons.com/icon/blue-velvet/home/ silakan dicari gambar yang sesuai dengan yang kamu inginkan.

Silakan dibaca juga cara menghilangkan diberdayakan oleh blogger yang berada dibawah posting blog dan juga fitur-fitur lainnya, seperti navbar, langganan entri atom dan masig banyak lagi. Itulah sedikit cara untuk mendesain blog sendiri menggunakan template asli blogger, yaitu dengan mengganti tulisan beranda, posting lama dan posting lebih baru di blog. Semoga Bermanfaat.

Membuat Menu Dropdown di Blogspot

Cara Membuat Menu Dropdown yang terletak di bawah header Blog.

Ikuti langkah-langkah dibawah ini.

1. Kunjungi situs http://cssmenumaker.com/
2. Pilih salah satu menu dropdown yang kamu inginkan.
3. Sebagai contoh Blue Opera Drop down menu. Gambar paling pertama dari gambar diatas. Selanjutnya klik Customize.

4. Dan Atur Isi Menu dropdown dengan nama dan URL yang kamu inginkan.

5. Keterangan gambar diatas:
• Gunakan Add Item untuk menambah isi menu, atau klik tanda silang merah untuk menghapus isi menu.
• Untuk mengganti nama Judul, Klik menu structure dan  isi dibagian Title.
• Untuk mengganti URL,  Isi bagian Link dengan URL yang kamu inginkan.
• Dan klik Update Item.
6. Setelah selesai mengisi menu. Selanjutnya copy semua kode HTML dan CSS di website tersebut, lalu pastekan di gadget HTML/Javascript di blogger. Contoh Pemasangan:
1. Login ke blogger. Dari halaman dasbor pilih pengaturan Tata Letak.
2. Klik Tambahkan Gadget, lalu pilih HTML/Javascript.
3. Lalu Susun Kode HTML dan CSS seperti ini.

<style>
Masukan Kode Css
</style>
Masukan Kode HTML

4. Save Gadget, lalu pindahkan ke bawah header.
7. Jika menu dropdown nya tidak turun atau tidak terlihat???
1. Login ke blogger. Dari halaman dasbor pilih pengaturan Template.
2. Klik Edit HTML dan cari kode
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
3. Setelah ketemu, ganti 1 menjadi 3 dan no menjadi yes
4. Kodenya jadi seperti ini.
<b:section class='header' id='header' maxwidgets='3' showaddelement='yes'>
5. Save template.
6. Selanjutnya kembali ke pengaturan tata letak.
7. Dan pindahkan Gadget HTML/Javascript menu dropdown tadi, tepat dibawah Header.
8. Lalu klik Save/Simpan Setelan.


9. Terakhir, lihat tampilan blog kamu. Selesai.

Untuk menu yang lebih mudah, bukan dropdown, tapi menu dari laman blogger, silakan baca disini cara membuat dan mengisi menu blog. Semoga Bermanfaat

Tombol Sosial Share Widget Untuk Blogger

Tombol sosial share widget untuk blogger. Seperti facebook tombol like, send, subcribe, recommend, Twitter follow, Google +, Google + 1 dan masih banyak lagi. Tombol share akan muncuk dibawah posting disetiap artikel yang ada di blog.

Untuk lebih jelasnya ikuti langkah-langkah dibawah ini.

1. Kunjungi situs sharethis.com
2. Selanjutnya lakukan registrasi pendaftaran disitus tersebut.
3. Setelah selesai melakukan registrasi, silakan masuk Log In.
4. Dan klik Get Sharing Tools. 
5. Selanjutnya Step 1 pilih Platform Blogger
6. Step 2 Style, pilih bentuk tombol share yang kamu inginkan.
7. Step 3, atur tombol share yang akan dipasang di blog.

8. Setelah selesai, klik Finish Get the Code dan Pilih Multi Post
9. Selanjutnya klik Go, maka akan terbuka halaman baru Import Elemen Laman.

10. Dan klik Menambah Widget, pindahkan saja widget ke bagian footer bawah blog. Selesai.

Tombol sosial share sudah ada di blog, tapi muncul juga dihalaman awal blog. Cara menyembunyikannya, agar muncul hanya di bagian posting blog saja. Ikuti langkah-langkah dibawah ini.

1. Login ke blogger, dari halaman dasbor pilih pengaturan Template.
2. Selanjutnya klik Edit HTML dan cari kode share this yang mirip dengan kode dibawah ini.
<b:widget id='HTML1' locked='false' title='ShareThis' type='HTML'>...</b:widget>
3. Semua kode masih tersembunyi, klik tanda >...< untuk membuka semua kode, sehingga tampilannya menjadi seperti ini.
<b:widget id='HTML1' locked='false' title='ShareThis' type='HTML'>
<b:includable id='main'>...<b:includable>
</b:widget>
4. Klik lagi tanda >...< maka akan terbuka semua kode sharethis seperti dibawah ini.
<b:widget id='HTML1' locked='false' title='ShareThis' type='HTML'>
    <b:includable id='main'>
  <!-- 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:includable>
  </b:widget>
5. Sekarang, tambahkan kode <b:if cond='data:blog.pageType == "item"'> dan </b:if> diantara kode lengkap sharethis diatas, contohnya:
<b:widget id='HTML1' locked='false' title='ShareThis' type='HTML'>
    <b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
  <!-- 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:if>
  <b:include name='quickedit'/>
</b:includable>
</b:widget>
6. Terakhir, Preview template, jika sudah hilang dari halaman awal blog, baru save template, Selesai.

Sekarang coba buka salah satu artikel di blog, dan lihat tombol sosial share yang sudah kamu buat tadi akan muncul dibawah posting, disetiap artikel yang ada. Jadi tidak menggangu tampilan awal halaman blog.

Silakan dibaca juga artikel lainnya tentang cara membuat komentar facebook diblog yang berada dibawah artikel blog, agar blog bisa dikomentari menggunakan akun facebook. Atau cara membuat facebook like page yang berbentuk kotak dengan tombol Like halaman, serta tampilan foto pengguna facebook yang menyukai halaman blog. Semoga Bermanfaat.

Breadcrumb Seo untuk Blogspot

Breadcrumb Seo untuk Blogspot. Breadcrumb berguna untuk memudahkan google untuk menelusuri isi dari blog kita, dan juga memudahkan pembaca melihat informasi letak artikel yang sedang dibaca. Breadcrumb letaknya berada di bawah menu header, dan diatas judul artikel yang sedang dibuka. Untuk lebih jelasnya, lihat contoh gambar dibawah ini.

Cara membuat breadcrumb seo untuk blogspot. Ikuti langkah-langkah dibawah ini.

1. Login ke blogger, dari halaman dasbor pilih pengaturan template.
2. Selanjutnya klik edit HTML dan cari kode <b:include data='top' name='status-message'/> dan masukan kode berikut ini diatasnya.
<b:include data='posts' name='breadcrumb'/>
3. Setelah itu cari kode <b:includable id='main' var='top'> dan masukan kode berikut ini diatasnya.
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == "static_page"'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v="http://rdf.data-vocabulary.org/#">
<span typeof="v:Breadcrumb"><a expr:href='data:blog.homepageUrl' rel="v:url" property="v:title">Home</a></span>
<b:loop values='data:post.labels' var='label'>
 » <span typeof="v:Breadcrumb"><a expr:href='data:label.url' rel="v:url" property="v:title"><data:label.name/></a></span>
</b:loop>
 » <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == ""'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
4. Save template, selesai.
5. Jika ingin merubah tampilan breadcrumb, tambahkan kode css diatas ]]></b:skin>
.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%;
line-height: 1.4em;
border-bottom:3px double #e6e4e3;}
6. Silakan ubah sendiri, kode css nya sesuai dengan yang kalian inginkan.

Dari sini, pembuatan breadcrumb sudah selesai. Sekarang mengecek breadcrumb di google. Breadcrumb yang terindeks google, tampilannya akan seperti gambar dibawah ini.

Cara ceknya:

1. Kunjungi situs google http://www.google.com/webmasters/tools/richsnippets
2. Selanjutnya masukan URL dari salah satu artikel di blog kamu.
3. Klik Pratinjau, Selesai.

Setelah memasang breadcrumb seo di blog, google akan mengindeksnya dalam beberapa hari di hasil pencarian google. Silakan dibaca juga artikel lainnya tentang seo, yaitu tentang Belajar seo untuk blogger pemula Semoga Bermanfaat.

Belajar Seo untuk Blogger Pemula

Belajar Seo untuk blogger pemula. Seo atau search engine optimization berguna untuk meningkatkan peringkat artikel blog di mesin pencari google. Atau cara agar artikel blog berada di halaman pertama di google, ketika ada orang yang memasukan kata kunci di google search yang sesuai dengan isi dari artikel yang sudah kita buat.

Bicara tentang seo, ada banyak faktor yang membuat artikel bisa berada di halaman pertama google, dari umur blog, content isi dari artikel yang berkualitas, backlink dan banyak lagi yang lain. Disini kita akan mempelajari dasar-dasarnya terlebih dahulu. Dari mengubah title judul blog, menambahkan deskripsi, keywoards, dan tools seo yang sudah disediakan oleh blogger. Untuk lebih jelasnya ikuti langkah-langkah dibawah ini.

Merubah Judul Title Blog

1. Login ke blogger > pengaturan template  > Edit HTML
2. Dan Cari kode <title><data:blog.pageTitle/></title> ganti menjadi
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/> | Desain Blog Tutorial dan Tips Trik Blogspot</title>
<b:else/>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if>
3. Ganti "Desain Blog Tutorial dan Tips Trik Blogspot" dengan judul yang kamu inginkan, tidak lebih dari 60 karekter. Dan tanda | dan - itu batas pemisah.
4. Save template, selesai.

---

Menambahkan meta deskripsi di Halaman awal dan setiap posting blog

1. Login ke blogger, dari halaman dasbor pilih Setelan > Preferensi Penelusuran > Tag Meta Deskripsi.
2. Pilih Aktifkan deskripsi penelusuran, dan isi deskripsi blog dengan penjelasan dari judul blog, panjang deskripsi Maksimum 150 karakter.

3. Simpan Perubahan, Selesai.
4. Sekarang, menambahkan Deskripsi di setiap posting blog.
5. Buka Entri Baru atau Edit posting yang ada. 
6. Dan Lihat bagian kanan entri, di bagian Deskripsi penelusuran isi dengan penjelasan dari isi posting blog, disarankan 20-30 kata saja.

7. Setelah itu klik selesai.

---

Menambahkan meta keywords kata kunci Blog

1. Login ke Blog, pengaturan template, edit HTML dan tempatkan keywoard yang berhubungan dengan isi blog, dibawah kode judul blog tadi.
<meta content='Fandra Juani,Desain blog,blogger,blogspot,tutorial,cara,belajar,Tips,Trik,edit template,pemula' name='keywords'/>
2. Ganti kata kunci diatas dengan kata kunci yang kamu inginkan. Isi keywords dengan kata kunci yang berbeda satu sama lainnya dan pisahkan setiap kata dengan tanda koma.

Setelan mengganti Title judul blog, menambahkan deskripsi dan keywords. Sekarang test tingkat seo blog kita, kunjungi http://www.submitshop.com/seo-tools/meta-tag-analyzer untuk melihat berapa skor seo title keseluruhan blog. Setelah selesai, lanjut ke langkah seo berikutnya yaitu menambahkan title dan alt gambar di posting blog.

---

Menambahkan Title dan Alt text gambar blog

1. Klik gambar di entri blog, dan isi title text dengan kata kunci 1 sampai 3 kata saja. Dan isi Alt text dengan penjelasan kata kunci gambar, jangan terlalu panjang. Contoh:

2. Isi setiap gambar dengan title dan alt yang sesuai dengan isi dari posting blog.

---

 Mengatur Tautan Permanen URL Posting Blog

1. Buka Entri Baru, dan klik bagian kanan entri pada Tautan permanen. Contoh:

2. Gunakan Tautan Permanen Khusus, jika judul posting terlalu panjang. Buatlah URL yang masih bisa dimengerti maksudnya, walaupun diperpendek url nya, setidaknya 4 sampai 7 kata saja. Setelah di publikasikan URL posting blog tidak bisa diedit lagi alias permanen, karena itu setiap kita membuat entri baru, buatlah judul yang benar-benar sesuai dengan isi dari posting artikel.

Selanjutnya adalah menambahkan Internal link url dari satu posting ke posting yang lain. Masukanlah Link Url dari posting atau artikel yang saling berhubungan antara satu dengan yang lainnya. Contoh: Jika kita sedang membuat artikel dengan judul belajar membuat blog, maka masukanlah link url dari posting kita yang lain seperti belajar menulis blog yang telah dipublikasikan sebelumnya.

---

Cara Menggunakan Internal Link Blog

1. Klik Link pada bagian tools entri, dan masukan url artikel dari dalam blog. contoh:

2. Masukan url di bagian web address, dan ganti tulisan di bagian text to display dengan judul atau isi dari url tersebut.
3. Jangan gunakan kata Disini atau Klik Disini, Baca Disini pada bagian text to display.
4. Gunakanlah kalimat sesuai judul, maksimal 4 sampai 5 kata saja, jangan panjang-panjang.
5. Selanjutnya klik Ok. Abaikan saja pengaturan yang lainnya.

Seperti contoh diatas, saya memasukan link url dari posting yang lain berjudul cara mempercepat loading blog dengan 4 kata saja. URL yang dimasukan sesuai dengan isi dari artikel ini, tentang belajar seo, karena loading juga mempengaruhi seo. Sekarang coba klik tulisan ini tentang cara menulis artikel di blog , maka akan terbuka halaman baru yang berisi artikel lain yang ada di blog ini.

Terakhir adalah tentang Eksternal link atau memasukan URL dari situs lain diluar blog kita. Contohnya facebook.com yahoo.com dan lain-lain. Cara memasukannya di posting blog, sama seperti memasukan url internal link, yang membedakan adalah kita harus mencentang Add 'rel=nofollow' attribute. Untuk meningkatkan seo blog di google.

Untuk lebih jelasnya lagi tentang belajar seo blogger, coba cari di google dengan kata kunci seo for blogger, baca dari situs google, jangan situs lain, biasanya dalam format PDF untuk seo starter guide, isinya lebih lengkap dari cara diatas dan yang pasti sumber terpercaya dari google sendiri. Semoga Bermanfaat.

Tips dan Trik Mempercepat Loading Blog

Tips dan Trik Mempercepat Loading Blog. Untuk lebih jelasnya, ikuti langkah-langkah dibawah ini.

Tips Mempercepat Loading Blog

1. Mempersingkat Tampilan awal atau home blog dengan cara membuat baca selengkapnya di setiap halaman posting. Dengan begitu loading blog dihalaman awal blog akan terbuka lebih cepat.
2. Mengurangi atau mendelete widget yang tidak diperlukan, seperti widget jam, tanggal dan lain-lain. Jika memang tetap ingin mempertahankan widget2 tersebut, tempatkan widget di bagian footer bawah blog. Maka loading blog akan sedikit bertambah cepat, karena bagian-bagian terberat blog akan dibuka belakangan. 
3. Menampilkan 4 sampai 5 posting saja di halaman beranda/home blog. 
4. Jangan terlalu banyak menggunakan gambar di blog.
5. Kompres gambar yang akan dimasukan di blog, menggunakan Ms. Office Picture Manager atau software Compress gambar lainnya.
6. Menghilangkan gambar tang obeng diblog,  yang berada di setiap bagian widget yang digunakan.
7. Compress Template Blog. Caranya, silakan lihat di bawah.
8. Menghilangkan sidebar widget pada halaman tertentu. Caranya, lihat dibawah.
9. Mengatur lebar gambar agar tidak melebihi halaman posting.

---

Trik Mempercepat Loading Blog

---

Sebelumnya, test dulu kecepatan blog kamu di situs ini http://gtmetrix.com. Untuk melihat berapa skor kecepatan dari blog kamu. Selanjutnya, setelah melakukan cara-cara dibawah ini, test kembali kecepatan loading blog kamu di situs tersebut, untuk melihat berapa besar perbedaannya.

---

Cara Kompres Template Blog

---

1. Login ke blog, Dari halaman dasbor pilih pengaturan template.
2. Edit HTML dan Copy semua kode yang ada di template kamu dari awal sampai akhir.
3. Selanjutnya kunjungi situs http://htmlcompressor.com/compressor.html
4. Dan Pastekan semua kode tadi ke kotak yang ada disitus tersebut.
5. Setelah itu click COMPRESS dan pilih CHANGE

6. Terahir, Copy semua kode hasil compress tadi, dan pastekan ke template blog kamu. Save template, Selesai.

---

Menghilangkan Sidebar Widget pada halaman tertentu

---

1. Ada 2 cara menyembunyikan sidebar widget di halaman terntentu di blog.
2. Cara Pertama, Login ke blogger > pengaturan template > edit html > cari kode </head>
3. Dan tempatkan kode berikut diatas </head>
<b:if cond='data:blog.url == "http://fandrajuani.blogspot.com/p/daftar-isi_12.html"'>
<style type='text/css'>
.main-inner .columns {
padding-left: 0px;
padding-right: 0px;
}
.main-inner .column-left-outer {
display: none;
}
.main-inner .column-right-outer {
display: none;
}
</style>
</b:if>
4. Ganti ihttp://fandrajuani.blogspot.com/p/daftar-isi_12.html dengan URL halaman yang ingin sidebarnya disembunyikan. Save Template, selesai.
5. Cara kedua, cari kode <head>,
6. Dan tempatkan kode berikut diatas <head>
<b:if cond='data:blog.url == "http://fandrajuani.blogspot.com/p/hubungi.html"'>
<style type='text/css'>
.sidebar{
display: none;
}
</style>
</b:if>
7. Ganti http://fandrajuani.blogspot.com/p/hubungi.html dengan url dari halaman kamu. Save template, Selesai.

Dan yang terakhir, mengatur lebar gambar di postingan blog agar tidak melebihi halaman. Jika kita menggunakan ukuran gambar ekstra besar, biasanya gambar akan melewati batas halaman posting, bisa sampai terkena widget bagian sidebar kanan, dan itu akan membuat loading blog lebih lambat. Berikut ini adalah script kode untuk mengatur lebar gambar, untuk lebih jelasnya ikuti langkah-langkah dibawah ini.

---

Mengatur lebar gambar posting blog

---

1. Login ke blogger, dari halaman dasbor pilih pengaturan template.
2. Dan klik edit HTML, selanjutnya cari kode  ]]></b:skin> dan masukan kode berikut diatasnya.
#header img { max-width: 99%; max-height:90%; margin:1px 1px;padding:0px;}
.post img { vertical-align:bottom; max-width:90%; max-height:90% }
#navigation img { vertical-align:bottom; max-width:80%; }
3. Save Template, selesai.

Sebenarnya blogger sudah memberikan tools untuk mengatur gambar saat kita menulis artikel, tapi itu tidak cukup untuk mengatur gambar dengan lebar yang sangat besar. Setelah memasukan kode diatas, maka gambar dengan lebar ekstra besar, tidak akan melewati lebar halaman posting, dan cukup membantu untuk mempercepat loading blog. Silakan baca juga cara mempercepat loading blog lanjutan dari artikel ini. Untuk menambah kecepatan loading blog anda. Semoga Bermanfaat.

Cara Membuat Tulisan Bayangan di Blog

Cara Membuat Tulisan Bayangan di judul Blog, deskripsi, text tab dibawah header, sidebar widget yang berada di kanan-kiri blog, footer bagian bawah dan juga judul posting blogspot. Contoh gambar silakan lihat dibawah ini.

Gambar diatas adalah contoh judul sidebar widget yang diberi tulisan bayangan. Tulisan bayangan membuat tulisan terlihat seperti ada 2 tulisan yang menyatu, dengan warna bias yang bisa diganti dengan warna lain dan juga tingkat bias tulisan yang bisa diatur sesuai keinginan. Untuk lebih jelasnya lagi, coba lihat tulisan dibawah ini.

CONTOH TULISAN DENGAN WARNA BAYANGAN

Cara Membuat Tulisan Bayangan di Blog. Silakan ikuti langkah-langkah dibawah ini.

Cara Membuat Tulisan Bayangan di Blog

1. Login ke blogger, dari halaman dasbor pilih pengaturan template.

2. Klik edit HTMl dan cari kode ]]></b:skin>
3. Pilih dan Pasang kode berikut di atas kode ]]></b:skin>

1. Judul Blog
.Header h1 { text-shadow: 2px 2px 5px #1780dd; }
2. Deskripsi
.Header .description { text-shadow: 2px 2px 5px #1780dd; }
3. Text Tab dibawah Header
.tabs-inner{ text-shadow: 2px 2px 5px #1780dd; }
4. Judul Sidebar Widget dikiri-kanan blog.
.sidebar .widget h2 { text-shadow: 2px 2px 5px #1780dd; }
5. Judul Footer Widget bagian bawah.
.footer-inner .widget h2{ text-shadow: 2px 2px 5px #1780dd; }
6. Judul Posting Blog.
h3.post-title{ text-shadow: 2px 2px 5px #1780dd; }

3. Ganti #1780dd; dengan warna yang kalian inginkan. 

4. Save Template, Selesai.

Mungkin setiap kode awal diatas tidak semuanya sama dengan kode di template kamu. Biasanya yang berbeda di bagian .sidebar .widget h2 { dan .footer-inner .widget h2{ , coba ganti keduanya dengan kode awal h2 { . Maka h2 { akan merubah semua judul widget sidebar dan footer. Dan juga kode h3.post-title{ jika tidak berjalan di blog kamu, coba ganti dengan h3.post-title, .comments h4 { atau h3.post-title, h4 {.

Setiap template mempunyai perbedaan kode, tapi dari yang pernah saya coba, biasanya perbedaan berada di awal atau akhir kode. Jika memang berbeda dengan kode2 diatas, coba cari kode yang semirip mungkin. Silakan dibaca juga cara membuat facebook box like yang berbentuk kotak facebook dengan tombol like di blog.

Dan juga Tips Trik menulis artikel blog menggunakan gambar dan kotak script, yang dimasukan ke tengah-tengah daftar di numbered list. Atau menghilangkan atribut lengkap blogger seperti tulisan diberdayakan oleh blogger, navbar, langganan entri atom, gambar tang obeng yang berada disetiap widget blog, dan juga meghilangkan tulisan tampilkan posting dengan label ketika kita membuka halaman label, semuanya ada. Semoga Bermanfaat.

Cara membuat facebook fans page di blog

Cara membuat facebook fans page di blog. Untuk membuat kotak facebook fans page atau facebook like box. Kita perlu membuat halaman di facebook, agar bisa tersambung ke blog. Untuk lebih jelasnya, ikuti langkah² dibawah ini.

Cara membuat halaman facebook

1. Kunjungi http://www.facebook.com/pages/create/

2. Dan buat halaman baru, pilih salah satu.

---

3. Sebagai contoh pilih perjuangan atau komunitas. Lalu isi judul komunitas, dan klik mulai.

---

4. Selanjutnya masukan alamat URL Blog dan deskripsi halaman kamu.

5. Terahir Lewati langkah-langkah selanjutnya. Dari sini pembuatan halaman facebook sudah selesai. Dan selanjutnya membuat kotak facebook fans page atau facebook like box untuk dimasukan ke blog.

---

Cara Membuat facebook like box di blog

1. Kunjungi https://developers.facebook.com/docs/reference/plugins/like-box/

2. Dan masukan alamat URL halaman dari facebook yang kamu buat tadi di kotak Facebook page URL.

---

3. Selanjutnya atur tampilan kotak facebook page sesuai dengan yang kalian inginkan.

4. Lalu klik Get Code pada bagian bawah.

---

5. Maka akan terbuka halaman kode plugin like box. Pilih bagian IFRAME

6. Copi kode script IFRAME, 

---

7. Dan pastekan di Gadget HTML blog. Caranya: Dari blogger pilih pengaturan tata letak dan klik tambahkan gadget, lalu pilih HTML/Javascript. Dan pastekan kode IFRAME didalamnya.

---

8. Beri judul lalu save template. Dan lihat tampilan blog.

9. Selesai.

---

Ulangi cara membuat facebook fans page jika kurang lebar atau kurang tinggi kotak page facebooknya. Jika ingin membuat tombol page like saja, kunjungi situs plugin facebook tadi, dan pilih like button, lalu  ikuti seperti cara membuat kotak facebook fans page.

Berikutnya adalah menyembunyikan kotak facebook fans page dari halaman awal blog.

1. Login ke blogger, dari halaman dasbor pilih pengaturan template.
2. Dan klik edit HTML dan cari kode NAMA JUDUL dari kotak facebook fans page kamu. Contohnya Belajar blog. kodenya seperti ini.
<b:widget id='HTML1' locked='false' title='Belajar Blog' type='HTML'>
    <b:includable id='main'>
  <!-- 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:includable>
  </b:widget>
3. Sekarang tempatkan kode <b:if cond='data:blog.pageType == "item"'> dan </b:if> diantara kode-kode diatas. Contohnya.
  <b:widget id='HTML1' locked='false' title='Belajar Blog' type='HTML'>
    <b:includable id='main'>
      <b:if cond='data:blog.pageType == "item"'>
  <!-- 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>
4. Save template selesai. 

Setelah menambahkan kode <b:if cond='data:blog.pageType == "item"'> dan </b:if> maka kotak facebook tidak akan muncul di halaman awal blog, tapi di halaman posting blog. Jika tidak ingin menyembunyikan kotak facebook fans page di awal blog, lewati saja cara ini.

Sekarang coba baca juga cara  membuat komentar facebook di blog dibawah posting blog. Bersebelahan dengan kotak komentar blogger. Semoga Bermanfaat.

Tips dan Trik Menulis Artikel Di Blog

Tips dan Trik Menulis Artikel Di Blog dengan  gambar dan kotak script yang ditempatkan di paragraf daftar bernomor Numbered List. Untuk lebih jelasnya, ikuti langkah-langkah dibawah ini.

Memasukan gambar di daftar bernomor Numbered List

1. Buatlah seperti gambar disamping ini. 3 daftar bernomor menggunakan Numbered List dan kosongkan dibagian nomor 2.

---

2. Selanjutnya masukan gambar diatas 3 daftar tadi, dan Klik gambar, dan klik kanan pilih CUT.

---

3. Setelah di cut, maka akan ada ruang kosong dengan alamat url yang tertinggal dari gambar tadi, klik Link untuk menghilangkan URL gambar.

---

4. Selanjutnya Paste kan gambar tadi ke daftar kedua. Lihat gambar.

5. Lihat tanda kotak di nomor 2, akan kita hapus, jadi urutannya 1 Daftar, gambar dan 2 nama. caranya.

---

6. Klik HTML disebelah Compose, lalu lihat dibagian URL Gambar, hapus kode <li> diawal dan </li> akhir kode Url Gambar. Lihat Gambar.

---

7. Setelah kode  <li> dan </li> dihapus, kembali lagi klik Compose, dan lihat urutan gambar.

8. Berurutan 1. Daftar, Gambar dan 2. Nama. Selesai.

---

Itulah sedikit trik menempatkan gambar di paragraf daftar bernomor(Numbered List), Tulisan blog jadi lebih tersusun rapi, tanpa menghitung gambar didalam paragraf nomor. Trik Berikutnya adalah memasukan Kotak script di daftar bernomor(Numbered List).

Memasukan Kotak Script di daftar bernomor Numbered List

1. Sama Seperti cara diatas, buatlah daftar numbered list.

---

2. Lalu Klik lagi bagian HTML, dan lihat kode <li>&nbsp;</li> seperti gambar disamping ini.

---

3. Sekarang ganti <li>&nbsp;</li> dengan kode script dibawah ini.

<div style="border: 3px #1780dd solid; padding: 10px;background-color:#ffffff; height: 100px; width: 300px;
text-align: left;">
.kode script disini.</div>

---

 4. Maka tampilan HTML menjadi seperti gambar disamping.

---

5. Setelah itu klik lagi compose, dan lihat urutan daftar numbered list.

6. Klik tulisan kode script disini, dan masukan kode script yang kamu inginkan.

7. Selesai.

---

Dengan begitu urutan paragraf bernomor Numbered list di blog terlihat lebih rapi. Yang menjadi masalah dalam melakukan kedua cara diatas adalah ketelitian, bagaimana kita bisa melihat kode yang harus dihapus di url gambar dan kode script <li></li> yang harus diganti untuk memasukan kotak script didalam daftar numbered list. Satu lagi trik menulis artikel, yaitu dengan mengganti numbered list dengan huruf. Berikut caranya.

Mengganti numbered list dengan Huruf

1. Buatlah Numbered List seperti biasa.
2. Selanjutnya klik bagian HTML disebelah Compose, dan cari kode <ol> tambahkan kode type="A" didalamnya. contohnya seperti dibawah ini.
<ol>
<li><br /></li>
</ol>

Menjadi

<ol type="A">
<li><br /></li>
</ol>
3. Setelah menambahkan kode type="A" , kembali ke bagian compose, maka angka 1 berubah menjadi A, untuk B,C,D dan seterusnya akan berurutan otomatis sesuai abjad, seperti kita menggunakan numbered list 1,2,3,4. Selesai.

Contoh diatas hanya menggunakan satu gambar di 3 daftar Numbered list. Bayangkan dengan tulisan yang, bisa sampai 8 daftar Numbered list ditambah lagi dengan banyak gambar. Dan juga menggunakan kotak script didalam daftar numbered list. Sekali lagi ketelitian adalah kuncinya. Coba satu persatu terlebih dahulu dengan daftar Numbered list yang pendek, klo sudah bisa baru gunakan kedua2nya dalam satu daftar Numbered list.

Semoga kedua cara diatas dapat membantu kamu menulis artikel dengan rapi di blog. Silakan baca juga cara menghilangkan diberdayakan oleh blogger dan fitur tulisan dan gambar dari blog. Atau baca juga cara membuat menu di blog yang berada di bawah judul blog. Semoga Bermanfaat.

Cara Menghilangkan Diberdayakan Oleh Blogger

Cara menghilangkan diberdayakan oleh blogger, dan tulisan fitur blogger lainnya seperti tulisan langganan entri atom, tampilkan posting dengan label, gambar tang obeng dan juga navbar dibagian atas blog. Untuk lebih jelasnya, ikuti langkah-langkah dibawah ini.

Cara Menghilangkan Diberdayakan Oleh Blogger

1. Login ke blogger. Dari halaman dasbor ke pengaturan template.
2. Selanjutnya klik edit HTML dan cari kode ]]></b:skin> dan pasang kode berikut di atas kode ]]></b:skin>
#Attribution1 { height:0px; visibility:hidden; display:none }
3. Save Template, Selesai.

---

Cara menghilangkan tulisan langganan entri atom

1. Login ke blogger. Dari halaman dasbor ke pengaturan template.
2. Selanjutnya klik edit HTML dan cari kode berikut ini.
<div class='feed-links'>
<data:feedLinksMsg/>
<b:loop values='data:links' var='f'>
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
</b:loop>
</div>
3. Dan hapus delete kode-kode diatas. Simpan template, Selesai.

---

Cara menghilangkan tulisan tampilkan posting dengan label

1. Login ke blogger. Dari halaman dasbor ke pengaturan template.
2. Selanjutnya klik edit HTML dan cari kode ]]></b:skin> dan pasang kode berikut di atas kode ]]></b:skin>
.status-msg-wrap{ display:none; }

.status-msg-body{ display:none; }

.status-msg-border{ display:none; }
3. Save template, Selesai.

---

Cara menghilangkan Gambar Tang Obeng

1. Login ke blogger. Dari halaman dasbor ke pengaturan template.
2. Selanjutnya klik edit HTML dan cari kode ]]></b:skin> dan pasang kode berikut di atas kode ]]></b:skin>
.quickedit{display:none;}
3. Selanjutnya cari kode <b:include name='quickedit'/> ada banyak kode yang sama dengan  <b:include name='quickedit'/> ganti semua kode menjadi.
<!--b:include name='quickedit'/-->
4. Save Template, Selesai.

---

Cara menghilangkan Navbar

1. Login ke blogger. Dari halaman dasbor ke pengaturan template.
2. Selanjutnya klik edit HTML dan cari kode ]]></b:skin> dan pasang kode berikut di atas kode ]]></b:skin>
#navbar, #navbar-iframe { height: 0px; visibility: hidden; display: none; }
3. Save template, Selesai.

Selesai sudah cara menghilangkan tulisan diberdayakan oleh blogger, navbar, tampilkan semua posting, langganan entri atom, dan juga gambar tang obeng di blog. Silakan baca juga cara membuat dan mengisi menu blog dan juga cara membuat baca selengkapnya otomatis di blog. Semoga Bermanfaat.

Cara Membuat dan Mengisi Menu Blog

Cara membuat dan mengisi menu blog dengan daftar isi, contact, label, kategori dan lain-lain. Menu yang terletak dibawah header blog. Untuk lebih jelasnya, ikuti langkah-langkah dibawah ini.

Cara membuat menu blog

1. Login ke blogger. Dari halaman dasbor klik Laman.
2. Ada 2 pilihan pembuatan menu, Pertama Laman kosong dan yang kedua Alamat Web(UPDATE:2014 TIDAK ADA LAGI). Seperti gambar dibawah ini.

3. Jika memilih Laman kosong, maka tampilannya seperti menulis artikel di entri, silakan isi tulisan didalamnya lalu beri Judul laman Contoh:Daftar isi. Dan klik Publikasikan.

4. Jika memilih Alamat web. Pada kolom Alamat web (URL) isi dengan alamat url kamu, contohnya: coba buka salah satu artikel kamu, dan copi url yang ada di address bar bagian atas, contohnya seperti url halaman artikel yang sedang anda baca ini. http://pengguna-komputer.blogspot.co.id/2013/05/cara-membuat-dan-mengisi-menu-blog.html
   
   Selanjutnya pastekan url di kolom Alamat web (URL) seperti gambar dibawah ini, lalu isi kolom atasnya dengan judul menu, contoh: Membuat Menu dan klik Simpan.

5. Selanjutnya, kembali ke pengaturan laman dan pilih Tampilkan Laman sebagai Tab Atas.

6. Terakhir Save pengaturan, Dan Lihat tampilan blog kamu, maka akan ada menu dibawah judul blog. Selesai.

Update Blogger 2014: Untuk menamplkan menu laman yang telah dibuat.

1. Ke pengaturan tata letak. 
2. Selanjutnya klik tambahkan gadget. 
3. Dan pilih LAMAN. Simpan.

---

Setelah bisa membuat menu di blog, sekarang kita coba mengisi nya dengan daftar isi, contact, dan memasukan label ke menu laman. Berikut cara membuatnya.

Cara Mengisi Menu Blog Dengan:

Daftar isi atau Sitemap

1. Buka laman baru seperti cara diatas, dan pilih Laman Kosong.

2. Dan Klik Bagian HTML, Lalu masukan kode berikut didalamnya. Seperti gambar diatas.
<script src="https://cdn.rawgit.com/Bangtax/bangtax/master/sitemapnew.js"></script><script src="http://pengguna-komputer.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>
3. Ganti http://pengguna-komputer.blogspot.com/ dengan alamat web kamu. Save Template, Selesai. 
4. Jika belum ada juga daftar isinya, coba edit salah satu artikel kamu, lalu Klik Label yang letaknya disebelah kanan, dibawah tulisan setelan entri. Lalu beri nama yang kalian inginkan.

5. Selanjutnya Klik selesai. Dan Klik Perbarui.
6. Terakhir, coba lihat lagi daftar isi kamu. Selesai.
7. Agar semua artikel kamu masuk ke daftar isi, beri nama label di setiap artikel kamu. Seperti langkah 4.

---

Contact atau Hubungi

1. Buka laman baru, dan pilih laman kosong, pada bagian Compose isi dengan alamat email kamu yang bisa dihubungi. Save Template, Selesai.
2. Atau Jika ingin membuat contact dengan kotak, bisa kalian buat dialamat web ini http://123contactform.com nanti akan dijelaskan caranya disitus tersebut.

---

Mengisi menu dengan Label atau ketegori

1. Buka laman baru, dan pilih Alamat Web.
2. Dan Masukan Alamat URL Label atau kategori yang ingin dimasukan, dan beri judul.

3. Terakhir, publikasikan. Selesai.

---

Cara ambil URL Label atau Kategori

1. Klik Label atau Kategori yang ingin diambil URL nya. Contoh: Label Menu Desain

2. Maka akan terbuka halaman label dengan isi artikel yang sama nama labelnya.
3. Copy alamat URL Pada bagian Address Bar bagian atas.

4. Dan pastekan ke alamat web di Laman Tadi. Tampilan alamat URL ada persennya seperti ini http://fandrajuani.blogspot.com/search/label/Menu%20Desain.
5. Save Laman, Selesai.

Lakukan cara yang sama jika ingin menambahkan label yang lain ke laman menu. Artikel diatas merupakan contoh pembuatan menu menggunakan Laman di blog, ada juga membuat menu menggunakan Html dan css agak sedikit ribet karena menggunakan banyak kode, caranya baca di artikel cara membuat menu html dan css. Dan Silakan baca juga artikel lainnya seperti cara membuat komentar facebook dibawah postingan blog dan cara mengganti warna sidebar. Atau menghilangkan tulisan diberdayakan oleh blogger. Semoga Bermanfaat.

Cara Membuat Read More Di Blog

Cara Membuat Read More Di Blog. Read more atau baca selengkapnya berguna untuk mempersingkat tampilan dari setiap posting di halaman awal blog. Berikut ini ada 2 cara, yang pertama adalah cara membuat read more manual versi blogger dan read more otomatis.

Cara membuat read more manual versi blogger

1. Login Ke blogger. Buka Salah satu Artikel kamu.
2. Pada Bagian Option klik Insert Jump Break di halaman yang ingin kamu potong. Contoh:

3. Sekarang Save artikel kamu dan coba lihat tampilan awal blog kamu. Maka akan seperti gambar dibawah ini.

4. Selesai.

Cara diatas adalah membuat read more atau baca selengkapnya secara manual. Jadi kita harus melakukan cara diatas satu persatu disetiap posting. Selanjutnya kita akan membuat read more otomatis, setiap posting akan di potong atau dipersingkat tampilannya dan diberi satu gambar dibagian kiri di halaman awal blog.  Ikuti langkah-langkah dibawah ini.

Cara membuat read more Otomatis

1. Login ke blogger. Dari halaman Dasboard Pilih pengaturan Template.
2. Selanjutnya klik edit HTML dan cari kode </head> dan Copy-paste script berikut tepat DI BAWAH </head> (gunakan Ctrl+F):
<!-- Auto read more script Start -->
<script type='text/javascript'>
var thumbnail_mode = &quot;yes&quot;;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 150;
img_thumb_width = 150;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
    if(strx.indexOf("<")!=-1)
    {
        var s = strx.split("<");
        for(var i=0;i<s.length;i++){
            if(s[i].indexOf(">")!=-1){
                s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
            }
        }
        strx =  s.join("");
    }
    chop = (chop < strx.length-1) ? chop : strx.length-2;
    while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
    strx = strx.substring(0,chop-1);
    return strx+'...';
}

function createSummaryAndThumb(pID){
    var div = document.getElementById(pID);
    var imgtag = "";
    var img = div.getElementsByTagName("img");
    var summ = summary_noimg;
        if(thumbnail_mode == "yes") {
    if(img.length>=1) {  
        imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
        summ = summary_img;
    }
    }
    var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
    div.innerHTML = summary;
}
//]]>
</script>
<!-- Auto read more script End -->
3. Keterangan Kode: Edit kode2 dibawah ini agar sesuai dengan yang kalian inignkan.
summary_noimg = 430; Jumlah Huruf dengan gambar
summary_img = 340; Jumlah Huruf Tanpa gambar
img_thumb_height = 150; Tinggi gambar
img_thumb_width = 150; Lebar Gambar
4. Sekarang cari kode <data:post.body/> ada 3 kode yang sama, ganti semuanya dengan kode dibawah ini.
<!-- Auto read more Start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<div style='text-align:justify;' expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'> createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<a class='more' expr:href='data:post.url'>Baca Selengkapnya >>></a>
</b:if>
</b:if>
<!-- Auto read more End -->
5. Tulisan Baca Selengkapnya >>> bisa diganti dengan kata yang kalian inginkan, selanjutnya preview template, jika sudah berubah baru save. Selesai.

Gambar diatas adalah contoh tampilan read more otomatis, ada gambar dibagian kiri dan dilanjutkan dengan kalimat-kalimat yang ada. Setelah menambahkan read more otomatis, maka setiap Artikel postingan kita tampilannya akan disederhanakan dari halaman awal blog. Jadi kita tidak perlu lagi menggunakan Tools Insert Jump break, seperti read more manual versi blogger. Setelah publikasi, maka tampilan artikel blog akan seperti diatas.

Silakan baca juga artikel tentang cara membuat kotak komentar facebook yang bersebelahan dengan kotak komentar blogger, dibawah posting blog. Dan juga cara mengganti warna judul sidebar widget yang berada di kanan-kiri posting, dan juga bagian bawah footer blog. Atau Cara membuat related post dibawah posting blog. Semoga Bermanfaat.