Celoteh Sang Galang

Blog Tempat Berbagi Tips dan Trik Dunia Blogger
English French German Spain Italian Dutch Russian Brazil Japanese Korean Arabic Chinese Simplified
Celoteh Sang Galang
Hanya Sebuah Catatan...

Award Pertamaku

Posted by Galang 28 Maret 2011


Assalamualaikum Wr.Wb. Buat Sahabat Blogger Yang Tercinta...
Hari ini aku dikejutkan oleh kawanku Syamsul dan Klopototolia TJ yang menuliskan kata "Mas Tolong Dong di Ambil Awardnya" pada dinding ChatBox ku. Hatiku merasa senang ketika mendengar itu dan hampir saja jantung ku mau copot rasanya...hehehehe. Ini adalah Award pertamaku semenjak aku aktif jadi blogger 1 tahun belakangan ini. Terima kasih buat kawanku Syamsul dan Klopototolia TJ yang telah berbaik hati memberikan awardnya kepada saya.

Untuk memperoleh Award ini sebenarnya tidak sulit, kita hanya sering2 berkunjung saja sekedar untuk menyapa sahabat Blogger yang lainnya. Dan seperti biasanya, Award ini juga Award backlink yang harus di bagi-bagi lagi kepada sobat2 blogger yang lainnya sebanyak 12 orang. Aturan mainnya dari para pemberi sebelumnya, ada 4 peraturan yaitu:
  1. Memberikan ucapan terima kasih  dan  memasang link pada pemberi Award.
  2. Menceritakan secara singkat siapa diri kita.
  3. Memberikan/menggulirkan  award kepada 12 teman yang dianggap paling sering berkunjung dan memberikan komentar pada blog kita.
  4. Menghubungi / memberitahu teman calon penerima award melalui kotak komentar maupun buku tamu pada blog mereka.

Celoteh Galang hanyalah sebuah blog sederhana, tempat berbagi informasi tentang dunia blogger dan tempat celoteh-celoteh saya yang saya tuangkan di blog ini. Mengulas sedikit tentang diri saya yang hanyalah orang biasa tetapi bermimpi untuk menjadi orang yang luar biasa. Selain Ngeblog saya juga hobby Photography yang akhir-akhir ini saya tinggalkan karena padatnya kesibukan saya. Itulah sepenggal kisah tentang Celoteh Galang.

Di bawah ini adalah sobat-sobat Blogger yang dapat Award dari saya :

Untuk nama Sobat yang mendapat Award di atas sudi kiranya untuk membagi Award kepada sahabat-sahabat Blogger yang sering memberikan Komen atau menegur sapa di GuestBook di Blog sobat. Ini adalah Award yang saya terima dan saya akan berikan kepada Sobat

Sekian Terima Kasih dan Salam Kompak Selalu...

Tips Menampilkan Postingan Hanya Judulnya Saja

Posted by Galang 26 Maret 2011


Ini adalah trik buat memotong atau mempersingkat artikel di halaman depan, sebagian orang ada juga yg mempersingkat nya dengan mengunakan trik readmore, tapi kali ini kita hanya menampilkan hanya judulnya saja, dan yang terlihat di halaman depan hanya judul postingannya saja. Contohnya bisa Anda lihat Disini

Agar pada halaman depan hanya menampilkan judul posting saja, berikut langkah-langkahnya :

  • Silahkan login ke blogger dengan ID anda.
  • Klik Rancangan  
  • Klik menu Edit HTML.
  • Disarankan untuk membuat backup terlebih dahulu, klik pada tulisan Download Template Lengkap.
  • Carilah kode ]]></b:skin>
  • Copy kode berikut, lalu paste di bawah kode ]]></b:skin>
    <style type='text/css'>
         <b:if cond='data:blog.pageType != &quot;item&quot;'>
         <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
         .post-body{display:none;}
         </b:if>
         </b:if>
         </style>
  • Klik tombol SIMPAN TEMPLATE.
  • Selesai. Silahkan lihat hasilnya.
Mudah bukan? namun, dengan memasang kode diatas masih menyisakan beberapa elemen seperti tanggal posting, komentar dan yang lainnya. Jika anda ingin menghilangkan semuanya dan yang tersisa hanya judul post nya saja, mungkin anda bisa menggunakan kode berikut :

<style type='text/css'>
     <b:if cond='data:blog.pageType != &quot;item&quot;'>
     <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
     .post-body, .post-footer, .jump-link, 
     .post-timestamp, .reaction-buttons, 
     .star-ratings, .post-backlinks, 
     .post-icons, .date-header{display:none;}
     </b:if>
     </b:if>
     </style>
