Live Stream

Kamis, 13 Agustus 2009

166. Google Docs : Solusi Bagi Yang Suka Sharing file Word, Excel, serta Power Point

Ada yang pernah bertanya seperti ini “bagaimana cara menampilkan file microsoft exel di blog?” duh bisa ngga ya? seharusnya bisa sih, tapi bagaimana caranya ya, saya juga bingung nih Tapi tenang saja, jika anda pernah melihat file exel bisa di tampilkan di web berarti tandanya itu bisa di lakukan.



Bagi anda yang suka dan ingin sharing file dalam bentuk microsoft word (document) dan microsoft excel (spreadsheet) ataupun microsoft power point (presentation) di blog, maka anda bisa menggunakan berbagai layanan di internet. Salah satu di antaranya adalah layanan yang di sediakan oleh google yaitu Google docs. Dengan google docs anda bisa membuat file microsoft office yang saya sebutkan tadi secara online ataupun anda bisa mengupload file yang sudah jadi alias sudah di kerjakan secara offline dan kemudian ambil kode yang di berikan lalu setelah itu anda bisa menampilkannya di blog anda.



Apa kelebihan dari google docs? dengan google docs anda tidak perlu mempunyai software microsoft office yang lisensi nya sangat mahal terinstall di komputer anda, yang anda perlukan adalah anda bisa online di internet. Sepertinya saya tidak perlu menerangkan bagaimana cara membuat file di google docs karena penggunaannya hampir sama dengan microsoft office. Yang mau saya terangkan adalah bagaimana cara mengupload file yang sudah jadi ke google docs dan kemudian menampilkannya di blog anda. Tertarik? yuk mang kita lanjut!



Salah satu syarat untuk bisa menggunakan google docs adalah anda harus mempunyai alamat email di gmail (google acount). Jika selama ini account blogger anda menggunakan gmail maka bisa secara langsung login ke google docs. Bagi anda yang baru pertama kali masuk ke google docs, maka anda harus setuju dengan peraturan yang di buat oleh google. Sudah punya account google? mari kita serbu google docs.



Lankah 1 : upload file ke google docs.

1. Silahkan login ke http://docs.google.com dengan account gmail anda.
2. Klik tab Upload yang berada di sebelah kiri atas layar monitor anda.
3. Klik tombol browse… di bawah tulisan Browse your computer to select a file to upload:
4. Masukan file yang ingin anda upload (word, excel, power point).
5. Klik tombol Upload File yang ada di sebelah bawahnya.
6. Tunggu beberapa saat sampai file anda terupload semuanya (tergantung dari besarnya file serta kecepatan koneksi anda).
7. Jika sudah terupload, anda bisa mengeditnya jika mau.
8. Klik tab publish yang ada di sebelah kanan atas layar monitor anda, maka akan keluar tulisan This document is not yet published.
9. klik tombol publish now yang ada di bawahnya.
10. Jika sudah selesai, lihat kembali ke bagian bawahnya!
11. Klik link bertuliskan More publishing options.
12. Setelah keluar window pop up, klik menu drop down di sebelah tulisan File format kemudian pilih HTML to embed a webpage.
13. Klik tombol Generate URL.
14. Copy kode HTMl yang di berikan, lalu paste pada notepad atau text editor lainnya.
15. Silahkan di close saja window nya.
16. Silahkan anda sign out dari google docs jika mau.
17. Selesai.



Langkah 2 : posting kode google docs ke blogger.



1. Silahkan login ke blogger dengan ID anda.
2. Klik Posting Baru.
3. Silahkan anda buat postingan yang anda inginkan.
4. Ketika anda mau menyisipkan kode yang dari google docs, klik terlebih dahulu tab Edit HTML ( jangan yang compose)
5. Paste kode google docs yang ada di notepad tadi pada tempat yang anda inginkan.
6. Klik Tombol MEMPUBLIKASIKAN POSTING.
7. Silahkan lihat hasilnya.
8. Selesai.



Berikut adalah contoh file excel sederhana yang saya buat untuk menerangkan tutorial ini :









Sekarang anda sudah tahu cara menampilkan file excel di blog kan? ada lagi tambahan nih dari kang rohman. Berikut adalah contoh kode HTMl yang di berikan oleh google docs :





Jika kita perhatikan kode tersebut adalah kode HTML untuk perintah iframe, masih ingatkan dengan perintah iframe yang pernah saya posting di “mengenal perintah iframe”? tentunya kode yang di berikan oleh google docs tidaklah mutlak harus seperti itu, tapi kita bisa memodifikasinya sesuai dengan keinginan kita. Sebagaimana kita lihat bahwa ukuran lebar (width) sebesar 500 pixel, nilai ini bisa anda ganti dan disesuaikan dengan lebar dari halaman post anda, begitupun dengan tingginya (height) ini pun bisa anda ganti dengan nilai yang anda inginkan. Ada satu lagi yang penting adalah dalam kode tersebut tidak di sertakan kode scrolling, sehingga apabila file anda sangat lebar tidak akan terlihat oleh pembaca, maka solusi yang saya berikan adalah menambahkan kode scrolling=”yes’ ataupun scrolling=”auto” pada kode iframe di atas. contoh kode yang memakai scrolling :







Ataupun seperti ini :







Dengan anda menambahan kode seperti itu, maka walaupun file anda mempunyai lebar serta tinggi yang melebihi halaman posting anda, pembaca dapat menggesernya dengsn leluasa memakai scrolling.



Selamat mencoba!

147. Pasang Iklan Google Adsense di Bawah Posting

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 :



src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript">



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 :


expand widget template


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) :








Selengkapnya...





9. Tambahkan kode iklan google adsense milik anda seperti ini (kode Ga nya harus yang sudah di parse) :









<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>




Selengkapnya...





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!

Pasang Game di Blog

Kemarin ada yang rikues minta di buatkan tutorial cara Pasang Game di blog, dan sepertinya tutorial yang akan di tulis tidak terlalu sulit, maka langsung saya buatkan saja.

Sebagai catatan kecil saja, memasang game di blog memang menyenangkan bagi sebagian orang, namun hal ini akan mengakibatkan loading blog anda akan sedikit berat. Jadi silahkan dipikir dulu baik dan buruknya.


Untuk memasang Widget game, anda bisa mendapatkannya secara gratis di internet, silahkan lakukan googling saja. Sebagai contoh, salah satu penyedia layanan ini adalah http://www.khemer.com. Contoh game yang bisa di pasang adalah seperti ini :








Caranya menginstall nya seperti ini :

Untuk template Baru :

# Langkah #1 :

1. Silahkan kunjungi http://www.khemer.com.


2. Silahkan lihat dan coba game-game yang ada dengan cara meng klik pada judul game.


3. Setelah menemukan game yang di rasa cocok, perhatikan ke bagian bawah.


4. Copy kode yang ada pada text area, lalu paste pada notpad atau text editor lainnya, kemudian save dulu di komputer.


5. Sekarang anda mempunyai kode game untuk di pasang di blog.


6. Silahkan close halaman browser anda jika di rasa cukup.


# Langkah #2 :

1. Sign in di blogger dengan ID anda.

2. Klik Layout.

3. Klik tab Elemen Halaman.

4. Klik Tambahkan sebuah Elemen Halaman.

5. Klik tombol TAMBAHKAN KE BLOG di bawah tulisan HTML/JavaScript.

6. Copy kode game yang tadi di dapat, lalu paste pada pop up window yang muncul.

7. Klik tombol SIMPAN PERUBAHAN.

8. Pindahkan elemen yang baru anda buat tadi pada tempat yang di di rasa cocok.

9. Klik tombol SIMPAN yang ada di sebelah atas.

10. Selesai. Silahkan lihat hasilnya!


Untuk template Klasik :

1. Sign in di blogger dengan ID anda.

2. Klik Layout.

3. Klik tab Edit HML.

4. Copy seluruh kode template anda, kemudian paste pada notepad. Silahkan di save dulu untuk backup (sangat penting).

5. Copy kode game yang tadi di dapat, lalu paste pada tempat yang dinginkan.

6. Klik tombol Simpan Perubahan Template.

7. Selesai. Silahkan lihat hasilnya!


Gampang bukan? Selamat mencoba !

Eh bagi yang mau coba cari duit gratisan lewat internet? silahkan daftarkan blognya di sini!

Akses Internet Murah

3 Kunci + Rumus Sukses Bisnis di Internet

123. Pasang Fasilitas "Print" di blog

Sudah beberapa hari tidak ada tulisan baru di blog ini, harap dimaklumi ya soalnya kemarin baru liburan ke bandung selama tiga hari. Iseng melihat dokumen yang ada di shoutbox, rupanya banyak juga pengunjung baru blog ini. Buat anda yang terbilang sebagai pengunjung baru dan belum kenal dengan saya, salam kenal saja dari saya Kang Rohman, sering-sering berkunjung kemari ya.

