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

Cara Memasang Widget Formulir Kontak Baru Blogger di Menu Blog

1/27/2013 0 Comments
Kabetulan hari ini ada waktu luang, jadi saya ada kesempatan buat nambah jumlah postingan blog. Pada kesempatan ini saya akan berbagi trik Cara Memasang Widget Formulir Kontak Baru Blogger di Menu Blog.


Widget Formulir Kontak ini merupakan koleksi terbaru dari widget blogger. Seperti widget-widget lainnya widget ini juga terpasang pada kolom widget dan tampil pada halaman utama (home). Sepertinya kurang relevan ya... jika contact form ini terpajang langsung di halaman muka blog.

Nah, tentu keinginan kita adalah bagaimana agar widget ini berada pada halaman statis atau halaman tab blog seperti gambar di bawah ini.


Untuk membuat formulir kontak seperti milik saya, ada beberapa langkah yang perlu Anda ikuti, lihat  berikut ini :
1. Pertama kita akan menyembunyikan widget dari halam utama blog dengan menambahkan kode di bawah ini tepat di atas kode ]]></b:skin>

.widget.ContactForm {
 display: none;
 }

2. Pasang widget formulir kontak di kolom widget tepat di bawah posting blog. Seperti pada gambar di berikut ini.


3. Setelah itu, lanjut ke tahap berikut... buat satu kategori Laman baru / Laman kosong dengan judul kontak atau contact. Buka mode HTML dan masukkan kode di bawah ini

<style type="text/css">
 .widget.ContactForm {display: block; }
 .post-footer {display: none;}
 #blog-pager {display: none;}
 .blog-feeds {display: none;}
 .widget.ContactForm .title {display: none;}
 .widget.ContactForm * {max-width: 85%;}
 </style>

4. Selesai, simpan dan lihat hasilnya.

Itulah Cara Memasang Widget Formulir Kontak oleh Blogger di menu blog kita. Jika Anda mendapatkan kesulitan silahkan tinggalkan komentar di posting ini.

Cara Mudah Membuat Kotak Komentar Facebook Pada Blogger

1/13/2013 5 Comments
Sebuah blog tanpa kotak komentar, rasanya menjadi bukan 100 persen blog. Karena sejatinya blog adalah sebuah interaksi atau percakapan. Di Blogspot sendiri, sudah disediakan kotak komentar yang bisa disematkan di bawah postingan. Sehingga lebih mudah untuk pembaca blog untuk memberikan komentar. Walau dari segi fungsi kadang sedikit membingungkan karena harus memilih akun (atas nama) untuk berkomentar.


Ada beberapa situs yang memberikan layanan penyedia kotak komentar. Salah satunya facebook, situs jejaring sosial yang sangat populer itu menyediakan widget atau plugin untuk kotak komentar yang bisa dipasang di blog kita. Tampilan kotak komentar itu sangat facebook banget.

Cara membuat kotak komentar facebook di blog ini lebih mudah dibanding sebelumnya. Ini bisa menjadi salah satu alternatif kotak komentar blog yang bisa lebih ramah dan mempermudah pengguna atau pembaca untuk meninggalkan komentar. Seperti yang kita tahu, hampir semua orang punya akun facebook daripada akun blog.



Cara Membuat Kotak Komentar Facebook yang Mudah
1. Login ke akun blogger.com
2. Pilih Template kemudian Edit HTML
3. Jangan lupa centang Expand Template Widget

 
4. Cari kode <b:includable id='status-message'> dan di atas kode tersebut, kita akan menemukan kode </b:includable>
5.Taruh kode yang berwarna merah di atas </b:includable> seperti berikut:


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p align='left'><a href='http://ariereski.blogspot.com/2013/01/cara-mudah-membuat-kotak-komentar.html' target='new'><img border='0' height='30' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoy4YybCkS_10R52_xJvAM4yF63_Ztb-oFerh10ChGLqgut6rLRO90tedp3X_coHYR9U96vvs4-RZakGD4OCYglHDnYPdaFit_V6n8l52aODQKTdPPKnnPiGVZaHP4H80Jtw4jtnY-ugs/s1600/comment.gif' width='200'/></a></p>
<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<fb:comments expr:href='data:post.url' num_posts='10' width='500'/>
</b:if>

