Cara Membuat Scroll Blog Popular Post

Setelah beberapa kali gagal saat menerapkan tutorial mengenai cara membuat scroll blog popular post dari tutorial rekan rekan blogger, akhirnya saya mendapatkan cara yang cukup praktis dan gampang untuk diterapkan di blog saya dan berhasil saya pasang pada widget popular post, widget recent post maupun widget lainnya di blog saya ini.

Yang baru saya tahu ada dua cara untuk membuat scroll atau menambahkan fungsi scroll pada widget, yang pertama yaitu dengan cara menambahkan kode CSS langsung didalam widget html dan yang kedua dengan cara menambahkan kode CSS pada bagian dalam kode template (edit template).

Cara yang pertama sudah saya coba dan berhasil, tetapi hasilnya saya kurang puas, karena bagian tepi scroll nya tidak pas sejajar dengan batas side bar widget bagian luar (padahal pengaturan "width" nya sudah saya set "auto").

Akhirnya saya pakai cara yang kedua, yaitu dengan edit html dan hasilnya bagian tepi scroll dapat sejajar secara otomatis dengan bagian tepi side bar widget.

Selain itu cara yang kedua ini menurut saya sangat praktis untuk diterapkan didalam blog saya, apabila rekan-rekan mau mencoba silahkan dicoba sendiri dan rasakan sensasinya....

Berikut caranya:

1. Login ke blogger dengan akun rekans
2. Masuk ke halaman Template
3. Klik Edit HTML Lalu Lanjutkan
4. Cari kode ]]></b:skin>
   (gunakan Ctrl+F)
5. Copy dan paste kode di bawah ini tepat di atas kode ]]></b:skin>

#PopularPosts1 .widget-content{ height:200px;overflow:auto;}

     6. Simpan template dan lihat hasilnya

Demikian tutorial dari saya mengenai cara membuat scroll blog popular post, semoga bermanfaat dan happy blogging buat rekans semua.

Keterangan:

• #PopularPosts1 : adalah id untuk widget popular post yang akan dibuatkan scroll nya, untuk widget yang lain rekan-rekan bisa cari sendiri id nya, biasanya untuk widget selain popular post menggunakan nama HTML1, HTML2, HTML3 dan seterusnya.
• height:200px : adalah tinggi scroll, bisa rekan-rekan rubah sesuai keinginan atau kebutuhannya.

Read More

Cara menghapus link aktif dalam komentar blog secara otomatis

Link aktif dalam komentar blog ditautkan oleh pengunjung blog biasanya untuk mendapatkan backlink dari blog kita (maksud pembuat komentar sih prmosi gitu), tetapi cara ini kurang adil karena kita sendiri sebagai pemilik blog tidak mendapatkan backlink dari mereka yang menautkan link aktifnya didalam blog.

Google sendiri tidak menyukainya hal ini, apa lagi kita.

Menurut saya akan lebih adil dan lebih santun apabila ingin mendapat backlink menggunakan media tukaran link.

Seperti apa link aktif itu ? kurang lebih begini, apabila ada pengunjung yang berkomentar pada sebuah artikel di blog kita dan kemudian mereka menempatkan sebuah kata atau kalimat yang ditautkan pada link yang mereka sudah siapkan.

Kira-kira begini link yang mereka tautkan :

<a href='http://catatan-piper-comex.blogspot.com/'>Contoh Link Aktif</a> --->> Contoh Link Aktif

Ada beberapa cara menghapus link aktif dalam komentar blog, pertama tentunya dengan memoderasi setiap komentar yang masuk dan fitur ini sudah disediakan oleh blogger sendiri. 

Yang kedua dengan menggunakan script sehingga setiap Link Aktif yang disisipkan oleh pembuat komentar akan dihapus dengan sendirinya secara otomatis (kita tidak dibuat repot). Ini yang kita akan bahas dalam postingan kali ini yaitu cara yang kedua Cara menghapus link aktif dalam komentar blog secara otomatis.

Ok, langsung aja kita praktekan...

1. Login di blogger.

2. Pilih Template - Edit HTML - Expand Template Widget.