Jika ternyata masih ada elemen tersisa selain judul post, mungkin kode template anda tidak mengikuti standar template blogger. Bagaimana solusinya? anda harus mengenali struktur template anda.
Bagi anda pengguna browser internet firefox, kang Rohman punya tips mudah mengenali struktur template anda yaitu dengan menginstall add-ons Web Developer yang bisa anda download di add-ons for firefox.
Sekarang kang Rohman anggap anda telah menginstall add-ons web developer pada firefox yang anda gunakan. Silahkan buka alamat blog anda ( tentunya yang akan di edit sesuai artikel diatas ). Klik menu Information, kemudian pilih Display Div Order.
div order
Maka secara otomatis akan ditampilkan struktur div dari template anda. Contoh gambar :
struktur div
Dari gambar tersebut terlihat bahwa tanggal posting serta komentar disimpan dalam elemen div :
.databarleft
.datebarright

Sehingga kode yang digunakan menjadi seperti ini :

<style type='text/css'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
.post-body, .databarleft, .datebarright{display:none;}
</b:if>
</b:if>
</style>
Semoga bisa dipahami.
Update : kode telah di sempurnakan agar tidak konflik dengan static page / static post

Sekian Terima Kasih

Hari ini ada sahabat Blogger yang bertanya kepada saya, Bagaimana cara membuat buku tamu seperti saya?Kali ini saya akan share bagamana cara membuat Shoutbox Melayang Dengan Light Effect jQuery yang ilmunya saya dapat dari teman saya yaitu Aziz Lamayuda. Buku Tamu kali ini adalah shoutbox melayang dengan jquery namun tampilannya berbeda dengan adanya light effect, dalam artian, saat button buku tamu di KLIK maka seluruh halaman akan gelap kecuali shoutbox atau buku tamunya. Untuk lebih jelasnya silahkan perhatikan gambar dibawah ini :







Untuk membuatnya sangat simple, kita tidak perlu mengutak-atik kode pada template kita, karena kalian tinggal memasangnya pada widget di Elemen Halaman. Untuk lebih jelasnya silahkan ikuti tahap-tahap pemasangannya dibawah ini:

1. Login Ke Blogger kalian
2. Pilih Rancangan ---> ELEMEN halaman
3. Tambah Gadget ---> Pilih HTML/Java Script
4. Simpan kode berikut dalam konten HTML/Java Scriptnya



<!-- Start Shoutbox light effect by azis -->

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>

<script>
$(document).ready(function() {
//select all the a tag with name equal to modal

$('a[name=modal]').click(function(e) {

//Cancel the link behavior

e.preventDefault();



//Get the A tag

var id = $(this).attr('href');



//Get the screen height and width

var semahHeight = $(document).height();

var semahWidth = $(window).width();



//Set heigth and width to semah to fill up the whole screen

$('#semah').css({'width':semahWidth,'height':semahHeight});



//transition effect

$('#semah').fadeIn(1000);

$('#semah').fadeTo("slow",0.8);



//Get the window height and width

var winH = $(window).height();

var winW = $(window).width();



//Set the popup window to center

$(id).css('top', winH/2-$(id).height()/2);

$(id).css('left', winW/2-$(id).width()/2);



//transition effect

$(id).fadeIn(2000);



});



//if close button is clicked

$('.window .close').click(function (e) {

//Cancel the link behavior

e.preventDefault();



$('#semah').hide();

$('.window').hide();

});



//if semah is clicked

$('#semah').click(function () {

$(this).hide();

$('.window').hide();

});



});
</script>

<style>a {color:#ffffff; text-decoration:none}
img { border: none; }
#semah {

position:absolute;

left:0;

top:0;

z-index:9000;

background-color:#000;

display:none;

}



#wadah .window {

position:fixed;

left:0;

top:0;

width:440px;

height:200px;

display:none;

z-index:9999;

padding:20px;

}
#wadah #azisshoutbox {

background:url(http://i809.photobucket.com/albums/zz15/yuda03/REDGUESTBOOK.png) no-repeat 0 0 transparent;

width:272px;

height:460px;

padding:56px 0 20px 5px;

}
#tutupan {

padding:2px 0 0 0;

}

</style>


<ul><center> <a href="#azisshoutbox" name="modal"><img src="http://i809.photobucket.com/albums/zz15/yuda03/shoutboxtabRED.png" border="0" width="158" height="58" /></a> </center> </ul>

<div id="wadah">

<!-- Start Shoutbox -->

<div id="azisshoutbox" class="window">

SIMPAN SCRIPT SHOUTBOX KALIAN DISINI