Pada kesempatan kali ini saya mau mencoba mengulas sebuah pertanyaan mengenai bagaimana cara memasang fasilitas print di blog, layak nya yang banyak terdapat di situs-situs internet.. Memang, dengan memasang falitas print di blog, maka akan lebih memudahkan para pembaca blog yang ingin membaca artikel kita secara offline.

Untuk memasang falitas ini, banyak cara yang bisa di tempuh. Ada yang memasang script dari yang rumit nya minta ampun sampai dengan script yang sederhana. Untuk mendapatkan script tersebut sangatlah mudah, coba lakukan googling Silahkan tulis keyword atau kata kunci yang berhubungan semisal script print this page pada mesin pencari (search engine) yang ada di sebelah kanan atas blog ini. Bagi yang sedikit malas untuk ber googling ria, silahkan baca artikel ini sampai selesai.

Agar tidak membingungkan, saya memilih cara yang sederhana tapi tetap berfungsi secara semestinya yaitu memasang script yang sederhana tapi tetap berfungsi secara baik. Agar telihat lebih manis, ada banyak pembuat situs menggandengkan link untuk print berderetan dengan icon berbentuk printer, maka dari itu saya pun akan mencoba membuat link untuk print beserta icon print.

Langkah pertama yaitu membuat icon berbentuk print, jika anda tidak mahir menggambar tentu saja ada banyak situs penyedia icon secara gratis di internet. Lagi-lagi silahkan tulis keyword yang berhubungan semisal free icon pada mesin pencari di sebelah kanan atas blog ini. Sebagai contoh, saya mempunyai icon printer seperti ini print this page. Jika anda sudah mempunyai icon yang mau di pasang, langkah selanjutnya adalah mengupload icon tersebut ke server tempat anda biasanya menyimpan gambar. Sebagai contoh saya menyimpan icon print di google pages, untuk cara-cara upload ke google pages sudah saya ulas pada postingan yang ini.

Sebagai contoh, icon yang saya upload mempunyai alamat seperti ini :

http://amen24.googlepages.com/printer.png

Untuk script fasilitas print, anda tinggal memakai script di bawah ini (silahkan ganti alamat gambarnya dengan milik anda):

http://amen24.googlepages.com/printer.png" alt="print this page" border="0"/> Print this page Hasilnya akan seperti ini (silahkan klik untuk membuktikannya!) : print this page Print this page Tulisan Print this page bisa anda ubah sesuai keinginan, misal di ubah menjadi Cetak halaman ini atau yang lainnya, perhatikan saja kodenya. Masih bingung cara memasukannya di blog anda? ya sudah saya tuliskan langkah-langkahnya lebih detail :
  1. Silahkan login di blogger dengan id anda.
  2. Klik Layout.
  3. Klik Elemen Halaman.
  4. Klik tulisan Tambahkan sebuah Elemen Halaman.
  5. Setelah muncul popup, klik tombol TAMBAHKAN KE BLOG yang berada di bawah tulisan HTML/JavaScript.
  6. Copy lalu paste kode berikut pada elemen halaman tadi :
  7. Klik tombol simpan perubahan.
  8. Pindahkan elemen yang baru di buat tadi ke tempat yang anda sukai.
  9. Klik tombol SIMPAN.
  10. Selesai. Silahkan lihat hasilnya.

Selain bentuk link seperti yang saya terangkan di atas, ada juga yang memasang fasilitas ini dalam bentuk tombol, kodenya seperti ini :

hasilnya akan seperti ini (coba klik untuk membuktikannya !) :
Untuk langkah-langkah pemasangan silahkan merujuk pada langkah-langkah yang di atas, langkahnya sama yang berbeda hanya kode yang di pasang saja. Selamat mencoba !

72. Daftar Google Sitemap

Senada dengan postingan kemarin lusa yaitu agar blog kita lebih diperhatikan oleh mbah Google, salah satu caranya adalah dengan mendaftarkan blog milik anda ke Google sitemap.

Google, google, dan google lagi yang dibicarakan, ada apa dengan google? Memang tak dapat dipungkiri bahwa sebagaimana kita ketahui si mbah google ini merupakan situs yang mempunyai search engine atau mesin pencari terkenal di dunia untuk saat ini, ribuan atau bahkan jutaan website/blog bersaing memperebutkan perhatian mbah google agar situs miliknya di tempatkan pada urutan teratas pencarian. Dan tentunya apabila website/blog kita di tempatkan pada urutan teratas, niscaya website/blog kita berkesempatan di banjiri oleh pengunjung dari bebagai penjuru dunia, bukankah itu yang selama ini kita harapkan?



Dengan mendaftar ke Google sitemap maka setiap artikel yang kita posting akan secara otomatis di tangkap oleh google. Ada satu hal yang perlu di ketahui yaitu anda harus mempunyai account email di google, akan tetapi anda tidak perlu kawatir karena tak seperti waktu dulu yaitu untuk membuat email di google harus di invite oleh orang lain, sekarang sudah bisa sendiri. Bagi yang belum punya bikin dulu deh, jalan yang mudah adalah coba login di google dengan email yang di berikan untuk Blogger.com, nah nanti akan secara otomatis di suruh upgrade ama ntuh mbah google dan di suruh melengkapi formulir bikin account di google.

Agar intermezonya tidak terlalu panjang, bagi yang mau daftar Google sitemap silahkan ikuti langkah-langkah berikut ini :

  1. Login di google dengan ID GMAIL sobat, silahkan kunjungi Google sitemap

  2. Setelah berada di halaman account sobat, alihkan perhatian ke halaman sebelah atas ! di sana terdapat kotak isian di samping tombol Add Site, isilah kotak tersebut dengan alamat blog anda. Contoh : http://template-unik.blogspot.com

  3. Klik tombol Add Site

  4. Klik link Verify your site

    verify

  5. Klik menu dropdown yang ada, pilih metode yang di inginkan. Biar mudah pilih saja yang Add a meta tag

    add a meta tag

  6. Copy meta tag yang di berikan, lalu paste pada notepad atau text editor yang lainnya agar mudah di gunakan nantinya.

    metatag

  7. Silahkan masuk ke account blogger dan tuju blog yang di daftarkan tadi

  8. Copy paste meta tag yang di berikan tadi, sebaiknya di bawah kode <data:blog.pagetitle/> untuk template baru atau di bawah kode <$BlogPageTitle$> untuk template klasik, jangan lupa klik tombol Simpan perubahan.

  9. Bila sudah selesai, tuju kembali Goggle site map, lalu klik tombol Verify

    tombolverify

  10. Jika semua berjalan dengan baik, akan ada tulisan “You've successfully verified http://NamaBlogAnda.blogspot.com/

  11. Selesai.

Bila anda mempunyai beberapa blog, anda tinggal memasukan lagi ke Add Site, ikuti seperti langkah sebelumnya.

Semoga blog anda tampak lebih menarik di mata mbah google.

Update : Tutorial ini sudah di tambahkan bantuan gambar agar lebih mudah di fahami.

Tambahan : Sekarang webmaster tool sudah terintegrasi dengan blogger, silahkan login k webmastertool dan anda akan melihat blog dalam akun gmail tersebut, untuk selanjutnya tinggal ikuti seperti langkah di atas.

71. Ubah Lebar Kolom Template

Lagi-lagi soal template nih. Mungkin ada beberapa dari sobat sekalian ada yang merasa sangat menyukai suatu template, akan tetapi ada ganjalan yakni lebar kolom yang ada tidak sesuai keinginan kita, baik itu lebar kolom sidebar atau pun mainbar (kolom tempat posting). Ada kalanya lebar kolom dari suatu template di rasa terlalu lebar ataupun terlalu sempit, nah jika sobat mengalami hal yang demikian, lumayan nih ada tips buat mengakalinya supaya lebar kolom menjadi sesuai dengan keinginan kita sendiri.

Untuk mengetahui lebar kolom suatu template, kita bisa mengenalinya melalui style sheet CSS nya. Akan tetapi tentu saja ada perbedaan antara satu template dengan template yang lainnya, ini tentunya terserah kepada si designer template nya sendiri. Sebagai contoh untuk bagian header, jika menurut standar template blogger di dalam style sheet CSS nya di namakan header, akan tetapi untuk template-template hasil buatan designer lain di luar blogger ada yang menamakan Banner ataupun nama-nama yang lainnya. Sebuah nama tentu tidak akan berpengaruh terhadap hasil yg di dapat, nama ini di pakai hanyalah agar mudah untuk di ingat atau di kenali oleh sang pemakai template apabila ingin melakukan editting template.

Agar tidak terlalu membingungkan, saya ambil contoh template minima 3 kolom yang bisa di download di sini !.Setelah melihat perkembangannya ternyata template ini banyak yang menyukainya. Jika sobat tidak puas dengan lebar kolom pada template tersebut, silahkan deh ikuti tips berikut biar lebar kolomnya sesuai dengan keinginan sobat. Dimanakah letak kode-kode untuk mengatur lebar kolom ? saya berikan contoh :


