Cara membuat efek salju pada blog

Kalau tidak salah di Eropa sekarang ini menjelang musim salju, tapi kita tidak membahas tentang musim salju, tapi membahas bagaimana cara membuat salju bertaburan di blog.


Tidak seberapa penting, tapi setidaknya bagus untuk menghiasi blog. Untuk sobat yang tertarik untuk mencoba, berikut beberapa langkah mudah membuat efek salju pada blog :

1. Login pada blog sobat

2. Rancangan >> Add Gadget >> pilih yang java script / Html

3. Copy code script dibawah dan paste di kotak tadi , untuk judulnya kosongkan saja.
<script src="http://masterendi.googlecode.com/files/salju.js"></script>

4. Save Gadget

Bagaimana, apa blog sobat sudah bertaburan salju?

Mengubah Lebar Arsip Drop down

Apakah anda memasang arsip di blog dengan menggunakan pilihan arsip drop down? sedikit tidak nyaman dengan ukuran lebarnya yang tidak sesuai dengan lebar sidebar? apabila masalahnya hanya seperti itu, anda bisa mengubah lebar dari arsip tersebut sesuai dengan keinginan anda. Emang bisa? ya bisa saja atuh. Ingin tahu caranya? silahkan baca sampai selesai!

Untuk hal yang satu ini, pastikan terlebih dahulu bahwa arsip yang anda gunakan adalah yang berbentuk dropdown. Sudah? yuk mulai saja.

1. Login ke blogger dengan ID anda.
   
2. Klik Tata Letak.
   
3. Klik tab Edit HTML.
   
4. Klik pada tulisan Download Template Lengkap di bagian sebelah atas monitor. Silahkan di Backup dulu templatenya (sangat penting).
   
5. Beri tanda centang pada kotak kecil di samping tulisan Expand Template Widget.
   
   
   
   
   
   
6. Tunggu beberapa saat sampai proses selesai.
   
7. Cari kode yang seperti di bawah ini :
   
   
   
   

   
   
     <b:includable id='menu' var='data'>
       
     <select expr:id='data:widget.instanceId + &quot;_ArchiveMenu&quot;'>
   
       
       <option value=''><data:title/></option>
   
       
       <b:loop values='data:data' var='i'>
   
       
         <option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>
   
       
       </b:loop>
   
       
     </select>
   
       
   </b:includable>
   

   
   
8. Hapus kode diatas, lalu ganti dengan kode kode di bawah ini :
   
   
   
   

   
   
     <b:includable id='menu' var='data'>
       
     <select expr:id='data:widget.instanceId + &quot;_ArchiveMenu&quot;' style='width:100%'>
   
       
       <option value=''><data:title/></option>
   
       
       <b:loop values='data:data' var='i'>
   
       
         <option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>
   
       
       </b:loop>
   
       
     </select>
   
       
   </b:includable>
   

   
   
9. Klik tombol Simpan Template.
   
10. Selesai. Silahkan lihat hasilnya.

Sebenarnya langkah di atas adalah hanya menambahkan kode style='width:100%' pada menu dropdown yang sudah ada, tentunya nilai style='width:100%' bisa di ganti dengan nilai yang lainnya.

selamat mencoba!

Membuat Read More untuk Template klasik

Wah judul yang aneh, "membuat Read More" maksudnya apa? Begini sobat, sebenarnya saya kurang setuju dengan judul tersebut, tadinya saya ingin memberi judul "Membuat menu Selengkapnya", tapi berhubung kata "Read More" yang paling di kenal di jagad blog, ya saya pun ikut-ikutan (dasar tukang ngekor). Ya sudahlah kepanjangan ngobrolnya. Kita mulai pembahasannya. Bagi para sobat yang baru mulai membuat blog, mungkin belum mengetahui informasi ini dan mudah-mudahan dengan membaca artikel ini dapat menambah pengetahuan kita tentang yang namanya nge-blog.

Sobat mungkin melihat bahwa artikel-artikel saya terlihat hanya berupa judul-judul dengan satu atau dua buah paragrap saja, dan untuk melihat keseluruhan artikel harus meng klik link yang bertuliskan >> Selengkapnya...", ini di sebut pengkaburan atau pengkamuflasean postingan (ribet banget nyebutnya). Bagi sobat yang baru posting artikel hanya satu atau dua artikel saja mungkin menganggap tidak perlu menyingkat artikel sobat, namun jika nanti artikel sobat sudah banyak, maka mungkin saja ada terbersit ingin membuat menu ini.

Oke... kelamaan ngawurnya, mending langsung saja. Untuk membuat menu Read more kita harus menambahkan beberapa kode HTML ke dalam template blog kita. Tapi untuk postingan kali ini, saya khususkan untuk blogger yang memakai template klasik saja, untuk yang memakai template baru silahkan tunggu pada postingan yang akan datang.

Silahkan ikuti langkah-langkah berikut :

• Login ke blogger.com dengan id sobat
• Klik menu bertuliskan Template
• Klik menu Edit HTML
• jangan lupa Copy seluruh kode template milik sobat lalu paste pada notepad dan kemudian simpan, untuk membuat back up data. Ini dimaksudkan apabila terjadi kesalahan dalam template setelah kita otak-atik, kita masih punya cadangan data untuk mengembalikannya.
• Copy kode HTML di bawah, kemudian paste persis di atas kode </style> :
<MainOrArchivePage> div.fullpost {display:none;} </MainOrArchivePage> <ItemPage> div.fullpost {display:inline;} </ItemPage> Untuk mempercepat pencarian kode </style>, silahkan sobat klik menu Edit yang ada pada bar menu browser, kemudian klik Find (on this page)..., lalu tulis </style> trus klik tombol find next, maka secara otomatis akan di bawa ke kode tersebut.
• langkah selanjutnya adalah, silahkan copy kode berikut lalu paste setelah kode <$BlogItemBody$> :
<MainOrArchivePage><br/> <a href="<$BlogItemPermalinkURL$>">Read more!</a> </MainOrArchivePage> Lagi-lagi Untuk mempercepat pencarian kode <$BlogItemBody$>, silahkan sobat klik menu Edit yang ada pada bar menu browser, kemudian klik Find (on this page)..., lalu tulis <$BlogItemBody$> trus klik tombol find next, maka secara otomatis akan di bawa ke kode tersebut.
• Klik tombol yang bertuliskan SAVE SETTINGS
  
  
  
• Langkah selanjutnya adalah klik menu Setting
• Klik menu Formatting
• Dibagian bawah menu tersebut ada kotak di samping tulisan Post Template, nah isi kotak kosong tersebut dengan kode di bawah ini :
<div class="fullpost"> </div> Sebenarnya langkah diatas tidak wajib dilakukan,akan tetapi ini di maksudkan agar ketika kita mau posting artikel, kode tersebut akan muncul secara otomatis tanpa harus di tulis dahulu, tentunya ini akan lebih mempermudah dan tidak harus selalu mengingat kode tersebut.
• kemudian jangan lupa klik tombol Save Settings
• Selesai

Cara Posting Artikel


Oke, sesudah beberapa tahap kita lalui, sekarang kita masuk ke tahap bagaimana cara memposting suatu artikel agar ada menu Readmore nya.

• Klik menu Posting
• klik menu Edit HTML, nah di sana secara otomatis akan tampak kode yang kita simpan tadi, yakni :
<div class="fullpost"> </div> simpan artikel sobat yang ingin di tampilkan sebelum kode <div class="fullpost">, kemudian simpan sisa keseluruhan artikel setelah kode <div class="fullpost"> dan sebelum kode </div> Agar lebih jelas, saya beri contoh, misal artikelnya begini : Ini adalah contoh tulisan yang di simpan pada awal artikel yang akan selalu muncul pada blog kita, sedangkan tulisan yang lainnya tidak akan muncul. <div class="fullpost"> dan tulisan yang ini adalah tulisan yang akan muncul ketika para pengunjung meng klik link yang bertuliskan Read more. </div> Hasilnya yang akan tampak pada blog kita adalah seperti ini : Ini adalah contoh tulisan yang di simpan pada awal artikel yang akan selalu muncul pada blog kita, sedangkan tulisan yang lainnya tidak akan muncul. Read more!

Bagaimana sobat, sudah jelaskan. bila belum jelas silahkan di tanyakan kembali pada komentar.

Sedikit clue, kata Read more! sebenarnya bisa kita ganti sesuai dengan keinginan kita, misalkan kita rubah menjadi Baca selengkapnya..., Selengkapnya.., Lanjutannya... atau apa saja yang penting kata tersebut bisa memberi tahu kepada para pengunjung bahwa artikel kita ada kelanjutannya.

Kode di atas sebenarnya ada alternatif lain, yakni memakai kode Span, jika berminat, ganti semua kode div menjadi Span. Hasilnya akan sama, cuma bagi para sobat yang suka posting pada menu compose, kode ini sering ada masalah di karenakan bertabrakan dengan perintah lain yang memakai kode Span.

Tutorial software PopUp Generator

Sudah lama tidak posting tentang tutorial software yang disediakan oleh http://www.obralplus.com/?id=rohman serta oleh http://www.resepbisnis.com/?id=rohman bagi para anggotanya. Mau iseng-iseng mengulas tentang cara penggunaan dari software PopUp generator yang bisa di download di halaman member http://www.resepbisnis.com/?id=rohman.