3. Cari kode ]]></b:skin> dan letakkan kode berikut tepat diatasnya :

#comments p a {display:none;}

4. Cari kode </head> dan letakkan salah satu kode berikut tepat diatas nya :

    |> Untuk mengganti link aktif dengan kalimat :

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function(){
 jQuery("#comments p").find("a").replaceWith("<span>Peringatan: Link aktif otomatis dihapus</span>");
});
</script>

    |> Untuk mengganti link aktif dengan link temen-temen :

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function(){
 jQuery("#comments p a").attr("href", "http://URL-anda.com/");
});
</script>

5. Simpan Template.

6. Enjoy.

Terima kasih, semoga bermanfaat dan jangan lupa tinggalkan komentar temen-temen.

Read More

Cara Membuat Widget Recent Post Keren

Widget recent post adalah widget yang diperlukan agar pengunjung dapat melihat artikel apa saja yang terbaru atau yang sering dibaca oleh pengunjung lainnya. Widget recent post ini hampir sama dengan widget popular post bawaan blogger. Lalu apa kerennya ?

Seperti kita ketahui bahwa widget popular post bawaan blogger hanya bisa kita rubah untuk ditampilkannya gambar, judul artikel dan summary posting. Untuk merubah besar - kecil nya gambar tidak ada option nya. Begitu juga untuk merubah berapa banyak huruf yang akan ditampilkan pada summary post juga tidak bisa.

Widget recent post yang saya sharing disini dapat mengatasi semua kekurangan tersebut.
Diantaranya:

• Ukuran gambar / avatar  bisa kita atur sesuai keinginan
• Jumlah karakter huruf isi artikel bisa kita atur sesuai keinginan
• Jumlah komentar yang masuk bisa kita tampilkan
• Jumlah artikel yang ingin kita tampilkan bisa lebih dari 10 artikel

Cara menampilkan atau menghilangkan nya cukup dengan merubah parameter: true atau false pada script tersebut.
Untuk merubah yang lainnya, silahkan Anda explore sendiri. Jangan takut rusak.

Bagaimana cara membuat widget recent post keren tersebu, ikuti petunjuknya berikut ini.

1. Login ke Blogger, pilih blog yang ingin Anda edit. Untuk keamanan bila terjadi kesalahan edit, buat tempalte cadangan dengan mengklik "cadangkan/pulihkan", simpan file template cadangan tersebut.

2. Kemudian masuk ke Tata letak ==> Tambah gadget ===> Html/javascript

3. Masukkan semua kode dibawah ini:

<div style="overflow:auto; width:100%px; max-height:250px; padding:5px;"><style>img.recent_thumb {padding-right:10px;padding-left:padding-bottom:0px;0px;width:55px;height:55px;border:0;float:left;margin:0 0 5px 0px;} .recent_posts_with_thumbs {float: left;width: 100%;min-height: 55px;margin: 0px 0px 5px 0px;padding: 0;font-size:12px;font-color:black;} ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:0px;padding-left:0px;padding-right:20px;min-height:50px;list-style:normal;} .recent_posts_with_thumbs a {text-decoration:none;} .recent_posts_with_thumbs normal {font-size:13px;} </style><script type="text/javascript" src="http://blogedek-javascript.googlecode.com/files/recentpoststhumb.js"></script><script type="text/javascript">var numposts = 20; var showpostthumbnails = true; var displaymore = false; var displayseparator = false; var showcommentnum = true; var showpostdate = false; var showpostsummary = false; var numchars = 75; </script><script src="http://www.catatan-piper-comex.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs" type="text/javascript"></script></div>

4. Sebelum disimpan Anda ganti dulu alamat url saya (catatan-piper-comex.blogspot.com) dengan alamat url blog Anda, setelah diganti dengan alamat url blog Anda, kilk save / simpan.
Anda bisa lihat hasilnya sebentar, apabila masih belum cocok bisa Anda modifikasi lagi sesuai keinginan Anda.

Apabila ada yang masih kurang jelas, silahkan tinggalkan pesan pada kolom komentar.
Semoga bermanfaat.

Read More

Cara Membuat Widget Recent Comment

Widget recent comment adalah widget yang diperlukan agar pengunjung tetap berada di halaman blog. Widget recent comment ini selain menaruh link dan isi komentar juga terdapat avatar yang bulat di sampingnya.

Dan tentu saja, Agan juga dapat mengubah avatar defaultnya, menambahkan scroll dll.

Bagaimana cara membuat widget recent comment dilengkapi dengan avatar dan isi komentarnya, silahkan ikuti petunjuk dibawah ini.

1. Login ke Blogger, pilih blog yang ingin Anda edit. Untuk keamanan bila terjadi kesalahan edit, buat tempalte cadangan dengan mengklik "cadangkan/pulihkan", simpan file template cadangan tersebut.

2. Kemudian masuk ke Tata letak ==> Tambah gadget ===> Html/javascript

3. Masukkan semua kode dibawah ini:

<style type="text/css"> ul.w2b_recent_comments{list-style:none;margin:0;padding:0;} .w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;} .w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;} .avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;} .w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;} .w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;} </style> <script type="text/javascript"> //<![CDATA[ // Recent Comments Settings var numComments = 5, showAvatar = true, avatarSize = 30, roundAvatar = true, characters = 30, defaultAvatar = "http://www.gravatar.com/avatar/?d=mm", hideCredits = true; //]]> </script> <script type="text/javascript" src="http://gemar-html.googlecode.com/svn/trunk/js/widget-komentar-terbaru-dengan-avatar-bulat.js"></script> <script type="text/javascript" src="http://www.catatan-piper-comex.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>

4. Sebelum disimpan Anda ganti dulu alamat url saya (catatan-piper-comex.blogspot.com) dengan alamat url blog Anda, setelah diganti dengan alamat url blog Anda, kilk save / simpan. Lihat artikel Anda yang sudah berisi komentar, atau Anda bisa uji coba membuat komentar dengan akun blog untuk melihat hasilnya.

Apabila ada yang masih kurang jelas, silahkan tinggalkan pesan pada kolom komentar.
Semoga bermanfaat.

Read More

Waveguide Antenna Atau Cantenna Kalkulator

Waveguide Antenna kalkulator  Informasi dari ARRL Antenna handbook

Diameter Paralon / Kaleng (inches)

Frequency	Mhz
TE11 Cutoff Frequency	MHz
TM01 Cutoff Frequency	MHz
Guide Wavelength	inches
1/4 Guide Wavelength	inches
3/4 Guide Wavelength	inches

Masukkan diameter (inches) dari paralon atau kaleng yang akan dibuat sebagai antena, masukkan frekuensi dari jaringan yang dinginkan (GSM / CDMA / WiFi) kemudian klik tombol calculate.

Diameter Paralon / Kaleng (cm.)

Frequency	Mhz
TE11 Cutoff Frequency	MHz
TM01 Cutoff Frequency	MHz
Guide Wavelength	cm
1/4 Guide Wavelength	cm
3/4 Guide Wavelength	cm

Masukkan diameter (cm.) dari paralon atau kaleng yang akan dibuat sebagai antena, masukkan frekuensi dari jaringan yang dinginkan (GSM / CDMA / WiFi) kemudian klik tombol calculate.

Apabila keluar keterangan NaN (Not a number) artinya bahwa paralon atau kaleng yang akan dibuat sebagai waveguide antenna diameternya terlalu kecil untuk bekerja pada frekuensi dari jaringan yang diinginkan.

Keterangan pada gambar:
D    = Diameter Waveguide
Lo  = Panjang Gelombang (diambil nilai tengah spektrum)
Lg  = Panjang Gelombang spektrum terukur yang dapat digunakan

Keterangan pada tabel:
Frequency = Frekuensi yang bekerja pada jalur GSM / CDMA / WiFi
TE11 Cutoff Frequency = Frekuensi Cut-off Bawah
TM01 Cutoff Frequency = Frekuensi Cut-off Atas
Guide Wavelength = Panjang gelombang (diambil nilai tengah spektrum)

Read More