Membuat Banner dan Menyertakan kodenya

Tutorial ini sebenarnya sudah disampaikan secara live (maksudnya diajarkan), tapi banyak siswa yang minta langsung dibuat dalam bentuk postingan berikut dengan kode-kode ataupun script html yang dimaksud.
Padahal salah seorang temen kamu ada yang udah bikinin tutorialnya di sini
OK, langsung saja Step by Step

  1. Buat Banner di Pengolah gambar (bisa Paint, Photoshop, GIMP, dll). Simpan gambar dalam jpeg atau gif. Ukuran gambar bebas sesuai keinginan kita banner tampil seperti apa. Sebagai contoh Banner Commitlab berukuran 50x150 pixel, biasanya dibuat 125x125 terserah, bebas aja.
  2. Kalo udah jadi upload ke hosting gambar gratisan seperti Photobucket, Imageshack dll.
    Tapi ada cara mudah, kamu buat sebuah postingan di blog kamu, lalu upload gambar/banner yang kamu buat ke dalam postingan tersebut.
  3. Kalo udah kamu tinggal gunain script html-nya di Add gadget > HTML/Java
Caranya:
  • Pertama pastikan dulu bahwa gambar/banner kamu telah terupload ke internet (tidak di komputer/flashdisk lagi, misalnya kita upload di postingan (seperti gambar berikut ini)
  • Lalu klik kanan Gambar, dan Klik Copy Link Location (Kalo Pake Mozilla Firefox, tergantung browser yang kamu pake), intinya buat ngedapetin Link gambar yang kita inginkan tersebut sebenarnya dimana.
    nah untuk gambar di atas kita dapat linknya ada di:

    https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK7bZtcGLsknAYoDTryP3aUkyCwYZ7OLOG4ig6P0cym1DlSqks0G35Ig53XnxCjKhLRzwLxj7cdYwPwi5j6CfEnF-Uru2TdJ6DbxveZjGL3_xJTGBR8B70MeYSGQTMvweGLObhwfeJmbI7/s320/test.gif

  • Kalo dah dapet kita hanya perlu masukin format berikut:

    <a href="LINK-YANG_AKAN_DITUJU"><img src="LINK-POSISI-GAMBAR"></a>

    Jadi contohnya seperti ini:
    <a href="http://ambo-di.blogspot.com"><img src="http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK7bZtcGLsknAYoDTryP3aUkyCwYZ7OLOG4ig6P0cym1DlSqks0G35Ig53XnxCjKhLRzwLxj7cdYwPwi5j6CfEnF-Uru2TdJ6DbxveZjGL3_xJTGBR8B70MeYSGQTMvweGLObhwfeJmbI7/s320/test.gif"></a>

    Jadi deh. (lihat hasilnya di sebelah... di widget "Test Banner")
Nah kalo untuk Kode Bannernya tinggal gunakan kode seperti ini saja
<textarea rows="5" cols="33" name="code">ISI DENGAN KODE BANNER KAMU</textarea>

Angka 5 dan 33 bisa diganti sesuai keinginan, 5 maksudnya adalah jumlah baris tulisan yang akan tampil dan 33 adalah jumlah kolomnya

hasilnya nanti akan seperti ini:

0 komentar: