Selasa, 15 Mei 2012

Ada Video di artikel

Memuat video diantara artikel, selain untuk memperindah artikel itu sendiri, juga video ini bisa berfungsi sebagai media yang efektif dalam menyampaikan sesuatu kepada para pengunjung. Terlebih apabila anda merupakan seorang pebisnis yang dengan video ini dapat lebih memperjelas tujuan anda di banding dengan hanya sebuah tulisan. dibawah ini adalah contoh sederhana dari video , silahkan anda klik tombol icon Play untuk mengaftifkannya.





Untuk membuat sebuah video, kita bisa menggunakan situs layanan pembuatan video, salah satunya adalah http://www.youtube.com. Ikuti langkah-langkah berikut ini :

  1. Untuk daftar silahkan kunjungi http://www.youtube.com
  2. Setelah berada di situs tersebut, klik tulisan Sign Up yang berada pada layar bagian atas
  3. Isi semua data diri anda pada form yang di sediakan, jangan lupa beri tanda tik/cek pada kotak di samping tulisan  »»  Sign me up for the "Broadcast Yourself" email - I agree to the terms of use and privacy policy. lalu klik tombol Sign Up
  4. Setelah berhasil, anda diminta untuk veryfikasi, silahkan cek email yang anda daftarkan tadi untuk melakukan veryfikasi
  5. Jika email dari youtube.com sudah masuk, silahkan buka lalu klik tulisan Confirm your email addres
  6. Dengan meng klik tulisan tadi, secara otomatis anda sudah masuk kedalam halaman account anda dan siap untuk upload video
  7. Klik tulisan Upload Video yang berada pada layar sebelah atas
  8. Isi form yang di sediakan
  9. Klik tombol bertuliskan Continue Uploading
  10. Klik tombol Browse, masukan file video yang ingin anda masukan
  11. Beri tanda tik/cek pada radio button, public  »»  jika video anda bisa dilihat oleh umum. Private  »»  Jika video anda bersifat pribadi yang hanya bisa di lihat oleh orang yang anda tunjuk
  12. Klik tombol Upload Video, tunggu beberapa saat sampai proses upload selesai
  13. Setelah proses upload selesai, anda tinggal mengcopy kode HTML yang di berikan. lalu paste pada Notepad
  14. Silahkan klik Log Out untuk keluar dari situs tersebut
  15. Selesai. anda sudah mempunyai video yang bisa di simpan pada artikel anda



Untuk memasukan kode video yang telah anda copy tadi, caranya yaitu anda tinggal posting artikel seperti biasa lalu sisipkan kode tersebut pada tempat yang anda inginkan. Cuma saat copy n' paste kode tersebut posisi posting harus pada Edit HTML jangan pada posisi Compose. Jika sudah selesai memasukan artikel, Tinggal klik Publish dan video anda siap di lihat oleh para pengunjung blog anda.

Selamat mencoba !

Pasang Icon Yahoo ! Messenger

Menanggapi pertanyaan sobat takdir yang di ajukan melalui shoutbox beberapa waktu yang lalu, beliau menanyakan tentang bagaimana cara menampilkan status online Yahoo ! Messenger pada halaman blog. Barangkali ada di antara para sobat juga berkeinginan yang sama namun belum mengetahui caranya,ada baiknya menyimak beberapa penjelasan yang akan saya utarakan.

Sebenarnya jika saya pikir-pikir, kayanya agak merasa malu menerangkan ini, mungkin bagi para sobat yang sudah beberapa kali mengunjungi blog ini hampir atau bahkan belum pernah melihat Icon Yahoo ! Messenger saya menyala tanda sedang online chatting. Memang benar saya sangat jarang sekali ber chatting ria di dunia maya, paling-paling kalau ada perlu dan itupun janjian terlebih dahulu baru saya chatting (lho ko jadi cerita...kelamaan), oh iya lupa

Untuk menampilkan icon status online yahoo ! messenger, kita bisa memilih sebanyak 5 pilihan, yakni style id 1, style id 2, style id 3, style id 4, serta style id 5, Apa perbedaan dari style id ini? perbedaannya adalah ukuran dari icon itu sendiri, untuk melihat perbedaan style id, silahkan sobat perhatikan gambar berikut :



Style ID 1                      Style ID 2                       Style ID 3         Style ID 4     Style ID 5






masing-masing gambar mempunyai URL adddress sendiri yaitu :

http://opi.yahoo.com/online?u=YahooID&m=g&t=1
Untuk Style ID 1