@kang rohman
Pernah mendengar tentang iklan popup di internet? sudah dipastikan sobat pernah mendengar istilah ini dan tentunya tidak perlu lagi saya ulas. Atau mungkin ada yang belum tahu? khusus bagi yang belum tahu sedikit akan saya ulas. Agar lebih mudah di mengerti saya beri sedikit gambaran. Mungkin sobat pernah mengunjungi situs di internet dan secara tiba-tiba muncul window baru (biasanya iklan situs) di layar monitor tanpa kita bermaksud untuk memanggil atau mengunjungi situs tersebut, dan window baru itulah yang di sebut dengan iklan dalam bentuk Popup, Fahamm ? (kata ustad sobat dalam film si entong begitu).

Banyak orang yang tidak menyukai akan iklan popup ini dengan berbagai alasan, diantaranya yaitu terkadang iklan yang muncul berupa gambar yang tidak enak di pandang mata alias kurang senonoh dan popup ini membuat koneksi internet menjadi sedikit lambat di karenakan jendela browser lebih dari satu, selain itu pula tidak jarang iklan popup sebagai sarana untuk menyusupkan berbagai virus ke komputer. Untuk mengatasi hal ini, banyak pengguna komputer menghidupkan fitur PopUp bloker pada browsernya.

Namun dengan berbagai alasan di atas, pada relitanya banyak sekali pemilik situs masih menggunakan iklan melalui popup dan dari alasan itu saya mengira iklan PupUp masih efektif untuk sarana beriklan. Nah.... bagi yang berminat untuk beriklan melalui PopUP, ada software yang sangat simpel dan praktis tapi sangat handal yaitu PopUp generator. Dengan menggunakan software ini, kita dapat membuat iklan PopUp dalam waktu dua setengah menit atau mungkin bisa kurang. Akan tetapi setelah saya melakukan serangkaian uji coba, script yang di hasilkan oleh software ini hanya berfungsi secara baik pada template blogger versi baru (XML), sedangkan untuk template klasik (html) saya masih belum bisa menerapkannya alias tidak bisa berfungsi secara baik.

Sudah jenuh dengan intermezo diatas dan ingin langsung ke topik bahasan tentang tutorial software ini? hmmmmm... kita langsung aja deh. Bagi sobat yang telah tergabung di resep bisnis, silahkan download dulu software ini di halaman member. Kapasitas data yang didownload tidaklah terlalu besar yakni sebesar 949kb dalam format file zip, setelah di download tentu saja harus di ekstrak terlebih dahulu dengan software winzip. Setelah di eksrtak, sobat akan menemukan beberapa file. Yang harus di jalankan adalah file Popup.exe, tidak perlu di install. setelah di jalankan, sobat akan melihat panel seperti ini :

Dari tampilan panel diatas, terlihat ada beberapa tulisan. Nah...tulisan tersebut masing-masing mempunyai fungsi yang berbeda, agar lebih jelas sedikit akan saya uraikan :

Function Name

Function name hanyalah sebagai penentu Function untuk javascript, secara default tertulis di sana popupgenerator, tulisan ini boleh di ubah sekehendak kita asal hanya satu kata tidak boleh ada spasi, atau bila tidak di ubahpun tidak apa-apa.

Popup Name

Hampir mirip dengan Function name, bisa di ubah bisa juga di biarkan sesuai defaultnya.

Dimensions

Dimension ini adalah untuk mengatur ukuran dari popup yang ingin di munculkan, satuan yang di pakai adalah pixel. Jadi sobat hanya perlu memberi tanda ceklis pada kotak di samping tulisan Popup Size, kemudian menuliskan ukuran dari window popup yang ingin di munculkan.

Fullscreen

Selain ukuran dimensi bisa kita atur, kitapun bisa menampilkan dalam satu layar penuh. Caranya dengan memberi tanda pada radio button di samping tulisan fullscreen.

Position

Apabila sobat berkeinginan ingin mengatur letak munculnya window popup, sobat hanya tinggal membubuhkan nilai koordinat dari layar monitor dalam satuan pixel.

» "Top" berarti koordinat di hitung dari sebelah atas layar.
» "Left" berarti koordinat di hitung dari sebelah kiri layar.

Options

Options ini memberikan kebebasan kepada kita untuk memilih mana yang akan kita pakai dengan cara memberi tanda ceklis pada kotak di samping tulisan yang tertera, yaitu antara lain :

» Location Bar : bila hanya memilih ini, maka popup yang akan muncul pada window browsernya hanya mempunyai Location Bar saja.

» Directories : window yang akan muncul hanya menampilkan Links dalam browser IE.

» Menu Bar : hanya memunculkan teks dalam menu bar nya. Normalnya seperti : File, Edit, View, dan lain-lain.

» Tool Bar : ini akan memunculkan Tool bar yang ada dalam browser seperti : Forward, back, Search, Home, serta yang lainnya.

» Status Bar : dalam browser IE, dibagian bawah terdapat status bar untuk menampilkan alamat URL apabila mouse menyorot sebuah link.

» Scroll bar : pilihan ini akan membuat popup yang tercipta mempunyai scroll bar.

» Resizable : window pupup yang akan tercipta akan bisa di ubah, misal ingin di maximize atau di minimize.

Dari berbagai options pilihan di atas, kita bisa memilih satu atau beberapa atau mungkin memilih semuanya.

URL of Window

Alamat URL yang tertera harus di ganti dengan alamat URL situs yang di tuju. Misal : http://www.resepbisnis.com/?=rohman.

Select Trigger

Ini akan menentukan bagaimana window popup itu akan muncul.

» Standar Link : pilihan ini adalah seperti link biasa pada umumnya, yaitu ada sebuah link jika ada pengunjung yang meng klik nya, maka akan muncul window baru.

» Form Button : seperti link biasa, akan tetapi dalam bentuk tombol.

» When Page Loads : Pilihan ini agar window popup akan muncul secara otomatis ketika ada pengunjung yang datang mengunjungi blog sobat.

» When Page Unloads : Windows popup akan muncul secara otomatis apabila ada pengunjung blog sobat yang menutup (meninggalkan) blog sobat, pilihan ini di rasa lebih baik karena window popup yang muncul tidak akan menggangu perhatian pengunjung terhadap blog sobat karena justru ketika pengunjung blog meninggalkan blog sobat, window popup nya baru akan muncul.

Location Of Window

Lokasi munculnya window pun dapat kita atur.

» In front : window popup yang muncul akan keluar dan langsung berada di depan blog sobat. Sehingga blog sobat akan tertutup.

» In Back : window yang muncul posisinya akan berada di belakang halaman blog sobat.

Days To Repeat Popup

Ada dua pilihan :

» jika menuliskan angka "0" (nol) maka popup yang tampil akan selalu muncul setiap kali ada yang berkunjung walaupun pengunjung tersebut orangnya itu-itu juga.

» jika menuliskan angka "999", maka popup yang tampil akan muncul hanya satu kali saja pada pengunjung yang sama. jadi orang yang pernah melihat popup sobat tidak akan melihatnya lagi dengan catatan pengunjung tersebut tidak melakukan delete Cookies.

1.Generate Code

Tombol ini berfungsi untuk membuat kode apabila sobat telah selesai melakukan pengesetan tentang yang tadi di atas terangkan.

Reset

Tombol untuk reset agar kode yang sudah di generate menjadi kosong lagi.

2.Test/View Popup

Tombol untuk melihat contoh window popup yang telah di buat.

3.Get Code

Tombol untuk mendapatkan Javascript yang akan di pasang di blog.


Sekilas tentang fitur-fitur yang ada di panel sudah cukup, semoga mudah untuk di mengerti.


Sekarang tiba waktunya untuk beraksi yaitu menempatkan kode yang di hasilkan dari software ini ke blogger.com.

» Langkah #1

1. Jalankan software PopUp generatornya.
2. Lakukan setting sesuai yang di inginkan.
3. Klik tombol 1.Generate Code, kemudian klik tombol 3.Get Code. Akan muncul panel baru seperti gambar di bawah ini :

4. Silahkan diamkan dulu untuk nanti keperluan di ambil kodenya.

» Langkah #2

1. Silahkan login di blogger dengan ID sobat.
2. Klik Layout.
3. Klik menu Edit HTML.
4. Klik tulisan Download Template Lengkap. Silahkan save dulu untuk backup kode template, agar aman apabila terjadi kesalahan.
5. Buka kembali panel kontrol dari software popup generator, yaitu panel yang ini :

6. Klik pada tombol Grab Text yang bagian atas. Lalu klik kanan, pilih copy.
7. Paste kode yang tadi di copy di atas kode </head> (pada kode template)

Ada satu catatan penting yaitu sobat harus merubah kode yang bertuliskan : </script> Menjadi hurup kapital semua, yaitu seperti ini : </SCRIPT>

