Memasang Video di posting

Video menjadi alternatif tutorial ataupun media penyampaian yang sangat efektif dibanding kan dengan tulisan (blog ini kan juga penuh tulisan). Tapi untuk menampilkannya gimana yah? Ada yang tau? Ya udah deh, dari pada ga ada yang ngaku mending saya jelaskan gimana cara menampilkan Video yang paling gampang and ga ribet!



Contohnya kayak dibawah ini nih:



Secara sederhana akan saya jelaskan bagaimana cara menampilkan sebuah video di artikel atau pun di side bar. Cukup mudah.
Pertama kita harus mempunyai Link file video yang akan di tampilkan. Kedua tinggal Copy - paste deh kode html / link / url-nya di posting-an kita. SELESAI.



Ko cpet amat? Ya iyalaahhh....

Mau tau cara nya lebih detail?

Simak cara Otodidak memasukan video berikut:
  1. Untuk mendapatkan link video, kita dapat menggunankan layanan situs sharing video. Salah satunya Youtube.com.
    Klik di sini untuk menuju ke Youtube.com


  2. Lalu daftarkan diri anda di situs Youtube.com dengan mengklik tulisan Sign Up yang berada di halaman depan bagian atas


  3. Isi form pendaftaran, dan beri tanda cek di samping kotak I agree to the terms of use and privacy policy.


  4. Silahkan lakukan verifikasi dari email anda, verifikasi di gunankan untuk mengecek ke-valid-an alamat email yang anda isi di form registrasi. Dengan cara menbuka email yang dikirimkan oleh Youtube.com lalu mengklik link konfirmasi.


  5. Setelah mengklik link tadi anda akan dibawa menuju akun anda di youtube.com yang siap di gunakan untuk meng-upload video


  6. Setelah itu klik tulisan Upload Video, lalu isi form yang disediakan. Lalu klik Continue Uploading


  7. Setelah itu browse file video lalu klik Upload Video


  8. Setelah Proses upload selesai copy kode HTML yang di berikan.


  9. Untuk memasukan video ke posting-an anda cukup copy-paste kode html tadi ketika anda sedang melakukan posting artikel, ingat copy kode html tadi pada posisi Edit Html bukan pada Compose/Tulis.

    Selesai. Selamat mencoba!

Selengkapnya...

Membuat Link Download pada posting

Kemaren ada sobat saya nanya gini, "gimana sih caranya membuat link agar pembaca blogku bisa download file mp3?". Dari pertanyaa ini mendapat ide tema posting-an.
Sekalian aja saya buatin posting-an ini klo ada pembaca mempunyai pertanyaan yang sama.
Dari pertanyaan ini, anda bermaksud membuat link diposting-an anda dan nantinya bila link tersebut di klik akan mendownload file yang dimaksud.


Misalkan anda akan membuat postingan seperti ini:


Buat pembaca yang sangat mengidolakan Yui, penyanyi dari negeri sakura (baca:Jepang) tentu sudah tak asing lagi dengan lagu-lagunya yang khas. Atau mungkin anda malah belum kenal dengan penyanyi ini? Biar lebih kenal n ngefans ama Yui, download aja lagu-lagunya (tenang aja boz, GRATIS n Ga lemot!). Tinggal klik aja linknya:


  1. Yui - Good bye days.mp3

  2. Yui - It's Happy line.mp3

  3. Yui - Skyline.mp3



Dari contoh di atas anda tinggal ngklik aja udah langsung ke-download deh lagu-lagunya Yui.Coba aja klik klo tidak percaya.
Ko bisa?? Bisa dong! Semua ada ilmunya! (bukan iklan nya Erlangga lho!)
Secara sederhana akan saya jelaskan caranya sebagai berikut:

Pertama kita harus mempunyai link file tersebut, entah itu link dari file yng kita upload mau pun file hasil upload-an dari orang lain. Link ini bisa anda dapat kan dari web penyedia ruang untuk sarana berbagi file, kita ambil contoh indowebster.com. Setelah itu sisipkan link anda tadi di posting-an anda. Dengan adanya link tadi, orang lain bisa men-download file tersebut dari blog kita. Secara sederhana begitu, mudeng ga boz? Klo belum jelas akan saya berikan secara mendetail setiap langkahnya:




Pertama anda harus menyiapkan link file yang akan didownload tadi. Jika belum punya linknya, ada 2 cara yaitu meng-upload sendiri file atau mengambil link file yang telah di upload oleh orang lain.
  1. Mengupload sendiri file tersebut.

    • Silahkan klik di sini untuk menuju http:// www.Indowebster.com

    • Silahkan register di situs indowebster.com, setelah registrasi selesai, silahkan login ke indowebster.com

    • Kemudian upload file yang dimaksud. Dengan mengklik tombol UPLOAD di toolbar mendatar.

    • Kemudian browse file anda lalu isi data yang diperlukan, lalu klik "klik disini untuk melanjutkan" dibagian bawah, lalu klik UPLOAD.

    • Setelah meng-upload file tadi anda akan mendapatkan link download dari file anda tadi, caranya klik kanan pada tombol Download via IDWS lalu pilih Copy link location.

    • Paste link tadi di notepad, di notepad akan muncul url dari file yang anda upload tadi. Cirinya, bila tadi anda meng-upload file mp3 maka link tsb akan berakhir dengan extensi(akhiran) ".mp3".

  2. Mengambil link milik orang lain.

  3. Hal ini dapat anda lakukan apabila memang ada orang lain yang meng-upload file yang anda maksud. Caranya sebagai berikut:
    • Masukan keyword (kata kunci) file yang anda maksud di kolom pencarian di situs Indowebster.com tentunya, setelah itu klik Search.
    • Setelah itu akan tampil daftar file yang sesuai dengan kata kunci anda. Klik nama file yang sesuai dengan file yang anda maksud.

    • Setelah itu caranya sama dengan cara di nomor 1, klik kanan tombol Download IDWS lalu pilih Copy link location.
    • Paste link tadi di notepad.

Kedua Menyisipkan link di posting-an anda.
Sebenarnya cara ini sudah saya jelaskan dalam posting-an saya terdahulu disini.
Tetapi akan tetap saya jelaskan lagi biar mantap!
  • Ketika anda sedang me-posting artikel anda di post entry editor, blok tulisan untuk objek yang akan diklik(yang nantinya bila pembaca mengklik tulisan tersebut akan langsung mendownload file tersebut).

  • Klik toolbar Hiperlink lalu copy-paste link file yang sudah anda dapatkan tadi di window yang muncul.

  • Sebagai contoh (lagi!) di Entry editor tab Edit Html tertulis seperti ini

    Buat pembaca yang sangat mengidolakan Yui, penyanyi dari negeri sakura (baca:Jepang) tentu sudah tak asing lagi dengan lagu-lagunya yang khas. Atau mungkin anda malah belum kenal dengan penyanyi ini? Biar lebih kenal n ngefans ama Yui, download aja lagu-lagunya (tenang aja boz, GRATIS n Ga lemot!). Tinggal klik aja linknya:




    1. <a href="http://www28.indowebster.com/d86ce8fec459e880ce2064ac524c8af0.mp3">
      Yui - Good bye days.mp3 </a>


    Tulisan warna merah adalah kode html dari link file tadi, sedangkan tulisan warna hitam bisa di ganti dan nantinya akan muncul di posting-an anda.


  • Bila tulisan contoh tadi dipostingkan akan menjadi seperti ini:

    Buat pembaca yang sangat mengidolakan Yui, penyanyi dari negeri sakura (baca:Jepang) tentu sudah tak asing lagi dengan lagu-lagunya yang khas. Atau mungkin anda malah belum kenal dengan penyanyi ini? Biar lebih kenal n ngefans ama Yui, download aja lagu-lagunya (tenang aja boz, GRATIS n Ga lemot!). Tinggal klik aja linknya:



    1. Yui - Good bye days.mp3




  • Setelah itu tinggal postingkan artikel anda.

Sedikit catatan dari saya, bila anda menggunakan link dari orang lain, ada kemungkinan file tersebut bisa dihapus dan link tersebut tidak lagi berfungsi.

Selamat mencoba and Happy blogging!
Selengkapnya...

Menambahkan Jam di blog

Kali saya akan menjelaskan bagaimana cara menambahakan aksesoris blog yaitu jam. Nyindir banget ma orang Indonesia yang notabene di sebut jam karet (wkwkwkwk). Makanya biar lebih mendisiplinkan bangsa kita ini, ada baiknya buat pasang jam di blog masing2. Oke langsung aja akan saya jelaskan bagaimana menambahkan jam pada blog anda.
Di internet banyak situs penyedia jasa jam(bukan tukang jam lho), Gratis!. klik aja www.clocklink.com. Misalnya jam nya seperti ini:



Caranya gampang kok, ga ribet n singkat banget! Simak aj langkah berikut:

  1. Silahkan kunjungi situs www.clocklink.com

  2. Jika sudah berada pada situs tersebut, silahkan klik tulisan Want a clock on your Website ?

  3. Silahkan anda melihat-lihat dulu model dari jam yang tersedia, yaitu mulai dari Analog, Animal, Animation, dll

  4. Jika di rasa sudah menemukan model jam yang anda sukai, klik tulisan View HTML tag yang berada di bawah jam yang anda sukai tadi

  5. Klik tombol yang bertuliskan Accept

  6. Pilih waktu yang sesuai dengan tempat anda di samping tulisan TimeZone. Contoh : untuk indonesia bagian barat pilih GMT +7:00

  7. Set ukuran jam yang anda sukai di samping tulisan size

  8. Copy kode HTML yang di berikan pada notepad

  9. Paste kode HTML yang di copy tadi pada tempat yang anda inginkan

  10. Selesai
Setelah itu, langkah selanjutnya adalah memasukan kode jam dalam blog anda.
  1. Masuk dasbor blog anda.

  2. Klik Pengaturan.

  3. Klik Tata Letak.

  4. Klik Tambah Elemen Halaman.

  5. Klik Tambah Widget di side bar anda.

  6. Tambahkan HTML/Javascript, lalu klik edit pada widget yang baru anda tambahkan, setelah muncul window baru, Copy-paste kode jam tadi di tempat kosong (di bawah tempat judul).

  7. Setelah itu klik Simpan.

  8. SELESAI

  9. Selamat mencoba.
Selengkapnya...

Widget Tukar link atau Blogroll

Dalam dunia blogging, tukeran link sudah menjadi kebutuhan utama untuk membangun komunikasi sesama blogger. Blogger.com pun di sediakan widget untuk mengelola link menuju blog-blog lain yang menjadi link favorit atau link teman dekat kita. Yaitu widget blogroll.
Apa itu blog Roll ??
Blogroll adalah tempat untuk Link blog teman.bisa di isi web favorit kita ataupun web kita sendiri bila kita punya lebih dari 1 web/blog.
Untuk membuat blogroll pada side bar ialah sebagai berikut:

  • Login di blogger dengan ID anda

  • Klik menu Layout

  • Klik Page Elements

  • Klik Add a Page Element

  • Pilih Add Blogroll

  • Klik ADD TO BLOG pada menu Link List

  • Tulis Judul link pada pada isian di sebelah form Title. Contoh dalam blog saya
    Adalah “Link Patner” atau silahkan terserah anda

  • Isi nomor link yang ingin anda tunjukan di blog anda pada form
    Number of Links to show in list, jika anda ingin membatasi jumlah link
    yang akan di tampilkan, jika anda tidak mau membatasi silahkan di
    kosongkan saja.

  • Pada form Sorting, silahkan anda pilih sort Alphabetically bila
    ingin link anda di urutkan berdasarkan huruf alphabet ( mulai dari A
    --> Z ), atau pilih sort revers Alphabetically untuk sebaliknya (Z ke A). Bila tidak ingin mengurutkan abjad silahkan n pilih Don’t Sort

  • Tulis alamat URL yang akan di Link pada form New Site URL. Contoh : http;//otodidak-blog.blogspot.com

  • Tulis nama atau tulisan yang ingin muncul pada link yang anda buat pada form New site Name. contoh : Otodidak Blog.

  • Klik Add Link, jika link yang anda buat lebih dari satu. Silahkan isi semua form sesuai dengan langkah di atas.

  • Klik SAVE CHANGES bila sudah selesai

  • Bila anda ingin menempatkan Link yang anda buat tadi, silahkan
    arahkan mouse anda ke kotak link yang baru anda buat, lalu tekan mouse
    sambil di tahan pindahkan ke tempat yang anda inginkan ( di drag &
    drop ) .

  • Klik SAVE. Selesai



Selengkapnya...

Otodidak Pake Link

Kadang dalam posting, diperlukan untuk menyisipkan link yang dipergunaakan untuk menuju sebuah link lain dengan mengklik tulisan di posting-an. Untuk membuat link tersebut anda menggunakan tool yang tersedia di toolbar blogger. Untuk lebih memahaminya, akan saya jelaskan sebagai berikut.

  • Highlight/blok kata-kata yang ingin di buat link, contohnya tulisan klik disini.

  • Klik ikon yang bergambar seperti ini
    yang berada pada toolbar, maka setelah itu akan muncul tulisan http:// pada window baru seperti gambar di bawah ini:



  • Isi kotak yang ada tulisan tersebut dengan alamat situs yang anda inginkan, misalkan : http://www.otodidak-blog.blogspot.com atau link halaman file yang akan di download.

  • Klik OK. Selesai