<div id="tutupan"><input type="button" value="Close" class="close" />

</div></div><!-- End Shoutbox -->

<div id="semah"></div></div>

<!-- End of Shoutbox light effect by azis -->
</div>

5. Jangan lupa disimpan
Catatan
  • Untuk ukuran shoutbox/shoutmix/cbox kalian bisa kalian sesuaikan dengan background gambar.
  • Untuk Shoutmix ukurannya Height: 380px dan Width: 261px
  • Untuk Cbox ukurannya height:300px width:250px , untuk width yang bawah samakan dengan width pertama, karena di cbox ada 2 width
  • untuk ukuran tidak harus terpaku pada punya saya diatas, kalian boleh menyesuaikannya sendiri.


untuk background gambar bisa kalian ganti dengan gambar kalian sendiri, namun jika ingin gambar buatan saya bisa menggunakan gambar dibawah ini :

http://i809.photobucket.com/albums/zz15/yuda03/GUESTBOOKRED.png

http://i809.photobucket.com/albums/zz15/yuda03/gbRED.png

http://i809.photobucket.com/albums/zz15/yuda03/REDGUESTBOOK.png

http://i809.photobucket.com/albums/zz15/yuda03/shoutboxtabRED.png

TAMBAHAN :

Tampilan button shoutbox diatas letaknya didalam sidebar, dan karena ada permintaan salah satu sahabat blogger, yang meminta untuk memasang buttonnya disamping,

gan saya mau nanya ni, bisa gak bmbrnya di tempel di kanan gtu atw di kiri? mohon bntuannya ya :)

Supaya gambar berada melayang disamping silahkan kalian ganti kode ini:

<ul><center> <a href="#azisshoutbox" name="modal"><img src="http://i809.photobucket.com/albums/zz15/yuda03/shoutboxtabRED.png" border="0" width="158" height="58" /></a> </center> </ul>


dengan kode ini :

<ul><div style='display:scroll; position:fixed; top:5px; right:3px;'>
<a href="#azisshoutbox" name="modal"><img src="http://lh3.ggpht.com/_MvLBi88bM_I/TKBi6-LLyiI/AAAAAAAABgo/mXUIjU7ayaY/NiceGB.png" width="158" height="58" /></a>
</div>
</ul>


Untuk gambarnya juga saya sudah buatkan, dan silahkan tinggal digunakan.



Semoga bisa membantu dan Semoga bermanfaat....


sumber : http://www.z33s.co.cc/2010/09/shoutbox-melayang-dengan-light-effect.html

AdsenseCamp Terbukti Membayar

Posted by Galang 23 Maret 2011

Adsense Indonesia

AdsenseCamp terbukti membayar, kata-kata itulah yang memang pantas untuk PPC yang satu ini. Dengan rata-rata  per klik iklan dihargai Rp300 sehingga banyak disukai oleh para pebisnis online atau Publisher seperti saya ini. Memang banyak PPC di Indonesia ini yang bagus seperti KlikSaya.com dan Kumpulblogger.com. Tapi saya sangat menyukai PPC yang satu ini karena akuratnya jumlah klik dan pembayarannya yang tepat waktu.

Salah satu bisnis online yang saya tekuni sekarang adalah bisnis periklanan, karena bisnis periklanan memiliki prospek yang lambat namun menghasilkan dalam waktu jangka panjang. Adsensecamp.com adalah web periklanan online yang bergerak dalam bidang iklan PPC (Pay Per Click). Anda bisa mengiklankan bisnis anda di sini, tentunya membayar dengan sejumlah rupiah. Tapi dengan banyaknya jaringan yang di miliki tidak ada ruginya juga beriklan di sini.

Selain itu kita bisa mendulang rupiah meskipun receh (tapi uang juga kan? ) , awalnya saya pesimis dengan menjadi publisher dari AdsenseCamp.com karena lama banget ga naik-naik earning saya. Tapi setelah lama berjuang dan akhirnya bisa menghasilkan uang yang cukup lumayanlah buat jajan atau sekedar buat membeli Cendol hehehe. Dibawah ini ada screenshot pembayaran saya dalam 3 bulan yang saya ambil waktu bulan Januari kemarin.
Bulan November : Rp 288.300
Bulan Desember  : Rp 147.600
Bulan Januari       : Rp 324.900
Cukup Lumayan Bukan...???
 
klik gambar untuk memperbesar

Bagaimana pendapat Anda..???Apakah berminat untuk bergabung dengan AdsenseCamp. Kalau mau bergabung klik aja DISINI atau Klik Banner di bawah ini
Adsense Indonesia


close