#header-wrapper {
width:900px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

#outer-wrapper {
width: 900px;
margin:0 auto;
padding:10px;
text-align:justify;
font: $bodyfont;
}

#main-wrapper {
width: 435px;
margin-left: 20px;
margin-right: 20px;
float: left;

}

#sidebar-wrapper {
width: 220px;
float: right;
}

#newsidebar-wrapper {
width: 200px;
float: left;
}



Seperti yang terlihat pada kode-kode diatas, yang mempengaruhi lebar kolom adalah yang saya cetak merah. Width tentu saja dalam bahasa indonesia adalah lebar, jadi gampangkan untuk mengenalinya. 900px adalah nilai lebar yaitu sebesar 900 pixel.

Agar lebih faham, kode-kode diatas saya uraikan :

#header-wrapper {
width:900px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

Ini artinya header-wrapper mempunyai lebar sebesar 900px dan mempunyai border (saya artikan border adalah bingkai atau garis tepi) sebesar 1 pixel dengan garis yang solid (solid = garis penuh. dashed = garis putus-putus. dotted = garis berupa titik-titik) dengan warna border yang bisa di ubah-ubah (pada bagian font dan warna).

header-wrapper adalah hanya penamaan saja, tidak mutlak. Jika di ganti dengan nama kepala juga tidak apa-apa. width:900px; berarti lebarnya sebesar 900 pixel. nah nilai 900 pixel inilah yang bisa di ubah sesuai keinginan sobat, mau ditambah nilainya biar lebih lebar, atau di kurangi biar lebih kecil. Akan tetapi saran saya, nilai dari header ini harus sama dengan nilai dari lebar body agar terlihat bagus. border:1px solid $bordercolor; adalah agar bagian header mempunyai garis tepi sebesar 1 pixel, jika ingin lebih tebal sobat tinggal tambahin nilainya, atau jika sobat menginginkan garis tepi ini tidak ada maka sobat hapus saja kode ini.



#outer-wrapper {
width: 900px;
margin:0 auto;
padding:10px;
text-align:justify;
font: $bodyfont;
}

Ini artinya outer-wrapper mempunyai lebar sebesar 900px, jarak sela sebesar 10 pixel dengan align nya adalah rata kiri-kanan dan jenis huruf yang bisa di ubah-ubah melalui panel huruf dan warna.

outer wrapper hanyalah nama saja. width:900px; berarti lebarnya 900 pixel. 900 pixel ini adalah lebar yang di sediakan untuk kolom-kolom yang ada, sebut saja dalam hal ini kolom main-wrapper, sidebar-wrapper, dan newsidebar-wrapper. Jadi dengan kata lain outer wraper adalah hasil penjumlahan lebar kolom main-wrapper, sidebar-wrapper, dan newsidebar-wrapper. Apabila sobat memasukan content yang melebihi lebar kolom masing-masing, maka secara otomatis pula melebihi spek dari lebar yang di sediakan oleh outer wraper dan yang terjadi adalah salah satu kolom akan melorot ke bawah dan ini membuat blog kita menjadi kurang sedap untuk di pandang mata. Jadi apabila sobat ingin mengubah lebar salah satu kolom di antara yang tiga, maka lebar dari outer wraper pun harus di ubah dan di sesuaikan.


#main-wrapper {
width: 435px;
margin-left: 20px;
margin-right: 20px;
float: left;

}


Ini artinya kolom main-wrapper mempunyai lebar sebesar 435 pixel dengan margin kanan sebesar 20 pixel, margin kiri 20 pixel dan kolom ini di letakan sebelah kiri.

main-wrapper adalah kolom halaman posting, apa-apa yang kita posting maka akan masuk ke halaman ini. width: 435px; berarti lebar kolom ini sebesar 435 pixel, tapi karena menggunakan margin-left dan margin-right, maka lebar kolom sebenarnya adalah sebesar 475 pixel. Akan tetapi yang 40 pixel hanyalah jeda saja agar batas kolom menjadi terlihat tidak bersentuhan. Apabila sobat merasa kolom ini terlalu sempit atau kekecilan, maka sobat bisa menambahkan nilai, contoh 550 pixel. Apabila sobat berniat merubah kolom ini, kolom outer-wraper pun harus di tambah nilainya. contoh tadi apabila main-wrapper ingin menjadi 550 pixel, maka 550px-475px=75px. ini berarti kolom outer-wraper harus di tambah sebesar 75px, jadi 900px+75px=975px.


#sidebar-wrapper {
width: 220px;
float: right;
}


Ini artinya kolom sidebar-wrapper mempunyai lebar sebesar 220 pixel dan di tempatkan sebelah kanan layar.

Kolom sidebar-wrapper adalah kolom sidebar atau kolom tempat di mana kita menyimpan berbagai aksesoris atau yg lainnya. width: 220px; berarti mempunyai lebar sebesar 220 pixel, apabila ingin di persempit atau di perlebar, maka kita hanya perlu mengubah nilai pixelnya saja. Cuma apabila merubah nilai kolom ini, jangan lupa untuk mengubah nilai space yang di sediakan oleh outer-wraper. contoh : apbila kolom ini ingin diperbesar menjadi 250pixel maka tambahan pixel adalah sebesar 30 pixel, nah jangan lupa untuk menambahkan pula pada kolom outer-wraper.

#newsidebar-wrapper {
width: 200px;
float: left;
}



Ini artinya kolom newsidebar-wrapper mempunyai lebar kolom sebesar 200 pixel dan di tempatkan pada layar sebelah kiri.

Seperti halnya sidebar-wrapper, kolom newsidebar-wrapper pun adalah tempat menyimpan berbagai aksesori ataupun blog tool. kolom ini di buat agar kita bisa lebih banyak memuat berbagai aksesori yang kita inginkan. Kolom newsidebar-wrapper ini lebarnya sebesar 200px, nah bila berniat merubahnya maka tinggal merubah nilai pixelnya saja, tapi jangan lupa untuk menambahkan pula pada kolom outer-wraper.


Coba bandingkan antara dua blog ini, silahkan klik di sini ! dengan yang di sini !

Selamat berbingung ria !

70. Pasang Jadwal Sholat

Dari kemarin yang di omongin kayanya soal ngotak-ngatik template melulu, biar tidak jenuh kali ini saya akan membahas tentang aksesori blog. Bagi sobat yang notabene muslim, ada nih aksesori blog plus buat mengingatkan kepada kita akan waktu sholat biar para pengunjung blog kita tidak terlalu terlena ketika memmbaca berbagai artikel yang kita tulis di blog. Jadwal waktu sholat ini bisa sobat dapatkan di http://www.islamicfinder.org, untuk cara mendapatkannya silahkan ikuti langkah-langkah berikut ini :

  1. Silahkan sobat kunjungi situs http://www.islamicfinder.org atau hanya klik di sini !


  2. Klik link yang bertuliskan Add new sevices to your site di halaman bagian bawah


  3. Alihkan perhatian ke nomor pilihan ke 2. Klik menu Dropdown yang bertuliskan Select a Country


  4. Klik nama negara yang sobat inginkan, lalu klik Go. Contoh : Indonesia


  5. Klik nama kota yang sobat inginkan. Contoh : Jakarta


  6. KLik tombol Generated Code


  7. Copy kode yang di berikan, lalu paste pada notepad untuk nanti keperluan di simpan ke blok kita


  8. Silahkan tutup window situs tersebut


  9. Selesai.



Itu tadi cara mendapatkan kode jadwal sholatnya, untuk memasukan kode tersebut ke dalam blog, silahkan ikuti langkah berikut :


Untuk Template Klasik

  1. Sign in di blogger


  2. Klik menu Template


  3. Klik menu Edit HTML


  4. Copy seluruh kode template, paste pada notepad lalu simpan untuk backup data


  5. Copy kode jadwal sho;at yang tadi lalu paste pada tempat yang sobat inginkan


  6. Klik tombol Pratinjau untuk melihat perubahan


  7. Bila sudah Ok, klik tombol Simpan Perubahan Template


  8. Selesai.



Untuk Template baru

  1. Sign in di blogger


  2. Klik menu Layout


  3. Klik menu Elemen Halaman


  4. Klik tulisan Tambahkan sebuah Elemen Halaman


  5. Klik tombol TAMBAHKAN KE BLOG di bawah tulisan HTML/JavaScript


  6. Paste kode Jadwal sholat tadi ke kolom yang di sediakan


  7. Klik tombol Simpan Perubahan


  8. Pindahkan elemen yang baru di buat pada tempat yang sobat sukai


  9. Klik tombol Simpan


  10. Selesai



Contoh jadwal sholat yang saya terangkan diatas seperti ini :


Yang arah vertical :



Yang arah horizontal





Selamat mempunyai jadwal sholat dan jangan lupa sholat ye jangan ngeblog melulu !

66. Pasang Kalender di Blog

Sobat Guest452, itulah nama yang di kenalkan pada shoutbox. Beliau membredel shoutbox sebanyak tiga kali berturut-turut dengan permintaan agar di postingkan cara membuat Kalender pada blog. Untuk menghormati keinginan beliau ini, maka saya coba bahas tentang bagaimana cara pasang kalender di dalam blog.

Untuk memasang sebuah kalender kita bisa memanfaatkan berbagai situs penyedia kalender gratisan. Situs seperti ini sangatlah banyak, tentunya mereka berlomba dengan menampilkan kalender-kalender yang menarik untuk di lihat. Agar tidak terlalu bingung mencarinya, saya berikan contoh satu saja yaitu http://www.free-blog-content.com. Silahkan coba sobat kunjungi situs tersebut ! kalender yang di sediakan sangat beragam. Silahkan klik kategori yang ada untuk memilih bentuk kalender yang sobat sukai, kemudian copy kode yang di berikan di bawah gambar kalender lalu paste pada notepad untuk nanti keperluan di simpan di blog.

salah satu contoh gambar yang di sediakan seperti ini :






Untuk cara instalasi, silahkan ikuti langkah-langkah berikut !

Untuk Template klasik

  1. Sig in di blogger dengan id sobat

  2. Klik menu Template

  3. Klik menu Edit HTML

  4. Copy seluruh kode HTMl lalu paste pada program notepad kemudian save. Ini di maksudkan untuk berjaga-jaga apabila terjadi kesalahan dalam proses editting template, sobat masih mempunyai data untuk mengembalikannya ke semula

  5. Copy kode yang tadi telah ada di notepad lalu paste pada tempat yang di inginkan, mau di sidebar atau di manapun boleh

  6. Klik tombol Simpan Perubahan Template

  7. Selesai.



Untuk Template baru

  1. Sign in di blogger dengan id sobat

  2. Klik menu layout

  3. Klik menu Elemen Halaman

  4. Klik tulisan Tambahkan sebuah elemen halaman

  5. Klik tombol TAMBAHKAN KE BLOG di bawah tulisan HTML/JavaScript

  6. Copy kode yang tadi telah ada di notepad lalu paste pada kolom yang di sediakan

  7. Klik tombol SIMPAN PERUBAHAN

  8. Pindahkan elemen yang baru di buat pada tempat yang sobat inginkan, lalu klik tombol SIMPAN

  9. Selesai.




Khusus bagi sobat yang muslim dan ingin kalendernya dalam bentuk kalender Hijriah, ada sumbangan hasil karya yang bisa sobat pakai. Kalender ini di dapat dari http://mfr.jentayu.com. Bentuk kalendernya seperti ini :

65. Cepat Terindeks di Google

Menyambung postingan kemarin bahwa saya akan memposting tips-tips bagaimana agar blog kita lebih cepat terindeks di google. Tentunya tips-tips berikut tidaklah seratus persen menjamin bahwa blog kita akan lebih cepat terindeks, akan tetapi bolehlah untuk di coba dan sebenarnya ini sudah saya buktikan sendiri kebenarannya.

Seperti keterangan yang lalu, bahwa setelah kita mendaftar di google, blog kita tidaklah langsung terindeks pada mesin pencari google, akan tetapi bisa memakan waktu 3 sampai 4 minggu bahkan apabila bernasib kurang baik bisa sampai 8 minggu barulah blog kita terlisting pada mesin pencari nya. Nah agar tidak terlalu bosan menunggu, sedikit tips bagi sobat, silahkan coba dan buktikan.

  • Memperbaiki Pengaturan blog


Untuk langkah-langkah pengaturan (Setting) blog, secara lengkap sudah saya posting silahkan baca di sini !, akan tetapi karena postingan tersebut di buat sebelum ada layanan blogger berbahasa indonesia, maka settingannya berbahasa inggris. Tapi toh saya yakin bahwa sobat pasti faham dengan yang saya tulis.


  • Link ke blog dengan page rank tinggi


Salah satu cara agar blog kita lebih cepat terindeks di google adalah kita di link oleh blog yang mempunyai page rank yang tinggi, dan biasanya blog-blog tersebut adalah blog terkenal. Contoh blog Indonesia yang sangat terkenal adalah blog miliknya mas fatih syuhud yaitu http://fatihsyuhud.com, blognya kang Agus hery di http://edittag.blogspot.com, dan masih banyak lagi yang lainnya. Saran saya pasanglah terlebih dahulu link blog mereka pada halaman blog milik sobat, setelah itu mintalah agar blog sobat di linkback atau di link balik oleh mereka. Permintaan untuk di linkback bisa di ajukan pada buku tamu (shoutbox) atau bisa juga melalui komentar pada postingan atau jika ingin lebih pribadi kirim melalui email. Saya yakin mereka akan segera memasang link sobat pada blog mereka, atau jika dalam waktu tiga hari masih belum di linkback, ajukan kembali permintaan untuk dilinkback karena untuk blog-blog terkenal dalam sehari tidak hanya satu atau dua blog saja yang pasang link blog mereka, maka wajar saja apabila ada satu atau dua blog yang terlewatkan untuk di linkback.


  • Pasang tag meta


Salah satu cara agar blog kita lebih di lirik atau di kenali oleh mesin pencari miliknya om google adalah memasang tag meta di bagian header pada kode template blog. contoh tag meta untuk blogger seperti ini :


Deskripsi dari blog sobat di sini "/>
kata kunci atau keyword simpan disini, buatlah beberapa keyword yang sobat anggap sangat berhubungan dengan blog sobat "/>

Yang harus diperhatikan adalah tulisan-tulisan yang tercetak merah. Tulisan-tulisan tersebut haruslah di sesuaikan dengan kondisi blog sobat.

Untuk deskripsi, silahkan isi dengan deskripsi blog sobat. contoh untuk blog milik saya adalah "Panduan praktis membuat blog di blogger.com. tips, trik, serta download software secara gratis".

Untuk kata kunci (keyword), silahkan isi dengan kata kunci yang berhubungan dengan blog sobat. contoh untuk blog ini adalah : blog tutorial, cara membuat blog, bikin blog, cara bikin blog, dan sebagainya. Jangan lupa untuk menyisipkan tanda koma untuk memisahkan antara keyword yang satu dengan keyword yang lainnya.

Untuk judul blog, silahkan isi dengan judul dari blog sobat.Contoh : untuk blog ini adalah Blog tutorial.

Bagi yang belum mengetahui dimanakah tag meta di simpan, jawabannya adalah di dalam kode header blog, atau jika masih bingung simpan saja di bawah kode <data:blog.pageTitle/> .


Sebenarnya masih ada beberapa tips yang bisa dilakukan, akan tetapi kayanya udah lemes nih ngetiknya, jadi dicukupkan sekian dulu deh, selamat mencoba dan mudah-mudahan blog sobat lebih cepat terindeks di google. Satu pertanyaan aja deh buat tambahan, sudahkah blog sobat terindeks di google? coba tuliskan alamat blog sobat pada search engine google di bawah postingan ini !

64. Cara Daftar Search Engine

Tak di sangkal bahwa tujuan utama dari membuat blog antara lain adalah agar tulisan-tulisan kita bisa di baca oleh orang lain atau pengunjung blog, semakin banyak yang berkunjung apalagi memberikan komentar pada apa yang kita posting tentunya akan membuat hati kita merasa senang dan bahagia. Akan tetapi tentunya tidak serta merta blog kita akan ramai di kunjungi, ini memerlukan usaha publikasi yang gencar dari pemilik blog apabila ingin banyak pengunjungnya.

Banyak cara yang bisa kita lakukan agar blog kita bisa dikenal dan di kunjungi, antara lain adalah dengan rajinnya kita blogwalking atau berkunjung ke blog milik orang lain, mendaftarkan ke berbagai agregator, dan yang paling efektif adalah melalui search engine atau mesin pencari.

Bagi blogger pemula mungkin berangggapan bahwa apabila kita membuat website atau blog akan secara otomatis terindeks atau berada pada list berbagai search engine, dan kenyataannya tidaklah demikian. Seperti halnya sebuah sekolah, agar nama kita terdaftar pada buku daftar siswa, tentunya kita harus melakukan pendaftaran terlebih dahulu ke sekolah tersebut. Sama halnya dengan mesin pencari, agar blog kita terindeks pada mesin pencari, maka kita harus terlebih dahulu mendaftarkan blog milik kita pada situs pemilik mesin pencari.