Misalkan kode yang di dapat seperti ini :
<SCRIPT LANGUAGE='JAVASCRIPT' TYPE='TEXT/JAVASCRIPT'> <!-- /**************************************************** Created With: PopupGenerator URL: http://www.popupgenerator.com ****************************************************/ var win=null; function NewWindow(mypage,myname,w,h,pos,infocus){ if(pos=="random"){myleft=(screen.width)?Math.floor(Math.random()*(screen.width-w)):100;mytop=(screen.height)?Math.floor(Math.random()*((screen.height-h)-75)):100;} if(pos=="center"){myleft=(screen.width)?(screen.width-w)/2:100;mytop=(screen.height)?(screen.height-h)/2:100;} else if((pos!='center' && pos!="random") || pos==null){myleft=0;mytop=20} settings="width=" + w + ",height=" + h + ",top=" + mytop + ",left=" + myleft + ",scrollbars=yes,location=yes,directories=yes,status=no,menubar=no,toolbar=no,resizable=yes";win=window.open(mypage,myname,settings); win.focus();} // --> </script>
Maka kodenya di uabah menjadi seperti ini :
<SCRIPT LANGUAGE='JAVASCRIPT' TYPE='TEXT/JAVASCRIPT'> <!-- /**************************************************** Created With: PopupGenerator URL: http://www.popupgenerator.com ****************************************************/ var win=null; function NewWindow(mypage,myname,w,h,pos,infocus){ if(pos=="random"){myleft=(screen.width)?Math.floor(Math.random()*(screen.width-w)):100;mytop=(screen.height)?Math.floor(Math.random()*((screen.height-h)-75)):100;} if(pos=="center"){myleft=(screen.width)?(screen.width-w)/2:100;mytop=(screen.height)?(screen.height-h)/2:100;} else if((pos!='center' && pos!="random") || pos==null){myleft=0;mytop=20} settings="width=" + w + ",height=" + h + ",top=" + mytop + ",left=" + myleft + ",scrollbars=yes,location=yes,directories=yes,status=no,menubar=no,toolbar=no,resizable=yes";win=window.open(mypage,myname,settings); win.focus();} // --> </SCRIPT>
8. Cari kode pada template sobat yang seperti di bawah ini :
<body>
9. Buka kembali panel kontrol dari software popup generator, yaitu panel yang ini :

10. Klik pada tombol Grab Text yang bagian bawah. Lalu klik kanan, pilih copy.
11. Gantilah kode <body> dengan kode yang tadi di copy pada popup generator.
misalkan kode <body> di ubah menjadi seperti ini :
<body onLoad='NewWindow("http://www.resepbisnis.com/?id=rohman","iklan","640","480","center","front");'>
12. Klik tombol SIMPAN TEMPLATE.
13. Selesai. Silahkan lihatt bagaimana hasilnya.

pasang google adSENSE

Setelah sekian lama absen dari aktivitas blogging, akhirnya kang rohman mencoba kembali untuk posting tutorial. Entah kenapa akhir-akhir ini kang rohman sedikit kurang semangat untuk membuat tulisan, apalagi jika membuat artikel tutorial yang sudah barang tentu harus memuat kode ataupun script yang dalam menuliskannya perlu waktu banyak sehingga sangat membosankan. Apakah kang rohman sudah kehabisan bahan untuk posting? jika di bilang kehabisan bahan posting jawabannya adalah tidak, karena di antara para pengunjung banyak sekali yang mengajukan pertanyaan, dan dari pertanyaan tersebutlah sebenarnya bahan inspirasi kang rohman, namun memang dasarnya kang rohman sedang kurang semangat untuk ngeblog, jadi ya nunggu mud nya muncul dulu baru nanti satu-satu kang rohman jawabin.

Melihat dari pertanyaan-pertanyaan yang ada, yang paling sering di tanyakan adalah bagaimana cara memasang iklan Google Adsense di bawah posting? Duh fenomenal sekali ya Google Adsense, segala sesuatu yang sekiranya sedikit asing dan menarik dan belum di ketahui pasti banyak yang berburu informasi tentangnya ...ck...ck...ck...

S ebenarnya pemasangan kode di akhir postingan yang nanti akan kang rohman terangkan, tidak khusus untuk iklan Google Adsense saja namun bisa juga di ganti dengan iklan-iklan lainnya semisal iklan dari Kliksaya.com, Adbrite, Bidvertiser, dan juga iklan-iklan lainnya yang ingin di pasang di akhir postingan termasuk juga memasang banner-banner affiliasi ataupun tombol banner social bookmarking, namun itu tadi karena Google Asense yang fenomenal maka judul postingan ini lebih sfesifik untuk memasang iklan google adsense.

Yang pertama perlu di ketahui yaitu kode iklan Google Adsense tidak bisa di pasang langsung ke dalam kode template blogger. Mungkin sudah banyak di antara anda yang pernah mencoba memasukan kode iklan google adsense kedalam kode template di bagian Edit HTML, namun hasilnya selalu muncul pesan error seperti ini :

Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly. XML error message: The processing instruction target matching "[xX][mM][lL]" is not allowed.

Trus bagaimana bisa kang rohman memasang iklan GA langsung di bawah posting? agar hal itu bisa di lakukan, sebelum kode iklan GA di pasang pada kode template anda, terlebih dahulu harus di Parse. Apa yang di maksud dengan parse? yang di maksud dengan parse di sini adalah anda harus mengubah kode yang akan di tambahkan, misalkan kode iklan Goggle adsense seperti ini :


<script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxxxxxx";
google_ad_slot = "0976076963";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script
src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>


Tugas anda adalah kode di atas tadi harus di parse dulu yaitu menjadi seperti ini :


<script type="text/javascript"><!--
google_ad_client = "pub-xxxxxxxxxxx";
google_ad_slot = "0976076963";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script
src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">
</script>


Duh bingung banget ya memparse kode iklan GA? tidak usah bingung, karena ada banyak situs yang menyediakan tool yang dapat memparse kode iklan GA anda dengan sekali klik saja, salah satu contoh situs yang menyediakan tool ini adalah http://blogcrowds (sok atuh di klik biar keluar situsnya), anda tinggal masukan kode iklan Ga anda ke dalam kotak parse yang tersedia (di copy paste aja biar cepet) kemudian tinggal klik saja tombol parse dan twewewwwweeewwww... kode iklan GA anda sudah di parse dan siap untuk di pasang pada kode template anda.

Apakah boleh kita memparse kode iklan GA? kan TOS GA menyebutkan bahwa kita tidak di perbolehkan mengubah atau menambah atau mengurangi kode iklan GA yang di berikan? Nah ininih, silahkan tanyakan sendiri ke pihak google adsense, dan musti di ingat bahwa kang rohman tidak bertanggung jawab atas segala sesuatu pada account anda. Jika menurut kang rohman sendiri tidak apa-apa karena tidak mengubah struktur kode adsense, akan tetapi hanya di parse saja, dan untuk kasus ini pernah juga ada yamg mengirim email kepihak GA, silahkan baca di ini, dan jawaban dari pihak GA adalah boleh selama tidak ada penambahan kode apapun, akan tetapi walaupun demikian kang rohman sarankan untuk mengirim email sendiri ke pihak google adsense agar lebih yakin.

Setelah sedikit berbelit-belit, sekarang saatnya masuk ke bahasan utama yaitu memasang kode iklan GA di bawah postingan. Yang pertama yaitu anda di sarankan untuk memasang sistem read more yang telah kang rohman terangkan di sini, jika template anda sudah memakai sistem tersebut, silahkan ikuti langkah-langkah berikut :

1. Silahkan signin ke blogger dengan ID anda.
   
2. Klik layout.
   
3. Klik tab Adit HTML.
   
4. Klik tulisan Download Template Selengkapnya.
   
5. Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula
   
6. Beri tanda centang pada kotak di samping tulisan Expand Template Widget , lihat gambar di bawah :
   
   
7. Tunggu beberapa saat ketika proses sedang berlangsung
   
8. Silahkan anda cari kode berikut pada kode template milik anda (dengan asumsi template anda sudah terpasang sistem readmore) :
   
   
   <b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/>
<a expr:href='data:post.url'><strong>Selengkapnya...</strong></a></p>
</b:if>
   
9. Tambahkan kode iklan google adsense milik anda seperti ini (kode Ga nya harus yang sudah di parse) :
   
   
   <b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>

<br /> <br />
&lt;script type=&quot;text/javascript&quot;&gt;&lt;!--
google_ad_client = &quot;pub-xxxxxxxxxxx&quot;;
google_ad_slot = &quot;0976076963&quot;;
google_ad_width = 468;
google_ad_height = 60;
//--&gt;
&lt;/script&gt;
&lt;script
src=&quot;http://pagead2.googlesyndication.com/pagead/show_ads.js&quot; type=&quot;text/javascript&quot;&gt;
&lt;/script&gt;
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/>
<a expr:href='data:post.url'><strong>Selengkapnya...</strong></a></p>
</b:if>
   
10. Klik tombol Simpan Template.
    
11. Selesai. Silahkan lihat hasilnya.

Keterangan tambahan, kode iklan di atas tentu saja hanya sebagai contoh saja, silahkan di ganti dengan kode iklan milik anda sendiri. Untuk kode iklan tidak harus iklan google adsense tapi bisa juga kode iklan lainnya seperti iklan bidvertiser, adbrite, kliksaya.com, kumpul blogger, atau banner-banner affiliasi lainnya.

Selamat mencoba!

Tugas TIK

1. Apakah fungsi Undang-undang No. 19 tahun 2002, jelaskan!
2. Apakah Undang-undang No. 19 tahun 2002, di Indonesia sudah dilaksanakan dengan baik? Jelaskan
3. Apakah pengertian dari pemegang hak cipta? Jelaskan
4. Jelaskan pengertian etika dan berikan contoh penerapan etika dlam dunia teknologi informasi!
5. Apa yang anda ketahui tentang hak atas kekayaan intelektual?
6. Bagaimana cara anda menghargai karya cipta orang lain dalam teknologi informasi? Berikan contohnya.
7. Internet dengan segala layanan dan fasilitas yang ada di dalamnya telah menyatu dalam kehidupan masyarakat.Sebagian orang bahkan sangat tergantung pada internet.apakah fenomena ini dapat membuktikan bahwa internet dapat mengakibatkan kecanduan pada pemakainya?carilah contoh kasus tentang orang yang kecanduan internet !carilah informasi tantang layanan di internet yang menyebabkan kecanduan serta rumuskan langkah-langkah mengendalikan diri dari kecanduan internet masing-masing 5!
8. Cybersquating merupakan tindakan ilegal dan tidak etis. Para pelaku Cybersquatting disebut cybersquatter. Apa yang kalian ketahui tentang Cybersquatting, CYBER CRIME, DAN APA ITU HACKING, CRACKING, CARDING, PHISING ?

9. Jelaskan :
a. ™
b. ®
c. ©
d. SM


Jawaban

1. Fungsi dari Undang-undang No. 19 tahun 2002 adalah untuk melindungi secara hukum karya cipta orang lain sehingga tidak dapat digunakan oleh orang lain tanpa mengikuti prosedur yang telah ditetapkan (mengikuti prosedur perlindungan terhadap karya orang yang diatur dalam undang-undang hak cipta)
2. Belum, karena masih banyak kasus-kasus pelanggaran hak cipta di Indonesia seperti penggaandaan software-software tanpa lisensi yang resmi, Modus Operandi (sebuah perusahaan membeli beberapa software resmi, kemudian perusahaan itu menggandakannya melebihi kuota yang diijinkan)
3. Pemegang hak cipta adalah Pencipta sebagai Pemilik Hak Cipta, orang yang menerima hak dari pencipta, atau orang lain yang menerima lebih lanjut hak dari orang tersebut.
4. Etika merupakan salah satu cabang dari ilmu filsafat praktis yang merupakan suatu pemikiran kritis dan mendasar tentang ajaran-ajaran dan pandangan-pandangan moral.
Contoh penggunaan etika dalam dunia teknologi :
Berlaku sopan dalam menggunakan internet sebagi media komunikasi

5. Haka atas Kekayaan Intelektual adalah pengakuan hukum yang memungkinkan pemegang hak (atas) kekayaan intelektual tersebut mengatur penggunaan gagasan-gagasan dan ekspresi yang diciptakannya dalam jangka waktu tertentu.
6. Cara menghargai karya cipta orang lain dalam teknologi informasi adalah sebagai berikut :
a. Selalu menggunakan perangkat lunak yang legal dan berlisensi
b. Tidak melakukan penggandaan software-software ilegal
c. Selalu menggunakan perangkat lunak untuk hal-hal positif
d. Tidak mengubah atau memodifikasi program komputer yang memang tidak boleh diubah atau dimodifikasi oleh pembuatnya
e. Tidak menyalahgunakan lunak berbagai hal yang melanggar hukum
7. Cybersquatting adalah mendaftar, menjual atau menggunakan nama domain dengan maksud mengambil keuntungan dari merek dagang atau nama orang lain.
7.8. Dari beberapa pengertian di atas, cybercrime dirumuskan sebagai perbuatan melawan hukum yang dilakukan dengan memakai jaringan komputer sebagai sarana/ alat atau komputer sebagai objek, baik untuk memperoleh keuntungan ataupun tidak, dengan merugikan pihak lain.
8.9. Cracking (merusak atw membongkar serial number pada software asli agar dapat dijalankan pada komputer nya) ,
9.10. Phising merupakan kata plesetan dari bahasa Inggris yang berarti memancing. Dalam dunia yang serba terhubung secara elektronik saat ini, istilah phising banyak diartikan sebagai suatu cara untuk memancing seseorang ke halaman tertentu.
10.11. Phising tidak jarang digunakan oleh para pelaku kriminal di internet untuk memancing seseorang agar mendatangi alamat web melalui e-mail, salah satu tujuannya adalah untuk menjebol informasi yang sangat pribadi dari sang penerima email, seperti password, kartu kredit, dll.
11.12. Diantaranya dengan mengirimkan informasi yang seakan-akan dari penerima e-mail mendapatkan pesan dari sebuah situs, lalu mengundangnya untuk mendatangi sebuah situs palsu. Situs palsu dibuat sedemikian rupa yang penampilannya mirip dengan situs asli. lalu ketika korban mengisikan password maka pada saat itulah penjahat ini mengetahui password korban. Penggunaan situs palsu ini disebut juga dengan istilah pharming.
12.13.
13.14. Orang yang menggunakan kartu kredit tersebut disebut dengan Carder. Istilah ini diartikan sebagai kegiatan melakukan transaksi e-commerce dengan nomor kartu kredit palsu atau curian.
14.15. TM™
15.16. 23 12 2006
16.17. Jika diperhatikan, tak sedikit Tukang Mblog yang menggunakan Tanda Milik atau Tanda Mpunya dengan simbol ™. Salah satu Tujuannya Mungkin biar kata atau frase yang dibubuhi ™ seakan-akan merupakan Tanda Milik atau Tanda Mpunya yang diasosiasikan dengan Milik atau Mpunya Tukang Mblog tertentu yang menghasilkan kata/frase tersebut. Selain itu, ™ juga menjadi Tanda Menjual bagi beberapa merek tertentu. Bahkan simbol ™ menjadi Tanda Murahan yang sering digunakan untuk mengomentari Tukang Mbo’ong terhadap ucapannya yang digemari dinanti-nanti oleh Tukang Mblog indonesia, contohnya adalah Hi Roy™ .
17.18. Tahukah Mengapa ™ sering digunakan dalam Blog? Ah… tanyakan saja ke Tukang Mblog yang Tsuka Menggunakannya. Tapi Mungkin digunakan hanya untuk Tunjuk Muka Tanpa Makna bukan?
18.19. Toh Mungkin masih banyak yang belum Tahu Makna apa itu ™, selain hanya tahu sebatas memiliki arti Trademark.
19.20. Sebenarnya ada tiga istilah yang sering digunakan yang berhubungan dengan hak cipta, yaitu Paten, Copyright dan Trademark. Menurut wiki, Trademark (atau dalam Bahasa Indonesianya merek dagang) memiliki pengertian :
20.21. Merek atau merek dagang adalah tanda pembeda yang digunakan suatu badan usaha sebagai penanda identitasnya dan produk barang atau jasa yang dihasilkannya kepada konsumen, dan untuk membedakan usaha tersebut maupun barang atau jasa yang dihasilkannya dari badan usaha lain. Merek merupakan kekayaan industri, yaitu termasuk kekayaan intelektual.
21.22. Sedangkan menurut Undang-Undang Nomor 15 Tahun 2001 tentang Merek :
22.23. Merek Dagang adalah Merek yang digunakan pada barang yang diperdagangkan oleh seseorang atau beberapa orang secara bersama-sama atau badan hukum untuk membedakan dengan barang-barang sejenis lainnya.
23.24. Trademark biasanya menggunakan simbol ™ dan sering digunakan untuk mengklaim suatu produk atau jasa tertentu sebagai merek dagang. Lalu Copyright menggunakan simbol ® ©. Sedangkan ® itu untuk Registered Trademark (makasih om Jay atas koreksinya ) dan biasanya digunakan untuk mengklaim nama dari perusahaan penghasil produk itu, seperti Microsoft®.
24.25. Jadi Tukang Mblog dapat menggunakan simbol ™ untuk kata atau frasa yang dihasilkan. Dan juga menggunakan ® sebagai nama blog seperti Chaidi®. Tapi jangan sembarangan menggunakan simbol ® untuk Judul Blog, Takut Mengundang masalah nantinya soalnya kan harus registrasi dulu .
25.26. Beberapa contoh penggunaan Tanda Mini ™ di beberapa Taman Mblog :
26.27. SETANTRON™
27.28. Seleb Blog™
28.29. Jablai Blog™
29.30. Hi Roy™
30.31. Dan contoh2 lainnya yang sering ditemukan dalam Taman Mblog orang lain
31.32.
Registered. Artinya suatu merk atau nama sudah terdaftar di departemen kehakiman. Dan sudah ada patent terhadap brand/nama tersebut. Jika ada produk serupa atau memiliki kesamaan nama tanpa seijin pemilik patent tadi, dapat dikategorikan pembajakan karya cipta dan bisa dipidanakan/diproses secara hukum.
Menurut aq, copyright itu suatu produk yang sudah dilindungi hak ciptanya oleh undang-undang. Artinya, jika produk tersebut dibuat ulang atau ditiru oleh pihak lain, pemegang copyright tersebut dapat menuntut dengan bukti-bukti yang berlaku.

Link Exchange

Ini yang text

<a href="http://dediapandu.co.cc/" target="_blank">Dedia Pandu Blog</a><br /><br />

Ini yang Banner
<a href="http://dediapandu.co.cc/" target="_blank" title="Kumpulan Tips dan Trik Blog."><img src="http://i1098.photobucket.com/albums/g377/dediapandu/cooltext720087565.gif" border="0" alt="Kumpulan Tips dan Trik Blog."></a>

Jangan Lupa di copy ya !!!
Kalau udah dicopy , terus koment di bawah sini nanti ane pasang link sobat di blog ane,,,, Salam Blogging

Kelebihan dan kekurangan Linux

Kelebihan Linux:

• Linux merupakan sistem operasi bebas dan terbuka (open source). Sehingga tidak perlu biaya lisensi untuk membeli atau menggunakan Linux, gratis.


• Linux mudah digunakan. Dulu, Linux dikatakan merupakan sistem operasi yang sulit dan hanya dikhususkan untuk para hacker karena masih berbasis teks (DOS). Namun, kini Linux mudah digunakan hampir semudah menggunakan Windows, bahkan masalah style pun, Linux lebih baik dari Windows 7.


•  


• Hampir semua aplikasi yang terdapat di Windows, telah terdapat alternatifnya di Linux karena banyak komunitas-komunitas pengembangnya, semisal sourceforge.net. , atau bila terpaksa kita bisa menjalankan software untuk Windows di Linux dengan bantuan emulator seperti Wine sehingga file .exe dan .msi dapat dijalankan.


• Keamanan. Hampir semua pengguna Windows pasti pernah terkena virus, spyware, trojan, adware, dsb. Hal ini, hampir tidak terjadi pada Linux. Linux sejak awal didesain multi-user, sehingga bila virus menjangkiti user tertentu, akan sangat sangat sulit menjangkiti dan menyebar ke user yang lain. Beberapa orang berpendapat bahwa Linux lebih aman karena jumlah penggunanya lebih sedikit dibanding Windows, namun anggapan itu tidaklah tepat.


• Linux relatif stabil. Komputer yang dijalankan di atas sistem operasi UNIX sangat dikenal stabil berjalan tanpa henti. Linux, yang merupakan varian dari UNIX, juga mewarisi kestabilan ini. Jarang ditemui, komputer yang tiba-tiba hang dan harus menekan tombol Ctrl-Alt-Del atau Restart untuk mengakhiri kejadian tersebut.


• Linux mempunyai kompatibilitas ke belakang yang lebih baik (better backward-compatibilty). Perangkat keras yang telah berusia lama, masih sangat berguna dan dapat dijalankan dengan baik di atas Linux. Selain itu, tidak pernah ditemui dokumen-dokumen yang lebih baru tidak dapat dibaca pada Linux versi yang lebih lama. Pada Windows, kita seakan dituntut untuk terus mengikuti perkembangan perangkat keras, seperti kasus file .docx (Word 2007-2010) yang tidak bisa dibuka dengan Microsoft Word 2003 atau versi dibawahnya.


• Dukungan komunitas yang beragam dan menyebar di seluruh dunia.


• Linux selain gratis untuk digunakan, gratis pula untuk dimodifikasi dan didistribusikan ulang. Bahkan kita dapat mengembangkan distro kita sendiri.


• Beragam pilihan. Hal ini bisa menjadi kelebihan maupun kekurangan. Banyak distro bermunculan, contoh yang populer seperti Ubuntu, Debian, RedHat, openSuSe, Fedora, Mandriva (Mandrake), dsb. Keanekaragaman ini memberi kita banyak pilihan sesuai dengan kebutuhan masing-masing, namun di satu sisi hal ini juga akan membingungkan calon pengguna Linux. Lihat chart distribusi Linux di http://distrowatch.com untuk mengetahui rangking distro-distro Linux.


• Linux membutuhkan resource yang lebih kecil dari Windows, sehingga cocok untuk komputer dengan spesifikasi minimal. Selain itu hampir semua distro populer menyediakan versi 32 bit maupun 64 bit.


• Linux dapat berjalan dalam dua mode, modus teks dan modus GUI namun pada umumnya modus teks (terminal) ini lah yang menjadi kekuatan Linux. Modus GUI sendiri memiliki banyak pilhan desktop environment-nya seperti KDE, Gnome, BlackBox, XFCE.

 

Kekurangan Linux:

• Banyak pengguna yang belum terbiasa dengan Linux dan masih ‘Windows minded’, takut untuk beralih dari Windows.


• Dukungan perangkat keras dari vendor-vendor tertentu yang tidak terlalu baik pada Linux. Untuk mencari daftar perangkat keras yang didukung pada Linux, kita dapat melihatnya di Linux-Drivers.org atau LinuxHardware.org.


• Proses instalasi software / aplikasi yang tidak semudah di Windows. Instalasi software di Linux, akan menjadi lebih mudah bila terkoneksi ke internet atau bila mempunyai CD / DVD repository-nya. Bila tidak, maka kita harus men-download satu per satu package yang dibutuhkan beserta dependencies-nya.


• Bagi administrator sistem yang belum terbiasa dengan Unix-like (seperti Linux), maka mau tidak mau harus mempelajari hal ini. Sehingga syarat untuk menjadi administrator adalah manusia yang suka belajar hal-hal baru dan terus-menerus belajar.


• Aplikasi-aplikasi di Linux belum seampuh aplikasi di Windows.


• Struktur direktori dan hak-akses yang membingungkan bagi yang sudah terbiasa dengan Windows dan belum mengenal UNIX/Linux sama sekali.

Jadi intinya adalah, sudah siapkah Anda beralih ke Linux?

Kita belajar Linux tidak untuk mempersulit diri sendiri, tetapi kita sedang melakukan perbaikan  dalam mempelajari logika-logika dalam dunia komputer pada umumnya. Dengan mengenal Linux kita jadi tahu bahwa suatu program bisa berjalan karena ada kernel, kita juga bisa tahu apa yang membuat sistem operasi berjalan, kita tahu analogi-analogi pemrograman dan juga konsep-konsep dasarnya. Karena "Linux diciptakan hacker untuk hacker".(Linus Torvalds - Bapak Linux).

komponen perakit komputer

Untuk merakit sebuah komputer diperlukan komponenkomponen
sebagai berikut :
1. Mainboard
2. Processor
3. RAM (SD RAM/DD RAM)
4. Disk Drive/Floppy disk
5. Hard disk
6. Casing yang memiliki power supply tinggi 240 watt atau
lebih
7. CD ROOM/DVD ROOM read or write
8. Speaker
9. Keyboard
10. Mouse
11. Monitor
12. VGA
13. Soundcard

membuat tittle blog berjalan

Kalau kalian bosan dengan title blog yang standar, kalian bisa mengganti atau mengubahnya jadi berjalan seperti ini.
---Soft4ever || Computer, Opinion, Blog, Mobile, IT and Other--
Kalau di blog, itu menggunakan tag Marquee. Untuk membuat title berjalan ini aku menggunakan java script.  Caranya cukup mudah kok. Tinggal Copy & Paste ajah.

1. Pergi ke www.blogger.com, login seperti biasa
2. Buka layout –> Edit HTML
3. Kemudian beri tanda check pada Expand Widget Templates.
4. Copy JavaScript berikut :

   <script type='text/javascript'>
   //<![CDATA[
   
   msg = "JUDUL BLOG (kebanyakan orang ce gitu)";
   msg = "PESAN/text yang ingin ditampilkan" + msg;pos = 0;
   function scrollMSG() {
   document.title = msg.substring(pos, msg.length) + msg.substring(0, pos); pos++;
   if (pos > msg.length) pos = 0
   window.setTimeout("scrollMSG()",130);
   }
   scrollMSG();
   //]]>
   </script>

   
   

   
   
5. Letakkan JavaScript Tadi dibawah </head> atau di atas </body>
6. Setelah itu Simpan Template
7. Selesai dah..

nb : Untuk angka yang berwarna biru bisa di ubah juga, itu adalah kecepatan berjalannya title tersebut, semakin kecil semakin cepat.

cara pasang permainan di blog

1. Click link ini --> Myspace Game Codes
   
   (Sebenarnya selain situs ini masih banyak situs lain yang memberikan kode gratisan, tapi saya gunakan contoh yang ini karena gamesnya juga bagus-bagus kok).
   
2. Setelah masuk ke situs tersebut >> Pilih dan click judul games yang bro suka.
   
   
3. Jika halaman games udah terbuka, drag ke halaman paling bawah dan copy kode yang bro dapatkan di "MySpace Game Code for nama_gamesnya".
   
   
4. Kemudian log in ke blog bro.
   
5. Bila ingin membuat di postingan, maka paste kode yang bro dapatkan di step 3 ke "compose" atau tempat penulisan artikel blog. Namun, jika ingin pasang di sidebar, masuklah ke layout >> page element >> add a gadget >> html/javascript. Kemudian paste kode dan jangan lupa di save atau publish post untuk postingan.

Tips

Bila ukuran games terlalu besar, maka bisa diganti ukurannya dengan edit kode height="287" width="450" di step ke-3. Oia, height dan width yang harus diubah ada 2, soalnya ada 2 kolom yang menampung games (Bagian luar dan bagian dalamnya).

tugas biologi

WORKSHEET OF BIOLOGY AS STUDY



PRACTICE PROBLEMS AS THE ESSENCE OF BIOLOGICALSCIENCE Understanding the nature of biology as a science

A. UNDERSTANDING BIOLOGY Biology viewed from the origin of the word are the bios and logos
bios means …………….
Logos means……………..
Biological means………………

B. STRUCTURAL BIOLOGY scientific The figure of biological science built by three aspects, namely the level of organizational:  aspects of life, aspects of biological objects and aspects of various issues that were examined.

1. 1.     
   Biological objects
   Based on the biological meaning, so the object of biology are  ... ... ... ...
   Biological objects can be categorized into several groups, namely:
   •…..
   •….
   •….
   •…..
   •…..

2. 
Level of organization of life
Studying the life can be observed at different levels of most small or narrow, big or broad. Try you specify the level of the organization and example of life!

• Molecule , eg protein
•……
•……
•…….
•…….
• Biomes, Example: Tundra



3. 
Biological diversity issues

There are many kinds of problems are studied in biology, namely:
•
•
•
•
•
•
•
•
•


C. BRANCHES OF BIOLOGY


Biology is growing rapidly so that now there are of biology branches. The branches of biology was developed on the basis of three aspects. For example, medical science. Seen from its object, explain about  ... ... ... ... ... ... ... ... ... ... ... ... ... ..,
Seen from the level of organizational life, explain about ... ... ... ... ... ...while the problem is,,,,,,
Likewise with the other branches of biology can be seen from the three aspects in above

Try you explain this  following disciplines:

1. Molecular Biology
Study object: the virus
Level of organization of life: molecules
The problems of biology: structure and function

2. Genetics
Study object:
Level of organization of life:
The problems of biology:

3. Histology
Study object:
Level of organization of life:
The problems of biology:

4. Anatomy
Study object:
Level of organization of life:
The problems of biology:

5. Physiology
Study object:
Level of organization of life:
The problems of biology:

6. Microbiology
Study object:
Level of organization of life:
The problems of biology:

7. Botany
Study object:
Level of organization of life:
The problems of biology:

8. Ecology
Study object:
Level of organization of life:
The problems of biology:

9. Taxonomy
Study object:
Level of organization of life:
The problems of biology:

10. Zoology
Study object:
Level of organization of life:
The problems of biology:

11. Embryology
Study object:
Level of organization of life:
The problems of biology:

12. Entomology
Study object:
Level of organization of life:
The problems of biology:

13. Ornithology
Study object:
Level of organization of life:
The problems of biology:

14. Mycological
Study object:
Level of organization of life:
The problems of biology:

15. Akuakulture
Study object:
Level of organization of life:
The problems of biology:

16. Evolution
Study object:
Level of organization of life:
The problems of biology:

17. Cytology
Study object:
Level of organization of life:
The problems of biology:

D. BENEFITS OF BIOLOGY
Biology has been widely applied in everyday life. Rapidly evolving science of biology has provided various benefits or contributions in the advancement of human welfare. Try you examine various biological benefits in the following areas:

1. Biology in health benefits
•
•
•
•

2. Benefits of biology in the field of industry
•
•
•
•

3. Benefits of biology in agriculture
•
•
•
•

4. Benefits of biology in the field of animal husbandry
•
•
•
•

5. Biological benefits in the economic
•
•
•
•

Membuat Menu Navigasi dengan jQuery (Kwicks jQuery Sliding Navigation Menu for Blogger)

Kwick Menu Navigasi Blogger dengan jQuery

Untuk kesekian kalinya di blog bertema tutorial blog dan seo blogger blogspot ini mengunduh tutorial jQuery dalam membuat menu navigasi di blogger.

Jika sebelumnya telah dipublikasikan bagaimana menerapkan jQuery di blogspot dalam beberapa trik membuat slide show widget,sliding panel dan slick tab view menggunakan jQuery,kini ada trik satu lagi yang tak kalah menarik.
Betul gan! Yuk kita intip bagaimana sih membuat menu navigasi untuk flatform blogger/blogspot dengan jQuery ini.

Membuat Menu Navigasi Blogger dengan Kwicks jQuery

Sobat pernah lihat di beberapa blog atau situs dimana pada menu navigasi-nya dapat menyembunyikan icon atau gambar secara geser / slide saat mouse berada diatasnya?
Demo atau contoh dari menu navigasi kwicks jQuery ini sobat dapat lihat di:

http://www.jeremymartin.name/examples/kwicks.php?example=1

atau yang telah berhasil saya buat di :

http://pujiantoro.blogspot.com/

Memang betul,bahwa kelemahan dari kwicks menu navigasi ini tidak dapat dibaca oleh beberapa browser khususnya handphone atau browser yang tidak mengaktifkan javascript.Namun kwicks menu navigasi jQuery ini dapat bekerja sangat baik di browser mozilla juga Google chrome dan IE terbaru.

Penasaran,yuk mari kita pelajari bagaimana membuat menu navigasi blogger dengan jQuery kwicks tricks.
Pertama langkahnya seperti biasanya ya hanya pilih Dashboard (gb.1),lalu Tata Letak (gb.2) kemudian contreng tulisan Expands Widget Templates (gb.3).

(1)


(2)


(3)

Nah,selanjutnya cari kode ]]></b:skin> (gunakan Ctrl+F di keyboard sob),setelah ketemu tinggal letakkan kode CSS berikut tepat diatas kode ]]></b:skin> tersebut.


.kwicks{height:50px;list-style:none;margin:0;padding:0;position:relative;width:840px;z-index:2
}
.kwicks li{cursor:pointer;display:block;float:left;height:50px;overflow:hidden;padding:0;width:120px;z-index:2}
.kwicks li a{background-image:url(http://4.bp.blogspot.com/-e1c5hdvd0MQ/TbgSHi-7EEI/AAAAAAAAAzs/Y9aTBHEgh84/s1600/menu%2Bjquery%2Bpelajaran%2Bblog.jpg
);background-repeat:no-repeat;cursor:pointer;display:block;height:50px;outline:none;text-indent:-9999px;z-index:2}
#kwick1 a:hover{background-position:0 -50px!important}
#kwick2 a{background-position:-190px 0}
#kwick2 a:hover{background-position:-190px -50px!important}
#kwick3 a{background-position:-380px 0}
#kwick3 a:hover{background-position:-380px -50px!important}
#kwick4 a{background-position:-570px 0}
#kwick4 a:hover{background-position:-570px -50px!important}
#kwick5 a{background-position:-760px 0}
#kwick5 a:hover{background-position:-760px -50px!important}
#kwick6 a{background-position:-950px 0}
#kwick6 a:hover{background-position:-950px -50px!important}
.kwicks li ul a{float:left;width:12em}
.kwicks ul ul{top:auto}
.kwicks li ul ul{left:12em;margin:0 0 0 10px}
.kwicks li:hover ul,#nav li li:hover ul,#nav li li li:hover ul,#nav li li li li:hover ul{display:block
}

Keamudian cari kode <head>,setelah ketemu letakkan kode jQuery berikut tepat diatasnya:

<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery-1.2.3.js' type='text/javascript'/>
<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery.kwicks-1.5.1.js' type='text/javascript'/>
<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery.easing.1.3.js' type='text/javascript'/>

Lalu simpan templates sobat.
Nah,untuk menampilkannya pada widget coba pilih Tata Letak / Rancangan seperti gambar no (1),dan klik tulisan Add New Widget atau Tambah Gadget,lihat Gambar no (4)



(4)


(5)

Selanjutnya pilih HTML/Javascript lihat Gb(5)kemudian letakkan kode berikut:


<div class='kwickswrap'>
<ul class='kwicks'>
<li id='kwick1'><a href='http://pelajaran-blog.blogspot.com/' title='halaman utama'>Home</a></li>
<li id='kwick2'><a href='http://pelajaran-blog.blogspot.com/search' title='daftar isi.'>Blog</a></li>
<li id='kwick3'><a href='http://pelajaran-blog.blogspot.com/2009/02/profil.html' title='about'>About</a></li>
<li id='kwick4'><a href='#' title='futures'>Portfolio</a></li>
<li id='kwick5'><a href='#' title='contact us'>Contact</a></li>
<li id='kwick6'><a href='http://pelajaran-blog.blogspot.com/' title='recomended links'>Resource</a></li>
</ul>
</div>
</td>
<script type="text/javascript">
$().ready(function() {
$('.kwicks').kwicks({
max : 190,
duration: 800,
easing: 'easeOutQuint'
});
});
</script>

Simpan,selesai sudah dan sobat sudah bisa lihat hasil dari menu navigasi kwick jquery ini.
Jikaa mengalami kesulitan mohon diskusikan adi facebook pagenya ya gan and selamat mencoba!


Klik tombol 'Buat Popular Post' di bawah ini jika anda merasa konten/postingan yang sedang anda baca sangat menarik dan bermanfaat bagi anda.

Mengganti Domain ke co.cc

Sebelumnya saya pernah menulis Menggunakan Domain CO.CC untuk Alamat Blog di Blogger, dan ini saya merupakan kelanjutan dari tulisan tersebut. Dalam tulisan sebelumnya tersebut, penggunaan pengalamatan blog di Blogger dengan custom domain .co.cc hanya meng-cover penggunaan subdomain dari nama domain yang didapatkan dari CO.CC, belum bisa langsung menggunakan nama domain yang didapatkan. Misalnya saya mendapatkan domain namague.co.cc, dengan mengacu tulisan sebelumnya, saya sudah bisa menggunakan alamat siapa.namague.co.cc atau www.namague.co.cc sebagai alamat blog, tapi belum dijelaskan bagaimana jika saya menginginkan http://namague.co.cc sebagai alamat blog.
Berikut cara yang sudah saya coba agar dapat menggunakan http://namague.co.cc sebagai alamat blog di Blogger.



Langkah-langkahnya hampir sama seperti pada tulisan sebelumnya, perbedaannya ketika melakukan setup domain CO.CC, saya tidak bisa menambahkan CNAME record langsung untuk namague.co.cc, dan sebagai gantinya, saya menambahkan A record. Karena nilai A record harus berupa IP address, saya mengambil IP address dari untuk server ghs.google.com dengan cara ping dan mendapatkan 64.233.179.121. Jadi untuk Host saya masukkan namague.co.cc, TTL: 1D, Type: A, dan Value: 64.233.179.121. Kemudian klik tombol Set up.
Jika selain dapat diakses melalui http://namague.co.cc  juga dapat melalui http://www.namague.co.cc, maka untuk keperluan ini tetap menambahkan CNAME record untuk www.namague.co.cc, seperti nampak pada gambar di samping. Karena sebelumnya saya sudah menambahkan A record untuk namague.co.cc ke IP address ghs.google.com, bisa saja untuk Value diisi namague.co.cc.
Langkah berikutnya adalah melakukan pengaturan di Panel Kontrol Blogger, sama seperti sudah digambarkan pada tulisan sebelumnya, hanya pada saat pemasukkan custom domain yang saya masukkan adalah namague.co.cc seperti ini.

Setelah klik tombol Simpan Pengaturan, maka berikutnya sudah ada pilihan Mengarahkan www.namague.co.cc ke namague.co.cc. Beri centang pada pilihan tersebut, dan Simpan Pengaturan kembali.