Membuat link dari gambar atau image

Pada dasarnya kode dari membuat link ialah seperti ini:

<a href="Alamat yang dituju">Objek yang diklik</a>

Apabila anda mempunyai sebuah gambar, dan gambar tersebut ingin di jadikan sebuah link. Yaitu dengan menggunakan kode img src=...untuk lebih jelasnya caranya seperti di bawah ini :
  1. Upload gambar yang anda miliki ke hosting tempat menyimpan gambar, contoh http://www.photobucket.com.

  2. Jika anda sudah mengupload gambar anda, maka gambar tersebut akan
    di beri alamat URL, copy alamat tersebut pada notepad. Sebagai contoh
    gambar chicklet blog tutorial di samping mempunyai alamat URL :

    http://i162.photobucket.com/albums/t253/aksa/animasichicklet.gif

    Nah jika anda ingin membuat gambar tersebut menjadi sebuah link, maka kode yang di tulis adalah :

    <a href="http://kolom-tutorial.blogspot.com"><img src="http://i162.photobucket.com/albums/t253/aksa/animasichicklet.gif"></a>

Link dengan membuka window baru

Bila kita ingin setelah mengklik link tadi pembaca tanpa pergi dari blog anda. Hal ini dapat anda siasati dengan me-link tapi dengan membuka window baru. Jadi setelah mengklik link anda tadi, pembaca akan tetap membuka blog anda dan membuka window baru menuju link tadi. Hal dapat di lakukan dengan cara :
  1. Apabila sudah melakukan cara membuat link seperti keterangan diatas, klik menu
    Edit HTML tab yang ada pada toolbar.

  2. Pada tulisan yang kita link tadi akan muncul kode seperti ini ( contoh tulisan klik disini di link ke http://www.otodidak-blog.blogspot.com :

    <a href="http://www.otodidak-blog.blogspot.com">klik disini</a>

    maka disini anda harus menambahkan kode HTML target="new' atau target="_blank" pada awal ataupun akhir kode tersebut . Contoh kode yang sudah di modifikasi adalah :

    <a href="http://www.otodidak-blog.blogspot.com" target="new">klik di sini</a>

    atau :

    <a href="http://www.otodidak-blog.blogspot.com" target="new">klik di sini</a>

    atau bisa juga seperti ini :

    <a href="otodidak-blog.blogspot.com" target="_blank">klik di sini</a>
Selamat mencoba!
Selengkapnya...

Mengatasi Masalah Fungsi Readmore....

Di posting-an saya sebelumnya, telah saya jelaskan bagaimana membuat fungsi Readmore... Bila belum berhasil mungkin anda telah melakukan kesalahan atau ada hal yang terlewat. Dalam beberapa kasus, akibatnya, semua posting-an anda akan tidak terlihat bukan hilang. Tapi tenang dulu...(posting-an ilang gimana bisa tenang??) untuk itu artikel ini ada.(hehehe...)

Untuk lebih mengerti fungsi ini, akan saya jelaskan kode dari fungsi Readmore....Sebenarnya dalam penggunaan fungsi readmore, kunci nya terletak di code html yang terdapat pada template anda yaitu di:




<div class='post-body'>

<p><data:post.body/></p>

<div style='clear: both;'/> <!-- clear for photos floats -->

</div>



Perhatikan baik-baik kode di atas, kode tadi merupakan kode asli dari template sebelum di ubah.
Jika mengikuti langkah-langkah yang pernah saya tulis, maka kode nya akan berubah seperti ini:



<div class='post-body'>


<b:if cond='data:blog.pageType == "item"'>

<style>.fullpost{display:inline;}</style>

<p><data:post.body/></p> <!-- satu -->

<b:else/>

<style>.fullpost{display:none;}</style>


<p><data:post.body/></p> <!-- dua -->


<a expr:href='data:post.url'>Read more.....</a>

</b:if>


<div style='clear: both;'/> <!-- clear for photos floats -->

</div>



Kode di atas sengaja di bedakan warnanya, warna biru merupakan kode asli dari template,
warna merah merupakan kode yang harus di tambahkan. Yang perlu di perhatikan adalah kode ini :


<p><data:post.body/></p>



Kode di atas harus di pastikan ada dua tidak boleh ada satu karena jika ada satu maka postingan
anda bisa hilang semuanya, akan tetapi sebenarnya seluruh postingan tidak hilang, akan tetapi
tidak di perlihatkan alias di sembunyikan. Postingan di perlihatkan dan di sembunyikan karena
kode :


<style>.fullpost{display:inline;}</style>


<style>.fullpost{display:none;}</style>


{display:inline;}
artinya di tampilkan, dan

{display:none;}
artinya jangan di tampilkan alias sembunyikan dan kode inilah apabila
salah pemasangan mengakibatkan semua postingan menjadi tidak di tampilkan, jadi kode yang sudah jadi tadi dapat diartikan sebagai berikut:


Tampilkan Posting-an


Sembunyikan Posting-an


Tampilkan posting-an apabila klik link Read more...


Langkah lainnya ialah anda harus menggunakan Edit HTML pada waktu menulis posting-an jangan pada tab Compose, serta kode Read more... harus selalu di tutup. Contoh pemasangan
kode read more... pada artikel seperti ini :


Tulisan/paragraf ini akan muncul di posting-an anda.


<div class="fullpost">


Paragrap yang kedua, ketiga dan seterusnya harus di tempatkan di sini, jangan di tempatkan
sebelum kode readmore, jangan lupa untuk menutup kodenya ya.



</div>



Maka nanti yang akan muncul hanyalah paragrap atasnya saja yakni seperti ini :


Tulisan/paragraf ini akan muncul di posting-an anda.

Read more...


Sudah mengerti kan? Tapi 1 hal yang harus anda ingat yaitu selalu untuk membuatbackup data template sebelum mencoba otak-atik kode
template, karena jika terjadi kesalahan semisal seluruh postingan menghilang maka jangan bingung
dan merasa panik, sobat tinggal Upload kembali backup data template yang sudah di simpan
pada komputer kita sebelum melakukan otak-atik, dan template anda akan kembali seperti semula.

Selamat mencoba!


Selengkapnya...

Fungsi Readmore...


Saran saya, ketika anda melakukan Editting pada kode template, sebaiknya jangan memakai browser Internet Explorer terutama Internet Explorer 6, pakailah browser lain semisal FireFox ataupun Opera. Bagi yang belum mempunyai browser FireFox bisa mendownloadnya secara gratis di sini!
dan untuk Opera bisa mendownloadnya di sini!,

Langkah membuat fungsi read more..., coba ikuti langkah berikut ini :



  • Sign in di blogger dengan id anda.


  • Klik Pengaturan


  • Klik Format


  • Pada layar paling bawah, ada text area kosong disamping tulisan Template Posting, isi tesxt area kosong tersebut dengan kode di bawah ini :




  • <span class="fullpost">


    </span>



  • Klik tombol Simpan Pengaturan



Pemasangan kode ini agar anda tidak perlu menuliskan lagi di setiap posting-an anda.


  • Klik menu Dasboard



  • Klik Tata Letak



  • Klik tab Edit HTML



  • Klik tulisan Download Template Lengkap.



  • 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



  • Beri tanda centang pada kotak di samping tulisan Expand Template Widget , kotaknya terdapat di kanan atas kolom html template anda.


  • Tunggu beberapa saat ketika proses sedang berlangsung


  • Silahkan anda cari kode berikut pada kode template milik anda :




  • <data:post.body/>



    atau kode di bawah ini (sama saja) ;


    <p><data:post.body/></p>


  • Hapus kode diatas, lalu Copy-paste dengan kode di bawah ini :














  • Klik tombol Simpan Template


  • Selesai.



Cara Posting Artikel


  • Klik menu Posting



  • Klik menu Edit HTML,akan tampil kode html seperti yang anda copy tadi:



  • <span class="fullpost">



    </span>




  • Tuliskan artikel yang ingin tampak pada blog sebelum kode :




  • <span class="fullpost">


  • Tulis keseluruhan sisa artikel sesudah kode di atas tadi dan sebelum kode :



  • </span>


  • Klik tombol bertuliskan MEMPUBLIKASIKAN POSTING


  • Klik tulisan Lihat Blog(di jendela baru) untuk melihat hasil
    dari postingan kita, kemudian lihat apakah hasilnya sukses atau tidak.
    Jika tidak, mungkin ada bagian yang terlewatkan. Coba lihat kembali
    langkah diatas



Bagi anda yang mengikuti tutorial ini dan mengalami kegagalan, jangan panik
ketika blog anda menjadi amburadul (katanya begitu dalam komentar), upload kembali
backup templatenya dan nanti akan kembali ke keadaan semula sebelum di edit.

Selamat mencoba !
Selengkapnya...