Mesin pencari tentu jumlahnya sangat banyak sekali, dan pada saat ini yang paling terkenal di dunia adalah Google, Yahoo, serta Msn. Apabila blog kita ingin terindeks pada mesin pencari mereka, maka kewajiban kita adalah mendaftarkan URL blog kita pada mesin pencari mereka. Bila ada yang belum tahu ke manakah harus mendaftarkan blognya, maka silahkan simak tulisan berikut :

  • Daftar Google
  • Untuk mendaftar ke google, silahkan sobat kunjungi http://www.google.com/addurl/, nah apabila sudah berada pada halaman pendaftaran ada beberapa langkah yang harus di lakukan, yaitu mengisi form yang di sediakan :



    • URL --> Isi dengan URL blog sobat.


    • Comments --> Isi dengan keyword atau kata kunci yang berhubungan dengan blog sobat


    • Isi kotak kosong dengan huruf Verifikasi yang tersedia


    • Klik tombol Add URL


    • Selesai.


    Setelah sobat melakukan pendaftaran ke Google, maka tidak serta merta blog sobat terindeks pada mesin pencari nya, akan tetapi memerlukan 3 sampai 4 minggu baru blog sobat bisa terindeks. Jika sudah 3 sampai 4 minggu, maka cobalah ketik alamat blog sobat pada mesin pencari google, apakah sudah terindeks atau belum? jika belum, coba tunggu beberapa minggu lagi, dan tuliskan kembali alamat blog sobat, Jika ternyata masih belum juga, coba deh daftarin lagi blog nya ke google seperti langkah di atas. Atau mungkin sobat tidak sabar ingin cepat terindeks, sebenarnya bisa saja ini terjadi, hanya dalam 3 atau 4 hari saja blog sobat sudah bisa terindeks di google. Ingin tahu caranya? simak saja postingan berikutnya ya, mungkin satu dua hari ke depan artikelnya selesai saya buat.



    • Daftar Yahoo!


    Untuk mendaftar ke yahoo! silahkan sobat kunjungi https://siteexplorer.search.yahoo.com/submit. Akan tetapi untuk mendaftar ke yahoo, sobat harus terlebih dahulu mempunyai account yahoo, karena di perlukan log in terlebih dahulu ke account yahoo. Bagi yang belum punya account yahoo (email di yahoo) silahkan bikin dulu, bagi yang sudah punya, sobat tinggal login dengan username serta password sobat. Apabila sudah login, nanti sudah tersedia kolom untuk di isi, silahkan isi kolom tersebut dengan URL sobat, kemudian klik tombol Add URL, selesai. Jika ingin memasukan alamat feed sekalian, sobat bisa memasukannya. Ingat, alamat feed di blogger hanya tinggal menambahkan atom.xml di belakang uRL blog sobat, contoh : untuk blog saya ini mempunyai alamat feed sebagai berikut :

    http://kolom-tutorial.blogspot.com/atom.xml

    atau memakai www pun sama saja :

    http://www.kolom-tutorial.blogspot.com/atom.xml



    • Daftar ke Msn


    Untuk daftar ke Msn, silahkan sobat kunjungi http://search.msn.com/docs/submit.aspx?FORM=WSDD2 silahkan sobat isi huruf verifikasi dan URL sobat pada kotak yang tersedia, kemudian klik tombol Submit URL, selesai.

    Apabila sobat mempunyai keinginan lebih, yaitu URL blog sobat terindeks pada puluhan mesin pencari, sobat bisa menggunakan bantuan situs submitter. Coba klik saja banner dibawah ini :

    Submit Your Site To The Web's Top 50 Search Engines for Free!

    Tugas sobat hanya mengisi alamat URL blog miliknya, serta menuliskan alamat email saja, kemudian klik tombol Submit Your Site.

    Jika ingin lebih cepat terkenal coba lakukan ping ke bebagai agregator, silahkan klik link di bawah :

    Ping-O-Matic

    Sobat tinggal mengisi form yang di sediakan.

    Sudahkan blog sobat terindeks di google? coba masukan alamat blog sobat pada mesin pencari google yang tersedia di bawah postingan ini !

    63. Pasang Kode Tuker Link

    BangDhika beberapa waktu yang lalu mengajukan pertanyaan melalui shoutbox mengenai bagaimana cara membuat kode untuk tukeran link, dan sekarang saya akan coba membahasnya. Mudah-mudahan informasi ini bermanfaat juga bagi sobat lainnya yang belum mengetahui mengenai hal ini.

    Untuk membuat kode tukeran link, kebanyakan para blogger menggunakan banner yang berukuran kecil atau di sebut juga dengan chiklet sebagai ciri khas dari blog masing-masing. Maka dari itu, saya akan mencoba mengulas pembahasan ini bermula dari pembuatan chiklet nya.

    Untuk membuat sebuah chiklet, sobat bisa menggunakan berbagai software grafik & design semacam photoshop, corel, atau lain sebagainya. Tak hanya sebatas chiklet yang berupa gambar diam, sebuah animasi pun bisa di jadikan chiklet tukeran link, tentunya ini terserah kepada keahlian masing-masing dalam hal membuat chiklet.

    Akan tetapi, bagi sobat yang belum bisa atau hanya sekedar malas untuk membuatnya karena memerlukan waktu yang cukup lama untuk berkreasi, sobat bisa menggunakan layanan berbagai situs pembuat chiklet. Salah satu situs yang menyediakan layanan ini adalah www.chicklette.net. Melalui situs ini sobat hanya perlu menentukan warna serta tulisan yang di inginkan, kemudian apabila sudah selesai, sobat tinggal save picture lalu menyimpannya dalam komputer sobat.

    Itu tadi merupakan langkah pertama. langkah kedua adalah meng upload file chiklet tadi ke hosting untuk menyimpan gambar, boleh di blogger atau di hosting lain, untuk cara upload gambar sudah sering di bahas, apabila masih bingung coba baca lagi di sini ! Jika proses upload selesai, sobat tinggal mencatat atau mengcopy alamat URL gambar tersebut. Misal saya ambil contoh untuk chiklet blog ini adalah :

    http://i162.photobucket.com/albums/t253/rohman24/kolomtutorial.gif

    langkah selanjuatnya adalah membuat kode link dari alamat gambar tadi, contoh kodenya seperti ini :



    Nah itu tadi merupakan contoh link untuk membuat link ke blog ini, untuk ngelink ke blog sobat ya tinggal sesuaikan saja.

    Apabila kode link sudah ada, langkah selanjutnya adalah membuat text area untuk menampung seluruh kode agar nanti bisa di copy oleh pengunjung yang mau nge link ke blog sobat, kodenya seperti ini :



    Beberapa langkah sudah di lewati, langkah selanjutnya adalah merangkaikan kode-kode tadi, misalkan kode tukeran link ingin di bawah gambar chicklet agar tampak lebih menarik, kodenya kira-kira seperti ini :

    Tukeran link





    Copy kode di bawah masukan di blog anda, saya akan segera linkback kembali



    Kolom blog tutorial






    Hasilnya nanti akan seperti ini :

    Tukeran link

    Copy kode di bawah masukan di blog anda, saya akan segera linkback kembali

    Kolom blog tutorial



    Dari tulisan diatas, terlihat ada tulisan yang memanjang kekanan. Akan tetapi jangan kawatir karena tulisan tersebut akan turun secara otomatis mengikuti lebar dari sidebar. Untuk mengatur lebar serta tinggi dari text area, sobat tinggal mengganti nilai dari rows serta cols saja.

    Ada juga blogger yang suka memasang tombol LINK TO ME pada blog nya, ini di maksudkan agar ketika pengunjung yang ingin membuat link ke blog sobat tinggal mengklik tombol tersebut. Akan tetapi ini bekerja bagi mereka (yang ingin membuat link ke blog sobat) yang memakai template baru saja, sedangkan untuk yang template klasik tidak bisa, jadi menurut saya kurang efektif. Contoh tombolnya seperti :

    The button image will displayed on your site like this


    Kolom blog tutorial


    Coba buktikan deh, klik saja pada tombol yang saya berikan.

    Kode untuk membuatnya seperti ini :





    The button image will displayed on your site like this



    Kolom blog tutorial



    Silahkan ganti alamatnya dengan yang di miliki sobat.

    bagi sobat yang menggunakan template klasik, sobat tinggal menyimpan kode di atas pada sidebar yang sobat inginkan. Untu yang memakai template baru, sobat tinggal memilih tambah elemen, trus pilih HTML/Javascript, kemudian masukan kode yang seperti diatas, simpan dan selesai.

    Semoga mudah untuk di mengerti.

    Salam buat blogger sejati semua......

    43. Cara Membuat Favicon

    Pada zaman dahulu kala, kang rohman pernah membahas bagaimana cara menganti Favicon yang saya posting di sini. Karena zaman selalu berubah, maka postingan tersebut sudah tidak relevan lagi untuk di baca atau dengan kata lain sudah kadaluarsa. Walaupun begitu sebenarnya kang rohman sudah memposting artikel terbaru yang saya posting di sini, namun karena tidak semua orang suka berkunjung ke blog saya yang satu ini, maka artikel tersebut luput untuk di baca. Oleh karenanya, kali ini kang rohman coba posting saja di blog ini.

    Bagi anda yang masih bingung apa sih Favicon itu? Favicon (favourite icon) adalah icon kecil yang berada di samping alamat blog atau website anda. Apabila anda membuat blog di Blogger.com alias blogspot, maka favicon yang berada di samping alamat URL anda adalah berupa favicon blogger. Berikut screenshot nya :

    blogger favicon

    Apakah favicon tersebut bisa di ganti dengan favicon milik anda? jawabannya adalah bisa. Berikut adalah contoh favicon blogger yang sudah di ganti :

    favicon anda

    Untuk mengganti favicon tersebut, anda bisa melakukan langkah-langkah seperti berikut :

    1. Pertama buatlah sebuah gambar yang akan di jadikan sebagai favicon, contoh seperti gambar di bawah ini :

      favicon ku

    2. Setelah itu anda harus mengubah gambar tersebut kedalam bentuk gambar icon. Untuk hal tersebut, anda bisa menggunakan tool Favicon Generator, silahkan kunjungi situs http://www.favicongenerator.com

    3. Klik pada tombol Browse...

    4. Masukan gambar yang tadi dibuat untuk di ubah menjadi format icon

    5. Klik pada tombol Generate Favicon.

    6. Setelah proses selesai, klik pada Click Here to Download your favicon.

    7. Save ke komputer anda.

    8. Langkah selanjutnya adalah anda harus meng upload Favicon yang tadi ke tempat hosting gamabar, contoh adalah ke Yahoo! Geocities. Belum tahu bagaimana cara meng upload gambar ke Yahoo! Geocities? heuheuheu... sok atuh di baca dulu postingan kang rohman yang ini!

    9. Sekarang saya asumsikan bahwa anda sudah mempunyai alamat URL dari favicon anda. sebagai contoh, saya mempunyai sebuah alamat URL seperti ini :

      http://www.geocities.com/amn_tea/favicon.ico

    10. Anda harus mengubah alamat URL favicon anda menjadi seperti ini :

      http://www.geocities.com/amn_tea/favicon.ico"/>


    11. Langkah selanjutnya adalah silahkan login ke blogger dengan ID anda.

    12. Klik pada Tata Letak.

    13. Klik Edit HTML.

    14. Silahkan cari kode (posisinya hampir paling atas, jadi jangan jauh-jauh nyari ke bawah dhenk).

    15. Simpan kode favicon yang tadi persis di atas kode . Contoh :


    16. http://www.geocities.com/amn_tea/favicon.ico"/>


    17. Klik tombol Simpan Template.

    18. Selesai. Sekarang anda sudah mempunyai favicon di alamat URL blog anda.



    Bagi anda yang masih menggunakan browser IE6, favicon anda tidak akan langsung terlihat, coba di bookmark dulu alamatnya. Berbeda jika anda menggunakan browser firefox, opera dan yang lainnya, favicon anda sudah langsung dapat di nikmati.

    42. Menu Dropdown dengan JavaScript (2)

    Melanjutkan Postingan kemarin lusa yaitu tentang membuat menu dropdown dengan JavaScript. Pada postingan yang lalu telah di bahas tentang membuat menu dropdown pada template baru, maka pada postingan kali ini akan di bahas mengenai cara pembuatan pada template klasik.

    Agar tidak terlalu monoton, pada pembuatan dropdown kali ini akan saya beri sentuhan baru, yaitu pemakaian background yang berbeda. Jika pada postingan yang lalu saya memberikan contoh background banner seperti di bawah ini :







    Maka kali ini saya akan memberi contoh banner seperti ini :









    Dan contoh menu dropdown yang akan di bahas adalah seperti demo di bawah ini :





    Agar tidak terlalu menyita space halaman karena penuh dengan kata-kata yang membingungkan, kita langsung saja pada topik pembahasan. Untuk membuat menu dropdown pada template klasik, silahkan ikuti langkah-langkah berikut ini :

  • Langkah pertama adalah membuat tiga banner untuk background tulisan, banner ini bisa dibuat dengan program design & grafik semisal Adobe photoshop atau Corel Draw ataupun program-program lainya yang sejenis.


  • Langkah kedua adalah mengupload banner-banner yang telah sobat buat, salah satu contoh adalah dengan menggunakan jasa situs www.photobucket.com. Untuk cara menguploadnya saya sudah terangkan, jika belum faham silahkan klik di sini. Saya ambil contoh, banner yang telah saya upload mempunyai URL address sebagai berikut :

    http://i162.photobucket.com/albums/t253/rohman24/bannerjava6.gif

    http://i162.photobucket.com/albums/t253/rohman24/bannerjava5.gif

    http://i162.photobucket.com/albums/t253/rohman24/bannerjava4.gif


  • Langkah ketiga adalah memasukan kode JavaScript serta stylesheet CSS pada kode template blog, silahkan ikuti langkah-langkahnya :


    1. Sign in di blogger.com dengan id sobat

    2. Klik menu Template

    3. Klik menu Edit HTML

    4. Copy seluruh kode template lalu paste pada program notepad, ini untuk berjaga-jaga apabila terjadi kesalahan dalam proses editting kode template

    5. Tambahkan kode berikut di bawah kode dan sebelum kode , atau jika ingin lebih mudah simpan di bawah kode <$BlogPageTitle$> :






    6. Masukan kode berikut diatas kode ]]>



    7. .raden{
      background-image: url('http://i162.photobucket.com/albums/t253/rohman24/bannerjava6.gif');
      text-align:center;
      width:175px;
      font-family: georgia, Helvetica, sans-serif;
      padding-left:5px;
      padding-right:5px;
      padding-top:5px;
      padding-bottom: 5px;
      display:block;
      text-decoration: none;
      color: #F6E151;
      }

      .ogah{
      background-image:url('http://i162.photobucket.com/albums/t253/rohman24/tombol_03.gif');
      text-align:center;
      width:175px;
      font-family: georgia, Helvetica, sans-serif;
      padding-left:5px;
      padding-right:5px;
      padding-top:8px;
      padding-bottom: 5px;
      display:block;
      text-decoration: none;
      color: ##FAF705;
      height: 18px;
      }

      .ogahniye{
      background-image: url('http://i162.photobucket.com/albums/t253/rohman24/bannerjava4.gif');
      text-align:center;
      width:175px;
      font-family: georgia, Helvetica, sans-serif;
      padding-left:5px;
      padding-right:5px;
      padding-top:8px;
      padding-bottom: 5px;
      display:block;
      text-decoration: none;
      color: #0572FA;
      height: 18px;
      }

      .hide{
      display: none;
      }

      .show{
      display: block;
      }


      a{cursor: hand}



    8. Masukan kode berikut di sidebar blog sobat, dimana saja sesuai dengan keinginan sobat :



    9. Navigasi

      Blog Tutorial



      Aksesori blog



      My Other Blog



      Links Temanku








    10. Klik tombol Preview untuk melihat perubahan yang baru di buat

    11. Jika sudah OK, klik tombol Save Changes Template
    12. Selesai.


    Keterangan kode-kode diatas :

    • kode di bawah ini adalah kode untuk mengaktifkan tombol yg di klik, jadi jangan di rubah! kecuali jika obat sudah familier dengan Javascript dan bisa membuat variasi baru dari kode ini :





    • Kode-kode di bawah ini, nilainya harus di sesuaikan dengan kondisi blog sobat :



    • .raden
      --> .raden hanya pendefinisian saja , bisa di ganti dengan apa saja yang penting harus sesuai dengan kode yang di definisikan dan jangan lupa untuk enyertakan dot ( . ) diepan kata yang di buat.

      background-image: url('http://i162.photobucket.com/albums/t253/rohman24/bannerjava6.gif');
      --> ini adalah gambar background untuk tulisan yang saya buat yaitu sebuah ombol.

      text-align:center;
      --> kode untuk membuat tulisan berada di tengah, bisa diganti dengan kata Left untuk sebelah kiri, dan right untuk sebelah kanan.

      width:90%;
      --> lebar dari tombol adalah sebesar 90% dari besarnya space sidebar dimana tombol ini di tempatkan, silahkan ganti nilainya dan sesuaikan dengan ukuran blog sobat.

      font-family: georgia, Helvetica, sans-serif;
      --> Font (jenis hurup) yang dipilih adalah jenis georgia, ini bisa diganti dengan jenis huruf lainnya semisal verdana dan lain-lain.

      padding-left:5px;
      --> batas (jarak) tulisan sebesar 5px dari tepi kiri tombol,nilai ini bisa di rubah sesuai keinginan sobat.

      padding-right:5px;
      --> batas (jarak) tulisan sebesar 5px dari tepi kanan tombol,nilai ini bisa di rubah sesuai keinginan sobat.

      padding-top:5px;
      --> batas (jarak) tulisan sebesar 5px dari tepi atas tombol,nilai ini bisa di rubah sesuai keinginan sobat.

      padding-bottom: 5px;
      --> batas (jarak) tulisan sebesar 5px dari tepi bawah tombol,nilai ini bisa di rubah sesuai keinginan sobat.

      display:block;
      --> block berarti ditampilkan,jadi jangan dirubah.

      text-decoration: none;
      --> Tidak ada tek dekorasi. Sebaiknya jangan di rubah.

      color: #F6E151;
      --> Pemilihan warna, bisa dirubah kode warnanya sesuai dengan keinginan sobat.



      .ogah
      --> .ogah hanya pendefinisian saja , bisa di ganti dengan apa saja yang penting harus sesuai dengan kode yang di definisikan dan jangan lupa untuk menyertakan dot ( . ) didepan kata yang di buat.



      .ogahniye
      --> .ogahniye lagi-lagi hanya pendefinisian saja , bisa di ganti dengan apa saja yang penting harus sesuai dengan kode yang di definisikan dan jangan lupa untuk menyertakan dot ( . ) didepan kata yang di buat.



      .hide
      display: none;
      --> Pendifinisian untuk .hide disembunyikan (tidak tampil).



      .show
      display: block;
      --> Pendifinisian untuk .show ditampilkan.



      a{cursor: hand}
      Agar gambar mouse berubah jadi gambar tangan ketika berada di atas tombol.


    • Kode yang saya berikan diatas memuat links yang saya miliki, jadi links tersebuat harus di rubah dengan links milik sobat.



    Mudah-mudahan keterangan di atas sudah jelas. Selamat mencoba !

    41. Menu Dropdown dengan JavaScript

    Bagi sobat yang suka akan pernak-pernik blog, ada kabar baik nih. Pada kesempatan kali ini saya akan membahas tentang cara membuat menu Dropdown menggunakan JavaScript.

    Biar agak seru, silahkan klik tombol di bawah untuk melihat demo :





    Caranya silahkan arahkan mouse sobat ke deretan menu yang ada pada halaman demo lalu klik untuk membuka submenu yang ada di dalamnya dan untuk menutupnya kembali sobat klik sekali lagi ke menu yang ingin di tutup, silahkan mencoba :

    Bagaimana sudah di coba belum? kalau belum, coba dulu deh biar agak seru pembahasannya! Nah kalau sudah, bagaimana tanggapannya, seru tidak? kalau seru silahkan sobat baca artikel ini sampai tuntas (kaya adu banteng aja pake acara seru apa kagak), nah kalau sekiranya tidak seru, ya mending cari topik lain biar semangat bacanya.

    Oke biar tidak terlalu ngelantur, kita langsung ke topik bahasan. Untuk membuat menu seperti di atas, kita perlu memasang kode JavaScript serta stylesheet CSS pada template blog kita, akan tetapi karena di blogger terdapat dua pemakaian template yaitu template klasik dan template baru, maka tentu saja dalam membuat menu dropdown tersebut caranya berbeda pula. Oleh karena itu, pembahasannya pun akan saya bagi dua juga yaitu untuk template klasik serta untuk template baru. Akan tetapi karena pembahasannya terlalu panjang, maka kali ini akan saya bahas untuk template baru saja, dan untuk template klasik akan saya bahas pada postingan berikutnya.

    Untuk membuatnya silahkan ikuti langkah-langkah berikut ini :

  • Langkah pertama yaitu membuat dua buah tombol untuk background dari tulisan menu, sebaiknya warna ataupun style nya di bedakan, ini dimaksudkan agar antara menu utama dengan sub menu akan terlihat perbedaannya. sebagai contoh lihat gambar tombol di bawah ini :








  • Langkah kedua adalah menyimpan file gambar tombol tersebut pada hosting untuk menyimpan gambar, bisa di blogger sendiri atau dengan hosting lain. Agar lebih terarah, saya ambil contoh menggunakan hosting lain yaitu www.photobucket.com. Untuk cara upload gambar ke situs ini sudah saya terangkan pada postingan terdahulu, jika ingin baca - baca lagi silahkan klik di sini. Saya ambil contoh kedua tombol tadi sudah saya upload dan mempunyai URL address sebagai berikut :

    http://i162.photobucket.com/albums/t253/rohman24/tombol_03.gif

    http://i162.photobucket.com/albums/t253/rohman24/tombol_06.gif


  • Langkah ketiga adalah memasukan kode JavaScript serta stylesheet CSS pada kode template blog, silahkan ikuti langkah-langkahnya :


    1. Sign in di blogger.com dengan id sobat

    2. Klik menu LayOut

    3. Klik menu Edit HTML

    4. Klik tulisan Download Full Template, lalu save data tersebut. Ini untuk berjaga-jaga apabila terjadi kesalahan dalam mengedit kode template

    5. Klik kotak kecil di samping tulisan Expand Widget Templates untuk memberi tanda centang. Sekali lagi jangan lupa klik kotak kecil di samping tulisan Expand Widget Templates

    6. Tunggu beberapa saat sampai proses selesai

    7. Simpan kode berikut di bawah kode <data:blog.pageTitle/>






    8. Masukan kode berikut di dalam stylesheet CSS, atau untuk lebih mudah silahkan cari kode ]]>, lalu simpan kode berkut di atasnya



    9. .ogah{
      background-image:url('http://i162.photobucket.com/albums/t253/rohman24/tombol_03.gif');
      text-align:center;
      width:90%;
      font-family: georgia, Helvetica, sans-serif;
      padding-left:20px;
      padding-right:20px;
      padding-top:10px;
      padding-bottom: 10px;
      display:block;
      text-decoration: none;
      color: #000000;
      height: 20px;
      }

      .ogahniye{
      background-image: url('http://i162.photobucket.com/albums/t253/rohman24/tombol_06.gif');
      text-align:center;
      width:90%;
      font-family: georgia, Helvetica, sans-serif;
      padding-left:20px;
      padding-right:20px;
      padding-top:13px;
      padding-bottom: 10px;
      display:block;
      text-decoration: none;
      color: #000000;
      height: 20px;
      }

      .hide{
      display: none;
      }

      .show{
      display: block;
      }


      a{cursor: hand}



    10. Klik tombol SAVE TEMPLATE


    11. Sedikit unek-unek, kode-kode diatas tentunya tidak seratus persen mutlak harus begitu, tapi bisa di sesuaikan dengan kondisi blog sobat.Contoh : width:90%; --> angka "90" artinya lebar dari gambar yang akan tampil sebesar 90%, nilai ini bisa diganti dan di sesuaikan dengan blog sobat, misal di ganti menjadi "80" atau berapa saja.


    12. Klik menu Page Elements

    13. Klik tulisan Add a Page Element


    14. Klik tulisan ADD TO BLOG di bawah tulisan HTML/JavaScript

    15. Masukan kode berikut :


    16. Menu utama 1

      Menu utama 2

      Menu utama 3

      Menu utama 4



    17. Klik tombol SAVE CHANGES

    18. Klik pada element yang baru di buat, tahan lalu pindahkan di tempat yang di sukai ( di drag & drop )

    19. Klik tombol SAVE

    20. Selesai



    Keterangan : pada kode diatas ada tanda pagar (#), tanda itu harus di ganti dengan URL yang mau di pasang.


    Jika di lihat dari reaksi menu ini yang bersifat membuka dan menekan isi yang ada di bawahnya, maka menu ini hanya cocok di simpan pada sidebar dan tidak cocok apabila di simpan pada header.


    Mudah-mudahan dapat di mengerti. Selamat mencoba !

    40. Membuat Link Untuk Download

    Sobat Saiman beberapa waktu yang lalu mengajukan sebuah pertanyaan yang di tulis pada shoutbox, beliau menanyakan tentang cara memasang artikel atau file exe di blog agar bisa di download orang lain. Sepengetahuan saya yang terbatas ini, di dalam blog tidak bisa untuk menyimpan file exe kemudian bisa di download oleh orang lain, akan tetapi walaupun begitu ada cara lain yang bisa kita tempuh yakni menggunakan jasa situs-situs yang ada di internet yang menyediakan space untuk upload file yang kita punyai dan kemudian bisa di download lagi oleh orang lain.

    Secara sederhana saya jabarkan cara kerjanya, pertama tentu saja kita harus mempunyai account pada situs tersebut, kemudian setelah mempunyai account, baru kita upload data yang ingin kita simpan, lalu setelah proses upload berhasil kita akan di beri URL address file yang kita upload. Nah langkah terakhir agar pengunjung dari blog kita bisa mendownload file tersebut adalah memasang tulisan yang mempunyai link terhadap URL address file yang kita upload tadi, jadi tentu saja orang lain bisa mendownload file yang kita pasang melalui blog kita. Kira-kira begitu bos .

    Agar tidak terlalu bingung, penyedia layanan ini salah satunya adalah www.SnapDrive.net. dengan menggunakan situs ini kita bisa upload file kemudian file tersebut bisa di download lagi oleh orang lain. Untuk caranya silahkan ikuti langkah-langkah berikut ini :

    1. Silahkan klik di sini untuk menuju http://www.SnapDrive.net

    2. Klik tulisan Register

    3. Isi formulir yang disediakan dengan data diri sobat

      • Username --> isi dengan nama yang ingin sobat gunakan, boleh apa saja yang penting mudah di ingat. contoh : Unyil

      • Password --> isi dengan password yang di inginkan. contoh : pakraden

      • Confirm password --> isi kembali dengan password yang tadi di tuliskan.contoh : pakraden

      • Email address --> isi dengan alamat email sobat, tentunya yang masih valid. contoh : amn_tea@yahoo.co.id

      • First name -->isi dengan nama depan sobat

      • Last name --> isi dengan nama belakang sobat

      • Country --> pilih nama negara dimana sobat tinggal. contoh : indonesia

      • Postcode --> isi dengan kode post daerah sobat

      • Gender --> pilih sesuai dengan jenis kelamin sobat. male(pria), female(wanita)

      • Date of birth --> pilih tanggal kelahiran sobat

      • Preferances isi dengan tulisan yang tertera di situ

    4. Klik tombol Register

    5. Ada konfirmasi bahwa account yang baru di buat harus di aktifkan melalui email yang kita tulis tadi

    6. Cek email milik sobat yang tadi ditulis, periksa apakah email dari Snapdrive sudah sampai atau belum

    7. Jika email sudah sampai, silahkan buka email tersebut. Isi di dalam email tersebut ada yang berupa link untuk aktifasi, klik saja link tersebut

    8. Secara otomatis sobat akan dibawa kehalaman yang berisi ucapan terima kasih

    9. Klik tombol OK

    10. Silahkan Login dengan username serta password yang tadi di tuliskan saat register

    11. Setelah berada di halaman account sobat, klik tulisan Upload

    12. Klik tombol Add Files

    13. Pilih file yang ada dikomputer sobat yang mau di upload

    14. Klik tombol Upload. tunggu beberapa saat ketika proses upload file sedang berlangsung

    15. Jika proses upload selesai, sobat akan diperlihatkan file yang di upload tadi. Klik tulisan details yang ada disebelahnya

    16. Klik tulisan HTML Code

    17. Copy kode yang di berikan lalu paste pada program notepad

    18. Klik tulisan Logout untuk keluar dari situs tersebut

    19. Silahkan tutup layar browser sobat



    Langkah selanjutnya adalah memasukan kode tadi ke dalam blog kita, saya ambil contoh kode yang sudah di upload seperti ini :


    billing internet.zip



    Kode ini merupakan kode link biasa, jadi tentunya tidak mutlak. Kata billing internet.zip, bisa kita ganti dengan kata apa saja sekehendak kita. saya ambil contoh kata billing internet.zip di rubah menjadi kata download, maka kode diatas menjadi seperti di bawah ini :


    download


    Bagaimana cara memasukan kode diatas? tentu saja terserah sobat mau di tempatkan dimana saja, mau di sidebar, footer, atau bahkan di dalam postingan pun bisa. Saya ambil contoh didalam postingan isinya seperti ini :

    Untuk men download program billing internet, silahkan anda klik link di bawah ini :



    download


    Maka nanti di blog kita akan tampil seperti ini :


    Untuk men download program billing internet, silahkan anda klik link di bawah ini :

    download


    Contoh link yang saya buat diatas adalah link yang benar-benar nyata untuk mendownload program billing internet, silahkan sobat klik untuk membuktikannya!


    Saya kira sudah cukup pembahasan tentang cara membuat link download, mudah-mudahan dapat di mengerti. Selamat mencoba !

    39. Membuat Penggalan Artikel

    Menanggapi pertanyaan sobat tanggo yang menanyakan perihal penggalan artikel dari rubrik elektronik yang katanya selalu muncul di atas posting artikel, maka dari itu kali ini saya akan membahas cara pembuatannya, barangkali ada dari sobat-sobat lainnya sama-sama tertarik atau kalau tidak tertarik, ya sekedar pengetahuan saja juga tidak ada ruginya kan.

    Sebenarnya penggalan artikel di atas adalah bukanlah suatu tulisan hasil posting, akan tetapi hanya berupa tulisan biasa yang ujung kalimatnya di beri link untuk menuju ke artikel sebenarnya yakni artikel yang terdapat pada blog rubrik elektronik. Maksud pemasangan penggalan kalimat itu sebenarnya untuk membawa para pembaca ke blog saya yang satu lagi yaitu Rubrik Elektronik tadi, soalnya itu blog kan ada iklan google adsense nya, nah barangkali saja ada diantara para sobat sekalian yang mau berbaik hati meng klik iklan google adsense milik saya cuma hiks.... hiks masih dikit yang mau klik iklan aku tapi ga apa-apa berarti belum rezekinya (berarti ga ikhlas donk bikin tutorialnya kalo gitu / weith..... maaf bukan begitu maksud saya, jadi ga enak hati nih ).

    Untuk membuat penggalan artikel seperti diatas, langkah pertama adalah mengcopy sebagian kalimat yang mau kita link, yang kedua adalah mencatat address dari artikel tersebut, nah ujung dari kalimat tersebut kita buatkan link. Agar tidak terlalu membingungkan saya beri contoh. Misalkan address dari artikel yang mau saya pasang linknya adalah sebagai berikut :

    http://rubrik-elektronik.blogspot.com/2007/04/electronic-shopping.html

    Isi dari penggalan kalimatnya adalah sebagai berikut :

    Electronic Shopping

    Many Indonesians were still believing that products that in marketed overseas his quality was far more better than products that in marketed in the country. Around them many that were deliberate went overseas only a to shop. You some among them?



    Maka kode yang kita buat adalah sebagai berikut :


    Electronic Shopping




    Many Indonesians were still believing that products that in marketed overseas his quality was far more better than products that in marketed in the country. Around them many that were deliberate went overseas only a to shop. You some among them? ...Read more...





    Kode tersebut hasilnya akan seperti ini :


    Electronic Shopping

    Many Indonesians were still believing that products that in marketed overseas his quality was far more better than products that in marketed in the country. Around them many that were deliberate went overseas only a to shop. You some among them? ...Read more...


    Biar lebih faham, sedikit saya uraikan :

    ..... --> ini adalah kode untuk merubah warna text. #FD8403 merupakan kode warna orange.
    .......< --> ini adalah kode untuk menampilkan huruf dalam ukuran font 6 (ukuran besar)

    --> ini adalah kode untuk membuat garis sebesar 100% dari lebarnya halaman blog yang dimulai dari tepi kiri.

    --> kode untuk membuat suatu kalimat pindah ke bawah sebesar satu line break.


    Mudah-mudahan keterangan diatas dapat di pahami. Setelah kita membuat kode seperti yang di terangkan diatas, tugas selanjutnya yaitu memasukan kode tersebut kedalam blog. Tentunya ada perbedaan cara memasukan kode antara template klasik dengan template baru. Silahkan ikuti langkah-langkahnya :

    Untuk template klasik :

  • Sign in di blogger dengan id sobat

  • Klik menu Template

  • Klik menu Edit HTML

  • Copy seluruh kode HTML yang ada, kemudian save di komputer sobat. Ini untuk backup data apabila terjadi kesalahan dalam proses editting template

  • Cari kode seperti di bawah ini :





  • Tempatkan kode yang telah kita buat tadi persis diatas kode diatas, sehingga kodenya menjadi :


    Electronic Shopping




    Many Indonesians were still believing that products that in marketed overseas his quality was far more better than products that in marketed in the country. Around them many that were deliberate went overseas only a to shop. You some among them? ...Read more...







  • Klik tombol Preview untuk melihat perubahan yang baru di lakukan

  • Apabila sudah OK, klik tombol save Template Changes

  • Selesai.


  • Catatan : cara di atas tentunya merujuk kepada template asli buatan blogger.com, bagi pengguna template bukan buatan blogger tentu akan lain, yang perlu di ingat yaitu penempatan kode penggalan artikel adalah persis diatas kode untuk Posting artikel.


    Untuk template baru :

  • Sign In di blogger dengan id sobat

  • Klik menu Layout

  • Klik menu Page Elements

  • Klik Add a Page Element

  • Klik tulisan ADD TO BLOG yang berada di bawah tulisan HTML/JavaScript

  • Copy paste kode penggalan artikel yang telah kita buat tadi

  • Klik tombol SAVE CHANGES

  • Klik kotak element yang baru di buat, tahan kemudian pindahkan di atas kotak yang bertuliskan Blog post (di drag & drop)

  • Klik tulisan View Blog untuk melihat hasil dari penambahan kode tadi

  • Bila sudah OK, klik tombol SAVE

  • Selesai.



  • Bagaimana penjelasannya sobat? mudah-mudahan dapat di pahami. Selamat mencoba !