Itu bertujuan agar ketika pengunjung mengakses alamat blog saya dengan menggunakan www, akan tetap diteruskan ke alamat yang dipilih yaitu yang tanpa www. Tetapi di sini saya dapat saja mempertukarkan mana yang akan diteruskan mana yang akan digunakan sebagai pengalamatan (URL).
Hal yang perlu diperhatikan adalah petunjuk yang diberikan Google adalah penggunaan CNAME record ke ghs.google.com. Dan jika suatu saat, misalnya 2 tahun kemudian Google mengubah IP address untuk ghs.google.com, maka penambahan A record seperti dituliskan di atas bisa saja menjadi tidak valid.

Membuat search engine sendiri

Ada cara praktis untuk menemukan artikel pada blog secara singkat.Bagi yang sudah tergabung dalam Google Adsense,pasti sudah tahu ya masalah ini.

Tapi bagi anda yang belum tergabung,tapi ingin menampilkan form pencari untuk blog anda sendiri,ada kode praktis yang ga ada salahnya anda coba.

Hasilnya nanti akan seperti di bawah ini :

---

---

Sedangkan kodenya,copy paste kode di bawah ini :

---

<form id="searchform"
action="http://pelajaran-blog.blogspot.com/search"
name="searchform" method="get">
<input id="s" value="" name="q"
type="text"> <input id="searchsubmit"
value="Search"type="submit"> </form>

---

Kode yang berwarna hijau;http://pelajaran-blog.blogspot.com/search,gantilah dengan halaman blog anda sendiri,tapi jangan lupa tambahin kode /search ya..

Sedangkan Value "Search"anda bisa ganti menjadi "Go" atau "Cari" atau yang lain.


Klik tombol 'Buat Popular Post' di bawah ini jika anda merasa konten/postingan yang sedang anda baca sangat menarik dan bermanfaat bagi anda.

Cara Mengganti Favicon Dengan Super Cepat.

Favicon dalam sebuah blog atau website kadang memang sangat digunakan. Mungkin untuk menjadikan simbol bagi web atau blog tersebut. Atau sebagai penghias saja.

Bagi untuk website blog berbasis bisnis atau untuk mewakili namanya Favicon mungkin menjadikan hal yang paling penting dan memang harus dipasang.


Cara membuat Favicon pada umunya memang sangatlah mudah. Siapapun bisa. Caranya seperti ini.
Buka blogger anda di tab Rancangan.

• Cari kode seperti <title><data:blog.pageTitle/></title>. Kalau ingin cepat menemukannya silakan klik CTRL+F. 
• Tambahkan kode ini <link rel="shortcut icon" href="URL of your icon file"/>dibawahnya.
• URL of your icon file = Adalah url image favicon anda.

Begini  cara yang paling cepat untuk mengganti facvicon anda.

• Cari mini icon dimana saja yang sudah ter upload ke hosting.
• Anda bisa mencarinya di http://www.iconarchive.com. Mini icon mini icon tersebut sudah terupload ke hosting.
• Cari mini icon tersebut yang ingin anda jadikan favicon. Cari yang ukurannya 48 x 48.
• Bila sudah klop dengan keinginan hati anda, silakan klik image tersebut. Dan catat urlnya.

Terus pasang url mini iconnya di kode Favicon tersebut. 

Contoh :<link rel="shortcut icon" href="http://www.iconarchive.com/icons/archigraphs/apples/48/iMac-icon.png"/>

Nah hasil faviconnya akan menjadi blog yang sedang anda kunjungi ini. 

Eit.... Tapi itu ada masalahnya. Bila sang empunya mini icon tersebut menghapusnya dari hosting, maka secara otomatis favicon anda juga akan ikut hilang. Semoga saja tidak dihapus.


Tentu saja untuk menjaga-jaga, anda mungkin meng upload mini iconnya di hosting image di berbagai tempat. Biasanya teman-teman blogger meng upload image di http://photobucket.com/.

 Daftar dan upload mini iconnya di sana. Setelah ter upload catat urlnya dan taruh di kode favicon tersebut. Mungkin anda tidak puas dengan mini icon yang disediakan oleh http://www.iconarchive.com. ? Anda bisa medapatkannya di bawah ini. Tentu saja anda harus meng upload image image tersbut ke hosting. Monggo Silakan di cicipi.

Menghilangkan Navbar

Navbar adalah fasilitas yang dimiliki oleh Blogger/blogspot, bentuknya berupa kotak kecil memanjang kesamping yang letaknya berada di bagian paling atas dari blog yang fungsinya antara lain untuk mulai melakukan Sign In/out atau bisa juga membuat Blog baru. Navigation Bar juga bisa digunakan untuk melaporkan kecurangan atau tindak kejahatan weblog yang dilakukan oleh seorang blogger, misalnya kontent blognya yang melanggar TOS atau hal-hal yang dianggap merugikan orang lain.




Namun ada beberapa blogger yang merasa akan lebih enak jika melihat tampilan blognya dalam keadaan bersih tanpa harus ada bagian mencolok di bagian atas blognya sendiri (NavBar). Karena itu, kadang para blogger menghapus NavBar tersebut. Pertanyaannya adalah: Apa tidak melanggar Term of Service (TOS) dari Blogger.com?
Sejauh ini, banyak blogger yang telah menghilangkan Navbar mereka dan tidak juga mendapat teguran dari blogger. Artinya, bisa dilakukan. Toh di TOS Blogger sendiri juga tidak ada aturan yang cukup detail tentang hal ini.

Nah, bagaimana menghilangkan Navigation Bar?
Ada beberapa penyedia template yang memang sudah tidak ada NavBar-nya. Namun bagi kamu yang memakai template yang masih ada NavBarnya dan ingin menghilangkannya maka inilah caranya.

1. Kamu harus Login dulu di Blogger.com / Blogspot.com
2. Trus Pilih Layout --> Edit HTML
3. Copy script berikut ke dalam tag head

#navbar-iframe {
display: none !important;
}


contohnya sebagai berikut :
-----------------------------------------------
Blogger Template Style
Name: Son of Moto (Mean Green Blogging Machine variation)
Designer: Jeffrey Zeldman
URL: www.zeldman.com
Date: 23 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */

#navbar-iframe {
display: none !important;
}