</b:includable>
<b:includable id='comment_picker' var='post'>
  <b:if cond='data:post.commentSource == 1'>
    <b:include data='post' name='iframe_comments'/>
  <b:else/>
    <b:if cond='data:post.showThreadedComments'>
      <b:include data='post' name='threaded_comments'/>
    <b:else/>
      <b:include data='post' name='comments'/>
    </b:if>
  </b:if>
</b:includable>
<b:includable id='status-message'>

6. Kita dapat ganti angka berwana biru : 10 = yaitu banyak komentar yang akan ditampilkan dan 500 = adalah lebar dari kotak komentar facebook.
7. Simpan Template jika sudah selesai.

Keuntungan memakai kotak komentar facebook adalah bentuknya thread comment, sehingga dapat membalas komentar. Selain itu juga terintegrasi dengan facebook, sehingga komentar bisa dibagikan (share) di facebook si komentator. Keuntungan lainnya dengan kotak komentar facebook adalah lebih menghemat tempat (space).

Penyebab Error Pada Tampilan Bagian Laman Blog

12/27/2012 0 Comments
Ada yang mengalami masalah pada tampilan laman menu horizontal blog. Penyebab Error-nya Pada Tampilan Bagian Laman Blog adalah auto readmore/readmore otomatis.


Baiklah Saudara yang terhormat, kali ini saya akan memposting tentang cara Memperbaiki Readmore Di Blog Tanpa Eror Pada BagianHalaman, nah maksud dari error di halaman adalah. ketika kita memasang readmore. biasanya sering terjadi kesalahan pada bagian halaman kita, dimana halaman tersebut ikut teringkas dalam readmore dan menjadi tidak bisa dibuka, untuk itu saya akan beritahukan bagaimana caranya Memperbaiki Readmore Di Blog Tanpa Eror Pada Bagian Halaman Bagi saudara yang telah memasang autoreadmore langsung saja saudara ikuti langkah-langkah dibawah ini :

1. Seperti biasa login terlebih dahulu di akun blogger anda.
2. Agar tidak terjadi kesalahan dalam mengedit HTML saya sarankan backup/download dulu template anda
3. Masuk ke Rancangan>>Edit HTML>>centang Expand Template Widget.
4. kemudian cari kode </head> jangan lupa gunakan CTRL + F untuk mempermudah pencarian kode tersebut. Jika sudah ketemu kode </head> lalu cari kode script readmore seperti kode script di bawa ini :
*untuk kode berwarna merah adalah kode yang perlu saudara tambahkan pada kode readmore saudara!

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://script-bamz-us.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>

5. cari kode <b:if cond='data:blog.pageType != &quot;item&quot;'> seperti dibawah ini:
*untuk kode berwarna merah adalah kode yang perlu saudara tambahkan pada kode readmore saudara!
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
     <data:post.body/>
<b:else/> 
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'>« Baca Selengkapnya »</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if> 
</b:if>

*anda bisa mengganti tulisan « Baca Selengkapnya » sesuai dengan keinginan anda.

Oke ! Simpan Template anda ! setelah itu lihat hasilnya, dan kembali saya ingatkan, coba saudara lihat pada bagian Laman saudara apakah ikut terkena readmore dan tidak bisa dibuka ? saya rasa jika saudara telah mengikuti langkah-langkah diatas dengan benar maka saya jamin tidak akan terjadi error di bagian Laman Saudara. cukup sekian informasi dari saya, semoga bermanfaat. selamat mencoba dan semoga sukses !

Cara Mengatasi Error Posting Pada Tampilan Auto Read More