http://opi.yahoo.com/online?u=YahooID&m=g&t=2
Untuk Style ID 2

http://opi.yahoo.com/online?u=YahooID&m=g&t=3
Untuk Style ID 3

http://opi.yahoo.com/online?u=YahooID&m=g&t=4
Untuk Style ID 4

http://opi.yahoo.com/online?u=YahooID&m=g&t=5
Untuk Style ID 5



itu tadi adalah URL address masing-masing Style ID, maka agar tampil menjadi gambar, kita harus menambah kode yaitu :

<img src="URL address">

Sehingga untuk menampilkan URL address di atas menjadi sebuah gambar, maka kodenya akan seperti ini :

<img src="http://opi.yahoo.com/online?u=YahooID&m=g&t=1" border="0">
Untuk Style ID 1

<img src="http://opi.yahoo.com/online?u=YahooID&m=g&t=2" border="0">
Untuk Style ID 2

<img src="http://opi.yahoo.com/online?u=YahooID&m=g&t=3" border="0">
Untuk Style ID 3

<img src="http://opi.yahoo.com/online?u=YahooID&m=g&t=4" border="0">
Untuk Style ID 4

<img src="http://opi.yahoo.com/online?u=YahooID&m=g&t=5" border="0">
Untuk Style ID 5



Penambahan kode border="0", agar gambar yang di hasilkan terhindar dari adanya garis tepi atau bingkai. Tapi tentu saja kode diatas adalah hanya untuk menampilkan gambar icon YM nya dan belum bisa bereaksi walaupun sudah di klik oleh para pengunjung.

Ada beberapa pilihan yang bisa kita terapkan ketika pengunjung mengklik icon YM kita, yaitu :


Kirim Instant Messenger.

Kodenya sebagai berikut :

<a href="ymsgr:sendIM?YOURID">Kirim IM</a>

Sehingga untuk kode lengkapnya jadi seperti ini :

<a href="ymsgr:sendIM?YOURID"><img src="http://opi.yahoo.com/online?u=YourID&m=g&t=StyleID" border="0"></a>




Kirim Instant Messenger dengan pesan

Kodenya sebagai berikut :

<a href="ymsgr:sendIM?YOURID&m=YOUR+MESSAGE">Kirim IM</a>

Sehingga untuk kode lengkapnya jadi seperti ini :

<a href="ymsgr:sendIM?YOURID&m=YOUR+MESSAGE"><img src="http://opi.yahoo.com/online?u=YourID&m=g&t=StyleID" border="0"></a>


Menambahkan link ke chat room favorit

Kodenya sebagai berikut :

<a href="ymsgr:addfriend?YOURID">Masukan ke daftar teman sobat</a>

Sehingga untuk kode lengkapnya jadi seperti ini :

<a href="ymsgr:addfriend?YOURID"><img src="http://opi.yahoo.com/online?u=YourID&m=g&t=StyleID" border="0"></a>

Bagaimana jelaskan? biar lebih jelas lagi saya beri contoh.


Karena email saya adalah amn_tea@yahoo.co.id maka id saya adalah amn_tea, Sehingga kode untuk mengirimkan Instan Message dengan pilihan Style ID 2 adalah sebagai berikut :


<a href="ymsgr:sendIM?amn_tea"><img src="http://opi.yahoo.com/online?u=amn_tea&m=g&t=2" border="0"></a>


dan yang akan tampil seperti ini :







Icon di atas benar-benar Live, jadi tentunya icon nya akan menyala apabila saya sedang online di Yahoo ! Messenger .


Mudah-mudahan jelas. Selamat mencoba !

Pasang Image pada judul Artikel

Image. Kalau berbicara masalah image/gambar, memang sangat seru dan menyenangkan. Dengan adanya image maka blog kita akan tampil lebih menarik untuk di lihat,walaupun tentusaja apabila berlebihan akan berakibat buruk yaitu blog kita akan susah untuk di aksesoleh para pengunjung karena beban kapasitas data yang berlebihan dan bila itu terjadi maka para pengunjung akan menjadi malas untuk berkunjung. Memang segala sesuatu kalau berlebihan akan berakibat tidak baik, jalan keluarnya ya wajar-wajar saja Re....

Ok sobat, biar ga terlalu banyak berimpropisasi, langsung saja pada topik bahasan. topik yang akan kita bicarakan saat ini yaitu memasang image/gambar pada judul artikel. Artikel ini saya buat bagi yang senang akan pernak-pernik gambar,bagi yang tidak senang, ya sebagai pengetahuan saja lah.