/* Variable definitions
====================

4. Kemudian simpan.

Selamat Mencoba.....!!

Pasang Widget Share Facebook dan Twitter

Pernah lihat tombol-tombol share seperti di samping kanan ini? Ya pernah dong, kan itu ada di kanan :P


Maksudnya, mungkin anda pernah/sering lihat ada tombol/widget share Facebook dan Twitter di bagian atas sebuah artikel blog di mana pada kedua widget itu terlihat angka yang menunjukkan banyaknya link dari sebuah artikel/posting yang dishare oleh pengunjung blog.

Bila tertarik, anda juga bisa memasangnya dengan memasukkan kode tertentu pada template blog, sehingga pada setiap artikel secara otomatis akan terlihat berapa banyak link yang dishare pada kedua layanan online social networking tersebut (Twitter dan Facebook).



Berikut ini adalah tutorial cara pemasangannya di blog, khususnya Blogger/Blogspot.

Pilihan Kode Widget Share Twitter dan Facebook

Silahkan lihat-lihat dulu pilihan widget share yang disediakan oleh TweetMeme (untuk widget Twitter) dan widget share Facebook. Nanti kodenya akan ditempatkan pada template blog :

Kode Widget Share Twitter (TweetMeme)
KODE-TWEETMEME-1 (kotak)


KODE-TWEETMEME-2 (memanjang)


Kode Widget Share Facebook
KODE-FACEBOOK-1 (kotak)
Share
KODE-FACEBOOK-2 (memanjang)
Share

Cara Memasang Kode Widget Share Pada Template Blogger :

* Login ke akun Blooger.
* Klik “Layout”, lalu klik tab “Edit HTML”.
* Klik “Expand Widget Templates”.
* Cari kode ini:

atau
* Di atas kode tersebut, masukkan kode ini :
*
KODE-TWEETMEME




KODE-FACEBOOK
* Ganti tulisan KODE-TWEETMEME dan KODE-FACEBOOK dengan kode widget TweetMeme dan Facebook pilihan anda (lihat Pilihan Kode Widget).
* Klik tombol “PREVIEW” untuk mereview perubahan tampilan template.
* Bila tampilannya sudah benar, silahkan klik “SAVE TEMPLATE”.


Catatan

Untuk memasang widget tersebut (TweetMeme dan Facebook), kita tidak perlu menggunakan akun Twitter atau Facebook. Bahkan kita tidak harus punya akun di Twitter atau Facebook, karena tombol itu secara otomatis akan membaca URL artikel kita dan menunjukkan angka link sharenya yang tidak tergantung pada akun kita, jadi sebenarnya bisa dipasang di blog/situs mana saja.

Kode di atas adalah untuk pemasangan pada bagian atas artikel sebelah kanan. Kalau mau ditaruh di kiri, ganti kode style pada tag div menjadi :


Kalau ingin memasang widget secara memanjang (menyamping), hilangkan tag

. Atau coba experimen sendiri aja ya :P , kan nanti bisa direview dulu sebelum disave
Kirimkan Ini lewat Email
BlogThis!
Berbagi ke Twitter
Berbagi ke Facebook
Berbagi ke Google Buzz

Cara pasang Related Post

Disini Saya mencoba untuk berbagi info sama sobat Blogger untuk mempostingkan kembali Tutorial/Cara pasang Artikel Terkait ( Related Posts ) yang saya ambil dari template, Artikel Terkait ( Related Posts ) ini adalah hasil modifikasi dari JackBook dan Sedikit Tambahan, mungkin buat para sobat Blogger yang kebetulan belum memakai Tutorial ini barangkali bermanfaat buat Anda, baiklah saya tidak akan panjang lebar bicara masalah Tutorial ini, sebab saya sendiri juga masih pemula dan tidak sehebat Seperti Anda.


# Sigin ( masuk ) di blogger dengan id Anda

# Klik menu layout ( Tata Letak )

# Klik menu yang bertuliskan Edit HTML

# Klik yang Bertuliskan Download Template Lengkap, Silahkan Disave dulu template sobat, Hal ini untuk mencegah resiko terjadinya kesalahan dalam melakukan editing template.

# Klik kotak kecil berada di samping tulisan Expand Template Widget, Dan jangan lupa untuk memberi tanda centang dahulu, sebab kalau tidak di beri tanda centang maksudnya akan lain.

# Dan tunggu beberapa saat sampai proses selesai.

# Di Template Blog milik Anda coba cari kode seperti di bawah ini :

<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'/>

<div class='post-footer-line post-footer-line-2'/>

<div class='post-footer-line post-footer-line-3'/>
</div>
</div>

# Setelah itu copy kode yang berwarna merah berikut di bawah ini, lalu paste persis di bawah kode yang di atas tadi :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='similar'>
<!-- *****************http://hoctro.blogspot.com*****Jan,2007****************** -->
<!-- *****************Related Articles by Labels - Take Two****************** -->
<div class='widget-content related-by-cat'>
<h3>Related Posts / Artikel Terkait :</h3>
<div id='data2007'/><br/><br/>
<div id='hoctro' style='display:none;'>
Widget by <u><a href='http://hoctro.blogspot.com'>Hoctro</a></u> | <u><a href='http://www.jackbook.com/' title='Related Posts on Blogger Modified by JackBook.Com. Read More?'>Jack Book</a></u>
</div>
<script type='text/javascript'>

var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 50;
var maxNumberOfLabels = 40;

maxNumberOfPostsPerLabel = 40;
maxNumberOfLabels = 40;


function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;

for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;

if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;data2007&#39;).appendChild(div1);
}
}
}
function search10(query, label) {

var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}

var labelArray = new Array();
var numLabel = 0;

<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;

var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>

</div>
</b:if>

# Dan Klik tombol SIMPAN TEMPLATE / SAVE TEMPLATE.

# Selamat Mencoba dan Berkarya.

page navigation

Page Navigation adalah sebuah Widget yang digunakan pada Web ataupun Blog untuk memperlihatkan postingan atau artikel pada Webblog tersebut per halaman,contohnya seperti gambar dibawah ini:


Untuk lebih memperjelas pengetahuan anda mengenai Page Navigation ini silahkan menuju halaman depan[Homepage] blog ini,dibagian bawah postingan terakhir terdapat angka1,2,3,…,dst.itulah yang disebut Page Navigation.



Untuk membuatnya sangat mudah

1.Login ke blogger dengan ID anda

2.Lalu Klik Menu Templates

3.Klik Add Widget Element

4. Pilih Menu HTML/Java Script

5.Lalu Download Kode berikut dan Pastekan pada kotak HTML tersebut


<style>
.showpageArea a {
text-decoration:underline;
}

.showpageNum a {
text-decoration:none;
border: 1px solid #bbb;
margin:0 3px;
padding:3px;
}

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

</style>



<script type="text/javascript">

function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';


var pageCount=5;
var displayPageNum=3;
var firstPageWord = 'Awal';
var endPageWord = 'Akhir';
var upPageWord ='Sebelumnya';
var downPageWord ='Selanjutnya';



var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage){
if(title!=''){
if(post.category){
for(var c=0, post_category; post_category = post.category[c]; c++) {
if(encodeURIComponent(post_category.term)==thisLable){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
}
}//end if(post.category){

itemCount++;
}

}else{
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
itemCount++;
}
}

for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}

fFlag++;
}

if(p==(thisNum-1)){
html += '&nbsp;<span class="showpagePoint"><u>'+thisNum+'</u></span>';
}else{
if(p==0){
if(isLablePage){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
}
}

if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){

if(thisNum>1){
if(!isLablePage){
html = '<span class="showpage"><a href="/">'+ firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}else{
html = ''+labelHtml + firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}
}

html = '<div class="showpageArea"><span style="padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;border: 1px solid #333; background-" class="showpage">Page '+thisNum+' of '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
html += '<span class="showpage"><a href="'+htmlMap[htmlMap.length-1]+'"> '+endPageWord+'</a></span>';
}

if(postNum==1) postNum++;
html += '</div>';

if(isPage || isFirstPage || isLablePage){
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}
}

}
</script>

<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>
<div style="text-align:right;font-size:10px;color:000000;margin-top:15px;display:none;"> <a href="http://blogkomputers.blogspot.com">Grab this Widget ~ Navigasi Halaman</a></div>

6.Save Widget tersebut

7.Scrool atau pindahkan Widget tersebut pada area dibawah posting[lihat gambar]



8.Save Template

9.Selesai

Hari ini cukup itu dulu tutorialnya udah capek jari ketik-ketik keyboard.

Mengganti Icon Mouse

Jika kita membuka suatu website atau blog maka seringkali kita menjumpai ada sebuah gambar atau icon pada address bar (kotak untuk mengetikkan alamat web). Dan jika kita punya blog di Blogspot maka icon default yang akan tampil adalah gambar seperti ini :

Bagi kalian yang tidak puas dengan icon/gambar tersebut, kamu bisa menggantinya dengan gambar sesuai dengan keinginanmu. caranya sangat mudah, yaitu dengan membuat gambar (gif, jpg, ico, dan lain2) dengan ukuran kira2 24x42 pixel sampai 32x32 pixel (sebenarnya ukurannya bebas sih, tapi biar filenya kecil dan proses membukanya cepat).



Setelah itu .....
masuk ke "Layout --> Edit HTML" trus tempatkan script berikut sebelum kode



ganti huruf yang dicetak tebal dengan lokasi gambar dimana kamu menyimpannya. Kamu bisa menyimpan gambarmu di 000webhost atau bisa juga di photobucket dan juga di imageshack atau kalo kamu tidak mau pusing dibawah ini ada beberapa contoh icon/gambar beserta dengan linknya.

http://img87.imageshack.us/img87/5862/image1an1.gif
http://img110.imageshack.us/img110/6218/image2ie0.gif
http://img98.imageshack.us/img98/9617/image3cr0.gif
http://img134.imageshack.us/img134/633/image4hx4.gif
http://img139.imageshack.us/img139/83/image5oa7.gif
http://img509.imageshack.us/img509/6449/image6fu0.gif
http://img527.imageshack.us/img527/6543/image7go9.gif
http://img507.imageshack.us/img507/5774/image8wn8.gif
http://img150.imageshack.us/img150/5784/image9qo1.gif
http://img404.imageshack.us/img404/1214/image10vr1.gif
http://img412.imageshack.us/img412/3808/image11pc0.gif
http://img100.imageshack.us/img100/4658/image12du2.gif
http://img132.imageshack.us/img132/4733/image13lj1.gif
http://img145.imageshack.us/img145/7793/image14zg9.gif
http://img412.imageshack.us/img412/4403/image15jc7.gif
http://img264.imageshack.us/img264/7575/image16kn8.gif

Cara Mengganti Jenis Huruf Judul Posting, Judul Sidebar, dan Isi Posting

Banyak sekali jenis - jenis font yang sering kita jumpai di blog / web orang lain, sering juga digunakan di komputer / laptop kita untuk mendesain banner atau apapun itu, huruf memiliki banyak jenis, seperti Arial, Courier, Tahoma, Times New Rowman, dan masih banyak lagi, jenis huruf diatas termasuk style standar blogger, kita dapat merubah dari pilihan jenis huruf diatas, caranya kita hanya perlu menyimak tutorial sederhana ini, cara ini juga dapat anda gunakan pada judul posting dan sidebar, atau bagian - bagian lain dari blog.

1. Anda bisa kunjungi situs Google Web Fonts.

2. Jika sudah masuk, anda bisa melihat sederet pilihan huruf disana, lihat gambar.

3.  Klik salah satu jenis huruf yang ingin anda gunakan, lalu akan muncul tampilan seperti 

berikut, adalah screenshot huruf.

4. Kemudian klik Use this font 

5. Letakkan kode <link href='http://fonts.googleapis.com/css?family=Wire+One' rel='stylesheet' type='text/css'> diatas kode </head>.

6. Jangan lupa untuk memberi tag penutup, perhatikan penulisan yang berwarna merah.<link href='http://fonts.googleapis.com/css?family=Wire+One' rel='stylesheet' type='text/css'/>.

7. Simpan Template.

Penggunaannya :

Untuk menerapkan jenis font yang telah anda praktekan sangatlah mudah, misal yang ingin anda ganti adalah judul posting maka cari kode .post atau #post.

lihat penulisan.

.post {

background:#f5f8fa url(http://eosmate.googlepages.com/blockquoteku2.png) no-repeat scroll 0 0;

border-width: 1px 1px 1px 20px;

color: #004276;

font-family: Consolas, "Courier New", Courier, mono, serif;

}

Anda hanya perlu melakukan penggantian nama jenis font di text yang berwarna merah. dan untuk hasilnya lihat contoh.

.post {

background:#f5f8fa url(http://eosmate.googlepages.com/blockquoteku2.png) no-repeat scroll 0 0;

border-width: 1px 1px 1px 20px;

color: #004276;

font-family: "Wire One", Arial, Serif;

}

Sangat mudah bukan?bagaimana pendapat anda?pasti akan lebih menarik pengunjung untuk membaca blog kita, namun pilihlah jenis font yang mudah untuk dibaca, tidak rumit / tidak jelas.

Terimakasih, sekian untuk tutorial kali ini.

Semoga bermanfaat.  

sumber:neo-exzha.blogspot.com