12/24/2012 2 Comments
Selamat pagi pemirsa? Sudahkah anda mandi pagi ini? Saya sendiri belum! Hehe. Saya ada sedikit tips yang mungkin pemirsa (sobat blogger) sudah pada tahu cara mengatasi teks postingan error pada tampilan auto read more atau yang juga disebut read more otomatis, begitu!. Tapi tidak ada salahnya juga saya mau ikutan membuat posting seperti ini yang bertujuan memberi pencerahan  bagi pemirsa sekalian yang bertanya seperti tema judul posting saya ini (Bagaiman Cara Mengatasi Error Posting Pada Tampilan Auto Read More?) mungkin pertanyaannya seperti dalam kurung. Mungkin juga ada pemirsa sekalian yang belum tahu  triknya, jadi untuk itu saya akan membagi pengalaman saya ini. Pemirsa (sobat blogger) pernah pusing 7 keliling saat melihat postingan error pada tampilan auto read morenya? Pusing itu saya rasakan saat pertama kali mencoba menggunakan auto read more! Kok tampilan postingan saya hancur sekali ya, seperti pada gambar di bawah ini:

 
Pemirsa lihat sendirikan teks postingan saya tidak muncul, tapi malah script seperti pada gambar yang saya lingkari warna merah itulah yang tampil. Beberapa dugaan saya muncul, apakah script auto read more saya mengalami kesalahan atau teks postingan saya yang enggan tampil… hehe ngaco sekali!
Kemudian saya mulai mengotak-atik postingan, hasilnya tetap aja begitu! Saya cari-cari pencerahan pada google juga belum memuaskan batin saya… haha ngaco lagi!
Lalu saya membuka postingan saya lagi, kali ini saya mengecek pada menu edit HTML ada berbagai macam script terlihat, saya melihat ada sekumpulan script aneh yang semestinya bukan bagian dari teks posting dan gambar pada posting saya. Kecurigaan saya benar, lalu saya membuka menu Compose dan menyalin sementara teks serta gambar postingan, setelah halam posting kosong saya lalu membuka kembali menu HTML ternyata ada script yang masih tersisa disana. Nah inilah dia script pengganggu yang menghalangi teks posting tampil pada tampilan auto read more, script pengganggu itu terliha seperti di bawah ini:


Sudah mulai paham kan pemirsa? Iya, script pengganggu itu lalu saya hapus semua, sehingga halaman HTML posting saya bersih kosong. Kembali saya buka menu Compose lalu saya menyalin kembali teks dan gambar posting yang tadi saya pindahkan.

*Keterangan: pemirsan bisa memindahkan teks dan gambar posting ke Office Word sementara saat pembersihan script benalu (pengganggu) tersebut.

Setelah posting saya kembali seperti semula, terakhir saya klik Perbarui.
Tererenggggg……. Yes saya berhasil!!! Kini postingan saya tampil sempurna…..horeeee

*Keterangan: jika pemirsa bingung dengan posting ini, pemirsa bisa melihat tutorial singkat ke-2. Klik disini >> “Cara Mengatasi Error Posting Pada Tampilan Auto Read More

Cara Mengatasi Error Posting Pada Tampilan Auto Read More V.2

12/24/2012 2 Comments
Langkah sebagai berikut:
1. Masuk ke Halaman Design Entri Blogger
2. Pilih Post dan klik edit dari judul postingan yang error
3. Lalu buka HTML (bukan Compose)
4. Temukan script seperti di bawah ini lalu blok semua dan hapus (Delete)


*Pedoman Anda dalam melakukan pencarian script cukup dengan menemukan Awal Script lalu blok kebawah hingga menemukan Akhir Scrip (Lihat pada contoh gambar, tanda panah, dan tulisan berwarna merah). Setelah semua ter-blok lalu hapus semua script tsb.

Script ini terletak antara script gambar dengan script teks isi posting *jika posting pemirsa (sobat blogger) menggunakan gambar.
Jika posting pemirsa sekalian tidak menggunakan gambar maka script pengganggu itu terletak di atas script teks isi posting.
Tentu pemirsa bertanya-tanya dari mana asalnya script pengganggu ini? Menurut dari hasil analisa saya, script tersebut bisa berasal dari beberapa kemungkinan:

1. Apakah isi postingan pemirsa berasal dari COPAS (Copy Paste) di blog tetangga? Jika iya itu adalah kemungkinan asal script error itu.

2. Mungkin isi postingan menggunakan gambar yang diambil dari google dan di unggah pada posting, mungkin saja gambar tersebut mebawa virus yang berupa script error.


*Jika semua script benalu (pengganggu) tersebut telah ketemu dan telah terhapus (Delete) semuanya! Kembali ke Compose dan pastikan tidak ada bagian dari isi posting yang ikutan terhapus lalu klik simpan atau perbarui.
Dilanjutkan dengan mengedit posting-posting yang error lainya atau langsung melihat tampilan blog. Selesai, Semoga berhasil.