Untuk memasang sebuah image pada judul artikel, ada beberapa tahapan yang harus dilakukan, antara lain :


  • Langkah pertama



  • Langkah pertama yang harus dilakukan adalah membuat image ataupun logo yang di inginkan. jika sobat mahir dalam program grafik & design semisal adobe photoshop ataupun coreldraw, ya tinggal buat saja yang nyentrik. Tapi kalau tidak bisa atau males bisa gunakan layanan di internet, ini sudah saya bahas pada artikel terdahulu, silahkan klik disini untuk membacanya kembali.


  • Langkah kedua



  • langkah kedua yaitu sobat harus upload image atau logo tersebut, bisa ke blogger ataupun ke hosting lain. Misalkan biasanya saya menyimpan setiap image yang saya punya di www.Photobucket.com untuk masalah upload gambarpun sudah saya bahas pada postingan yang lalu, kalau mau baca-baca lagi silahkan klik di sini.


  • Langkah ketiga



  • langkah ketiga adalah mengatur ukuran dari image tersebut agar sesuai dengan yang di inginkan, karena jika terlalu besar atau terlalu kecil maka tentu saja akan tidak enak dipandang mata. Misalkan saya mempunyai URL image seperti ini :

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

    Sebagaimana kita ketahui untuk membuat sebuah image bisa online maka kita tambahkan kode :

    <img src="URL image">

    Sehingga kodenya akan jadi seperti ini :

    <img src="http://i162.photobucket.com/albums/t253/rohman24/kupu2.gif">

    dan yang akan tampil adalah image dengan ukuran yang sebenarnya. contoh image tersebut adalah seperti ini :







    tentu saja bila kita memajang image sesuai ukuran image yang aslinya, ini menjadi kurang enak di lihat jika di padukan dengan tulisan judul posting. Untuk mengakalinya kita bisa menambahkan beberapa atribut kedalam kode image tersebut, antara lain atribut width="..." untuk lebar, height="..." untuk tinggi, dan border="..." untuk bingkai, dan dalam hal ini yang dipakai adalah border dengan nilai 0 (nol) agar terhindar dari setting template yang memakai nilai border. Saya ambil contoh kode image tadi jadi seperti ini :

    <img src="http://i162.photobucket.com/albums/t253/rohman24/kupu2.gif" width="45" hight="45" border="0">

    sehingga image yang tadi akan berubah jadi seperti ini :







    Bagaimana sudah jelaskan cara merubah ukuran gambar? jika sudah, kita beranjak ke langkah selanjutnya.


  • Langkah keempat



  • langkah keempat yaitu memasukan kode gambar yang sudah kita modifikasi tadi ke dalam kode template blog milik kita. Silahkan ikuti langkah-langkah berikut ini :

    Untuk yang memakai template klasik :

    1. Sign in ke blogger dengan id sobat
    2. Klik menu Template
    3. Klik menu Edit HTML
    4. Copy 'n paste seluruh kode HTML ke dalam notepad, ini dimaksudkan untuk mengurangi resiko apabila terjadi kesalahan pada saat kita melakukan editting kode template
    5. Cari kode berikut pada kode HTML sobat :
    6. <$BlogItemTitle$> cara yang mudah untuk menemukan kode tersebut adalah : klik menu Edit yang berada bar menu browser lalu klik Find kemudian tuliskan kode diatas tadi lalu klik tombol Find, maka secara otomatis kita akan langsung di bawa ke tulisan kode tadi. Nah kode <$BlogItemTitle$> adalah merupakan kode untuk menampilkan judul postingan, maka kita harus menyimpan kode image yang kita miliki di dekatnya, bisa sebelum atau sesudahnya tergantung dari keinginan kita. Tentunya bila di simpan sebelum kode judul posting maka image pun akan muncul sebelum judul posting, jika di simpan sesudah kode judul posting sudah barang tentu image pun akan muncul sesudah tulisan judul. Saya ambil contoh kode image di simpan sebelum tulisan judul : <img src="http://i162.photobucket.com/albums/t253/rohman24/kupu2.gif" width="45" hight="45" border="0">&nbsp;&nbsp;<$BlogItemTitle$> pemasangn kode &nbsp;&nbsp; adalah untuk memberi jarak spasi antara image dengan tulisan judul, sebab jika tidak menambahkan kode &nbsp; maka image dengan tulisan akan bersatu walaupun kode image dengan kode judul di tulis ada jarak spasinya.
    7. Klik tombol Preview untuk melihat perubahan yang dilakukan
    8. Jika sudah OK, klik tombol Save Settings
    9. Selesai


    Maka setiap sobat posting artikel, secara otomatis image yang kita pasang tadi akan muncul tanpa harus di tuliskan kembali. Untuk contoh nyata silahkan lihat judul postingan ini.



    Untuk yang memakai templat baru :

    Catatan awal bagi yang memakai template baru yaitu setiap tag yang kita pakai harus selalu di tutup tidak seperti template klasik, contoh kode gambar yang tadi kita pakai adalah :

    <img src="http://i162.photobucket.com/albums/t253/rohman24/kupu2.gif" width="45" hight="45" border="0">

    kode image tersebut tag nya harus ditutup dengan tag penutup :

    </img>

    Sehingga kode image jadi bertambah menjadi :

    <img src="http://i162.photobucket.com/albums/t253/rohman24/kupu2.gif" width="45" hight="45" border="0"></img>


    Untuk memasukan kode gambar yang sudah di tambahi tag penutup tadi, silahkan ikuti langkah berikut :

    1. Sign in ke blogger dengan id sobat
    2. Klik menu Layout
    3. Klik menu Edit HTML
    4. Klik tulisan Download Full Template
    5. Silahkan save dulu template sobat, ini untuk back up data apabila terjadi kesalahan editting
    6. Beri tanda centang pada kotak disamping tulisan Expand Widget Templates. Sekali lagi jangan lupa beri tanda centang, sebab kalau tidak, nanti tidak akan sesuai dengan langkah selanjutnya
    7. Tunggu beberapa saat sampai proses selesai
    8. Cari kode berikut pada template sobat :
    9. <a expr:href='data:post.url'><data:post.title/></a> <b:else/>
    10. Sisipkan kode gambar yang kita miliki diantara kode :
    11. <a expr:href='data:post.url'> dan kode <data:post.title/></a> <b:else/> Sehingga bila di satukan kodenya menjadi : <a expr:href='data:post.url'> <img src="http://i162.photobucket.com/albums/t253/rohman24/kupu2.gif" width="45" hight="45" border="0"></img> &nbsp;&nbsp;<data:post.title/></a> <b:else/>
    12. Klik tombol PREVIEW untuk melihat perubahan
    13. bila sudah OK, klik tombol SAVE TEMPLATE
    14. Selesai




    Untuk melihat contoh template baru yang memakai image pada judul postingan, silahkan klik di sini :


    Bagaimana sudah di coba? mudah-mudahan saja berhasil. Selamat mencoba

    Blogroll Alternatif

    Judulnya lucu ya, kaya pengobatan saja pake kata altenatif segala, pengobatan alternatif kalee..

    Baiklah para sobat semua, dalam kesempatan kali ini saya akan membicarakan tentang yang namanya Blogroll.

    Apa itu Blogroll?

    Blogroll atau di sebut juga Link Exchange atau kata orang bandung sih tukeran link antar blog atau website adalah menyimpan link address milik orang lain pada blog/website milik kita.

    Apa manfaat dari blogroll?

    Mungkin secara sekilas para sobat berpikir bahwa memasang link address milik orang lain pada blog/website milik kita akan merugikan, sebab dengan itu tentu saja kita memberikan jalan kepada para pengunjung untuk meninggalkan blog kita. Alasan itu mungkin ada benarnya, akan tetapi tidak seutuhnya benar. Dengan adanya blogroll banyak sekali manfaat yang kita dapatkan, antara lain yaitu mempererat tali silaturahmi atau tali persaudaraan diantara pemilik blog/website. selain itu semakin banyak blog kita di link oleh blog lain maka semakin baik pula posisi rangking blog kita pada Search Engine semacam Google, Yahoo, Msn serta teman-temannya. Tentu saja sama-sama kita ketahui bahwa setiap pemilik blog/website berkeinginan bahwa blog/website miliknya mempunyai rangking yang baik pada search engine. Makanya budayakan tukeran link jangan pelit, karena kalau kita pelit memberi link ya tentu saja tidak akan ada yang mau pasang link addres milik kita pada blog mereka.

    Terus apa hubungannya dengan judul di atas?

    Oh iya ke asyikan bercerita jadi lupa pada topik bahasan. OK kita kembali ke lap....top (yeee..ngekor ama tukul) eh topik bahasan. Bagi para sobat yang baru membuat blog dan baru memiliki blogroll hanya beberapa saja mungkin tulisan ini tidak terlalu bermanfaat, tapi mungkin barangkali nanti setelah link sobat jumlahnya sampai ratusan atau bahkan ribuan informasi ini bisa jadi bermanfaat. Memang seperti yang tadi saya katakan di awal bahwa bertukar link atau link Exchange sangat bermanfaat, tapi...ada tapinya nie sobat..kalo link sobat sudah mencapai ratusan atau bahkan ribuan tentu saja akan menemui masalah, yaitu tentu saja link ini akan memakan tempat yang banyak dan jadi tidak enak untuk di pandang mata para pengunjung. Nah jika sobat mempunyai masalah demikian, maka saya akan memberikan beberapa alternatif jalan keluarnya (tuh kan jadi nyambung, keluar juga kata alternatif nya). Yaitu antara lain :

  • Blogroll dengan marquee



  • yang paling banyak di gunakan oleh para blogger untuk menghemat space pada blog adalah dengan menggunakan perintah marquee.

    Contoh membuat blogroll dengan perintah marquee :

    <marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="200" >

    <a href="http://rubrik-elektronik.blogspot.com" target="_blank">Rubrik Elektronik</a>
    <br/><br/>
    <a href="http://user-online.blogspot.com" target="_blank">User Online</a>
    <br/><br/>
    <a href="http://rohman-freeblogtemplate.blogspot.com" target="_blank">free Blog Template</a>
    <br/><br/>
    <a href="http://kolom-authorized.blogspot.com" target="_blank">Authorize service</a>
    <br/><br/>
    <a href="http://contoh-blog.blogspot.com/" target="_blank">Blog D'Tree</a>
    <br/><br/>

    </marquee>




    Maka nanti yang akan tampil pada blog kita adalah seperti ini :


    User Online

    free Blog Template

    Authorize service

    Blog D'Tree





    Sedikit clue biar agak jelas. Kode diatas tidak baku harus di tuliskan persis seperti di atas, tapi bisa di sesuaikan dengan kondisi dan keinginan sobat. Kode yang bisa di rubah adalah :

    scrollamount="2" --> angka "2" adalah menunjukan kecepatan gerakan, jika ingin lebih cepat silahkan ganti nilainya dengan yang lebih tinggi. Misal : scrollamount="3" ,scrollamount="4" , scrollamount="5"

    direction="up" --> tulisan "up" menunjukan arah gerakan keatas, kalau ingin di rubah tinggal ganti kata "up" menjadi "down,left,right" . Misal : direction="down" , direction="left" , direction="right" .

    width="50%" --> tulisan "50%" menunjukan lebar dari marquee sebesar "50%" dari tempat dimana perintah ini ditempatkan, jika ingin di rubah tinggal ganti dengan nilai yang di inginkan. contoh : width="30%" , width="70%" , width="100%"

    height="200" --> tulisan "200" menunjukan tinggi dari marquee sebesar 200px, jika ingin di ganti tinggal di rubah nilai angkanya. Misal : height="100" , height="300" , height="400" , height="250" .



    Ada variasi lain, yaitu dengan memakai tabel, contoh :

    <table border="3" width="155" height="130" cellpadding="2">

    <tr>

    <td align="left">

    <marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="200" >

    <a href="http://rubrik-elektronik.blogspot.com" target="_blank">Rubrik Elektronik</a>
    <br/><br/>
    <a href="http://user-online.blogspot.com" target="_blank">User Online</a>
    <br/><br/>
    <a href="http://rohman-freeblogtemplate.blogspot.com" target="_blank">free Blog Template</a>
    <br/><br/>
    <a href="http://kolom-authorized.blogspot.com" target="_blank">Authorize service</a>
    <br/><br/>
    <a href="http://contoh-blog.blogspot.com/" target="_blank">Blog D'Tree</a>
    <br/><br/>

    </marquee>

    </td>

    </tr>

    </table>




    Maka hasilnya akan seperti di bawah ini :




    User Online

    free Blog Template

    Authorize service

    Blog D'Tree





  • Blogroll dengan menu dropdown




  • Untuk membuat blogroll pada menu dropdown, silahkan lihat contoh di bawah :


    <form>

    <select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu>

    <option> - Blogroll - </option>

    <option value="http://rubrik-elektronik.blogspot.com">Rubrik elektronik</option>

    <option value="http://user-online.blogspot.com">User Online</option>

    <option value="http://rohman-freeblogtemplate.blogspot.com">free blog template</option>

    <option value="http://kolom-authorized.blogspot.com">Authorize service</option>

    <option value="http://contoh-blog.blogspot.com/">Blog D'tree</option>

    </select>

    </form>


    Hasilnya akan seperti ini, silahkan klik pada menu dropdownnya :






    Contoh variasi lainnya :


    <h3> Blogroll </h3>

    <div align="left">

    <select style size=5="font-weight: normal; font-size: 13px; width="135"; font-family: Verdana,Tahoma,Arial; background-color: rgb(229, 229, 229);" onchange="window.open(this.options[this.selectedIndex].value,'_blank')" size="1" name="menu">

    <option style="font-weight: normal; font-size: 11px; color: rgb(204, 204, 204); font-family: Verdana,Tahoma,Arial;" value="" selected="selected">--Teman-temanku--</option>

    <option value="http://rubrik-elektronik.blogspot.com">rubrik Elektronik</option>

    <option value="http://user-online.blogspot.com">User Online</option>

    <option value="http://rohman-freeblogtemplate.blogspot.com">Free blog template</option>

    <option value="http://kolom-authorized.blogspot.com">Authorized Service</option>

    <option value="http://contoh-blog.blogspot.com/" target="_blank">Blog D'Tree</option>

    </select>

    </form> </div>




    Hasilnya akan seperti ini :



    Blogroll





    Sedikit clue, kata left yang berada pada kode <div align="left"> menunjukan bahwa menu ini akan di simpan di sebelah kiri, jika mau di rubah tinggal ganti saja dengan kata "center" atau "right".



    Dan masih banyak lagi alternatif lainnya, cuma kayanya terlalu panjang nih, cukup sekian dulu yah, untuk contoh lainnya mudah-mudahan ada sambungannya. Eh lupa, untuk cara memasukan kode HTML di atas pada blog milik sobat, silahkan simak di sini. Selamat mencoba !

    User Online Status

    english  English Version

    How many people is online at your blog? you know that or don't? If you don't know how many people is online at your blog, you can use a free tracker to know it. That is much site provide this service. Once of them is www.histats.com. If you use them tool, you can know how many people online at your blog, how many people was visited to your blog, and any function. This is once of example :

    histat.jpg


    How to get it? please following the steps :

    1. Please visit www.histats.com.
    2. If you was on the histats site, click Register at the top tab.
    3. Content the form with your information, such as email, password, your blog url and etc.
    4. Click Continue button.
    5. Choose the style of histats counter, click Choose a counter from this category.
    6. Please mark the radio button beside the counter style you wanted.
    7. Click Continue button at the bottom of page.
    8. Click at the drop down menu, choose the category which to display at your counter. the choice is : visitor today, Page views today, User online, Total visitors, and total page views. Choose empty if you want not to display them.
    9. Click Continue button.
    10. Wait a moment, your counter is updating.
    11. Until the process is done, copy your counter code and paste to the Notepad or other text editor. Save into your computer.
    12. Logout and close your internet browser.
    13. Done. Now you has have a counter code to add at your blog.



    Next step is add your counter code to your blog, please following the steps :

    1. Login to blogger with your ID.
    2. After entering the dasboard page , click Layout.
    3. Click at Page Element tab. See the picture below :
    4. page element
    5. Click at Add a Page element.
    6. After emerging pop up window , Klik add to blog button for the things HTML/JavaScript. See the picture following :
    7. javascript
    8. Open your Counter code, copy and then paste into available column.
    9. Click   save changes   
    10. Done. Please see the result.

    Now you have a Counter, and you will know how many people online at your blog.

    If you don't like with this counter, you can get at the other site, this is several site provide the same service :

    • http://www.neoworx.net
    • http://www.webfooted.net
    • http://www.fastonlineusers.com



    See you next time at my new tips. Happy blogging.

    bahasa indonesia  Versi Bahasa Indonesia

    Berbicara masalah blog tools, kayanya saya jarang sekali membahasnya. Dari sekian banyak artikel yang telah saya posting, tercatat baru dua artikel yang membahas tentang blog tools. Untuk itu dalam postingan kali ini akan di bahas salah satu blog tools yang banyak di gunakan oleh para blogger yakni tool untuk mengetahui berapa banyak pengguna/user yang sedang online pada blog milik kita.

    Disamping berfungsi sebagai blog tools, tool ini berfungsi juga sebagai aksesori blog yaitu untuk menghiasi halaman blog milik kita agar tampak lebih cantik dan menarik untuk dilihat oleh para pengunjung. Oleh karena alasan tadi banyak penyedia tool ini yang menawarkan tampilan-tampilan yang unik serta menarik di samping fungsi utamanya yakni melacak user yang sedang online di blog kita.

    Ok, biar ga bosan baca intermezo yang terlalu panjang dan garing, langsung saja pada topik bahasan utama.Untuk mendapat tool user online status, salah satunya kita bisa mendapatkan dari www.Geovisite.com, untuk langkah-langkahnya silahkan ikuti langkah berikut :

    1. Silahkan buka www.geovisite.com
    2. Klik tulisan Register yang berada di bawah gambar Geo counter Flash
    3. Tulis alamat email sobat pada kotak kosong di samping tulisan Email
    4. Tulis address blog milik sobat disamping tulisan URL. Contoh : http://rubrik-elektronik.blogspot.com
    5. Tulis kata untuk login di samping tulisan Login (4/12). Contoh : amen24
    6. Tulis password yang di inginkan disamping tulisan password (4/8). Contoh : kinoy
    7. Pilih waktu yang sesuai dengan daerah sobat disamping tulisan Location. contoh :untuk daerah jakarta adalah Asia/Jakarta (GMT+7)
    8. Pilih kategori yang sesuai dengan blog sobat di samping tulisan Category. Contoh : Internet
    9. Pilih bahasa yang sesuai dengan blog sobat di samping tulisan Language of your site. Contoh : English (soalnya kalo indonesia ga ada, belum di akui bo)
    10. Pilih judul blog sobat disamping tulisan Title. Contoh : Rubrik Elektronik
    11. Tulis deskripsi dari blog milik sobat pada kotak di samping tulisan Descriptioan. Contoh : All about Electronic, tips, maintenance, until how to service the equipment of electronic
    12. Klik tombol yang berlogo disket
    13. Copy salah satu kode HTML yang dinginkan, antara lain : GEOGLOBE, GEOCOUNTER, GEOMAP lalu paste pada program notepad
    14. Silahkan close window browser sobat
    15. langkah selanjutnya adalah memasukan kode HTML tersebut pada kode HTML milik sobat, nah untuk langkah ini sudah saya bahas, silahkan klik di sini untuk membacanya
    16. Selesai.



    Agar sobat bisa menentukan pilihan mana yang harus di pilih apakah GEOGLOBE, GEOCOUNTER, atau GEOMAP ? Silahkan klik di sini untuk melihat secara nyata gambar dari ketiga pilihan tadi, tunggu beberapa saat,loadingnya lumayan sedikit lama. Kenapa tidak saya cantumkan di sini,alasannya yaitu agar halaman blog ini tidak terlalu berat untuk di akses makanya sengaja saya pisahkan.

    Sebagai tambahan, situs penyedia yang lainnya sobat bisa kunjungi di :

    • http://www.neoworx.net
    • http://www.webfooted.net
    • http://www.fastonlineusers.com
    • http://www.histats.com



    Selamat menikmati tool baru...

    Blogger sudah support fungsi Readmore

    Untuk melengkapi hadiah perayaan hari ulang tahunnya yang ke 10, kini blogger menambahkan satu tombol yang sangat di tunggu-tunggu oleh ribuan blogger didunia yaitu tombol "Jump Breaks" atau tombol "More" atau tombol "Read more" yang mempunyai fungsi untuk memotong tulisan di halaman depan (home page) atau lebih populer dengan sebutan "fungsi read more".
    read more
    Ini artinya, untuk memotong artikel agar tidak terlalu panjang tampil di halaman depan, anda hanya tinggal klik tombol " Read more" saja dan anda tidak harus repot lagi mengetikkan kode read more hasil hack atau apapun.
    Namun, sepertinya tombol ini hanya muncul pada post editor baru dan dalam posisi mode "Compose" dan tidak muncul pada mode "Edit HTML". Walaupun seperti itu, anda masih tetap bisa menggunakan fungsi "read more" pada post editor lama serta dalam posisi mode "Edit HTML" yaitu dengan mengetikkan secara manual kode    

    <!-- more -->
    edit HTML

    Untuk anda yang memakai template asli yang disediakan blogger akan langsung bisa menikmati fasilitas ini dan hasilnya akan muncul tulisan " Read more » "  seperti ini :
    read more

    Bagi anda yang memakai template bukan yang disediakan oleh blogger atau template hasil download dari situs lain, fungsi "  Read more " akan tetap berfungsi secara baik atau dengan kata lain artikel anda akan tetap terpotong namun tulisan " Read more » " tidak akan muncul. Untuk hal ini anda harus menambahkan kode tambahan pada template anda. Berikut langkah-langkahnya :

    1. Silahkan login ke blogger dengan ID anda.
    2. Klik Tata Letak.
    3. Klik tab Edit HTML.
    4. Beri tanda centang pada kotak kecil di sampil tulisan " Expand Template Widget " expand-template-widget
    5. Carilah kode yang mirip seperti Ini :

      <div class='post-body entry-content'>
            <data:post.body/>
            <div style='clear: both;'/> <!-- clear for photos floats -->
          </div>
    6. Copy lalu paste kode berikut persis di bawah kode yang tadi :
      <b:if cond='data:post.hasJumpLink'>
            <div class='jump-link'>
              <a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a> 
            </div>
          </b:if>

      code
    7. Klik tombol SIMPAN TEMPLATE
    8. Selesai.
    Dengan cara tersebut, tulisan " Read more » " akan muncul walaupun anda tidak menggunakan template yang disediakan oleh blogger.

    Secara default tulisan yang akan muncul adalah " Read more » ", namun anda bisa mengubahnya sesuai keinginan anda, caranya seperti ini :

    1. Silahkan login ke blogger dengan ID anda.
    2. Klik Tata Letak.
    3. Klik tab Elemen Halaman.
    4. Klik "Edit" pada elemen "Posting Blog" atau "Blog post" untuk yang bahasa inggris. posting-blog-element
    5. Setelah muncul jendela baru, gantilah tuisan Read more »  menjadi tulisan sesuai dengan keinginan anda. edit read more
    6. Klik Tombol SIMPAN
    7. Selesai.
    Untuk anda yang menggunakan trik membuat read more seperti yang kang Rohman posting disini! sebaiknya di hilangkan saja karena blogger sekarang sudah mempunyai sistem read more sendiri. Cara mengembalikannya silahkan baca saja trik tersebut secara terbalik yaitu di baca dari bawah ke atas.

    Tutorial HTML (2)

    Melanjutkan posting yang terdahulu setelah terselang oleh beberapa artikel tentang blog tutorial maka kali ini saya akan membahas tentang tutorial HTML kembali.Sebelum menginjak kepada topik bahasan ada baiknya para sobat mengikuti bahasan kali ini dengan langsung memfraktekannya agar lebih cepat mengerti. Caranya siapkan terlebih dahulu program notepadnya lalu tuliskan kode HTML seperti dibawah, kemudian apabila telah selesai mempraktekan simpan file tersebut dengan extensi .htm (dot htm). Contoh file : latihan.htm kemudian jalankan dengan internet explorer. silahkan tulis kode-kode berikut :


    <html> <head>
    <title>latihan</title>
    <body>
    Tulis apa-apa yang saya terangkan di sini !
    </body>
    </html>


    Kita langsung ke topik bahasan aja ya biar ga bosan.

    Elemen dasar HTML

    Ada beberapa elemen dasar HTML yaitu :

    Elemen Blok Level

    Elemen blok level yaitu tingkatan besarnya hurup yang akan di tampilkan pada browser. Elemen blok level yang paling sering di gunakan adalah Heading (h1 sampai h6).Tag heading ini ini berupa <h1>...</h1> sampai dengan <h6>...</h6>.

    Contoh :

    <h1>Ini heading 1</h1>
    <h2>Ini heading 2</h2>
    <h3>Ini heading 3</h3>
    <h4>Ini heading 4</h4>
    <h5>Ini heading 5</h5>
    <h6>Ini heading 6</h6>



    Hasilnya akan seperti ini :


    Ini heading 1



    Ini heading 2

    Ini heading 3

    Ini heading 4
    Ini heading 5

    Ini heading 6



    Sebenarnya ada cara lain untuk menampilkan berbagai ukuran hurup, yakni memakai tag <font size="...">.....</font>.

    Contoh :



    <font size="1">Ini font size 1</font>

    <font size="2">Ini font size 2</font>

    <font size="3">Ini font size 3</font>

    <font size="4">Ini font size 4</font>

    <font size="5">Ini font size 5</font>

    <font size="6">Ini font size 6</font>

    <font size="7">Ini font size 7</font>


    Hasil yang akan tampil seperti ini :



    Ini font size 1

    Ini font size 2

    Ini font size 3

    Ini font size 4

    Ini font size 5

    Ini font size 6

    Ini font size 7


    Itu adalah contoh untuk menampilkan huruf dalam berbagai ukuran.

    Untuk kesempatan kali ini, kaya nya udah dulu sobat soalnya belum mandi nih, mo berangkat kerja       hiii.....pantesan dari tadi ada yang bau aneh  

    Nantikan seri berikutnya!