Bagaimana menurut kamu tentang blog ini?

Rabu, 06 Maret 2013

Memasang Text Beranimasi pada Blog

Menambahkan Teks Beranimasi
Banyak hal yang dapat kita lakukan untuk membuat blog kita terlihat lebih cantik. Selain menambahkan beberapa konten yang sudah disediakan blogspot, kita juga dapat menggunakan konten dari website lain. Kali ini saya akan memberikan informasi tentang salah satu konten blog. Seperti judul artikel ini, yaitu "Menambahkan Animasi Teks pada Blog".

Animasi teks pada blog berupa sebuah teks yang terdiri dari huruf - huruf yang memiliki style tertentu dan memiliki gerakan tertentu. Animasi teks ini biasanya diletakan dibagian atas blog sebagai header. Teksnya berisi ucapan selamat datang atau yang lainnya tergantung pemilik blog dan juga singkat. Beberapa contoh animasi teks yang saya dapatkan dari sebuah website:

Font 12:

Contoh Teks Beranimasi


Font 21:

Contoh Teks Beranimasi


Diatas adalah contoh dari animasi teks yang bisa kamu dapatkan di website: http://www.myniceprofile.com/custom-animated-text.html. Teks yang sebenarnya dari gambar diatas akan bergerak - gerak. Pada font 12, setiap huruf pada teks "Selamat Datang" itu akan bergerak - gerak seperti lonceng yang tertiup angin, setiap hurufnya bergerak ke arah yang berbeda, ada yang ke kanan dan ada yang ke kiri. Jika pada font 12, setiap huruf memiliki style yang sama, yaitu lonceng, berbeda dengan font 21 yang memiliki style berbeda, yaitu warna yang berbeda. Setiap huruf pada teks font 21 bergerak seperti gerakan bendera yang berkibar.

Masih banyak lagi animasi teks selain contoh teks diatas. Kamu mau mencobanya? Pertama - tama kunjungi website yang sudah saya berikan diatas.


Myniceprofile

 

Dari sekian banyak font, pilihlah yang terbaik untuk blog kamu. Jika sudah menentukan pilihan, lihat kotak dibawah yang didalamnya ada tulisan "Example". Hapus semua tulisan di kotak itu, lalu tulis seperti ini: [f21]Selamat Datang[/f]. Tulisan "Selamat Datang" yang berwarna biru dapat kamu ubah sesuai keinginanmu. Tulisan "[f21]" yang berwarna merah adalah jenis font yang kamu pilih, f21 artinya font 21. Style font 21 sama dengan contoh animasi teks font 21 yang sudah saya berikan diatas. 

Kamu dapat menghitung font-nya dari sebelah kiri atas, tepatnya font 1, yaitu teks berpola bendera Amerika, ke sebelah kanan. Font 10 adalah teks ber-style bola dunia, dan font 12 adalah teks yang memiliki style lonceng. Hitung berapa nomor font yang kamu pilih, lalu ganti angka pada tulisan "[f21]" yang berwarna merah tadi dengan nomor font yang kamu pilih.

Setelah menentukan font dan teks animasinya, lihat hasil pilihanmu dengan menekan tombol "Preview". Kalau masih belum puas, boleh diubah lagi sampai tepat sesuai keinginanmu. Setelah modelnya sudah sangat tepat dengan keinginanmu, klik tombol "Get the Code". Nah, kamu akan dibawa ke halaman lain, disana kamu akan melihat dua kotak berisi kode, yang harus kamu copy nanti adalah kode yang atas, kalau mau copy sekarang juga boleh. Langsung saja klik kanan di dalam kotak itu, nanti semua kodenya akan ter-blok, lalu klik "Copy".

Myniceprofile

Sekarang, login ke blog kamu, lalu menuju ke "Tata Letak". Klik "Tambahkan Gadget", lalu jendela baru akan terbuka, cari gadget "HTML/Javascript", klik tanda plus disampingnya.


Menambahkan Konten

Tunggu beberapa saat, lalu akan muncul jendela baru. Isi judul terserah kamu, lalu dibagian konten, isi dengan kode yang sudah di-copy tadi atau kalau belum di-copy, silahkan di-copy dulu. Jangan lupa disimpan perubahannya. 
 
Menambahkan Konten Baru
  
Nah, sekarang diliat dulu blognya. Kalau teksnya gak muncul, mungkin ada kesalahan kode yang di-copy, coba lebih berhati - hati.

Sebenarnya animasi teks itu dapat dikombinasikan antara style satu dengan yang lain. Misalnya mau menggabungkan font 21 dengan font 10, begini tulisannya: [f21]Selamat[/f] [f10]Datang[/f], jangan lupa diberi spasi antara font yang berbeda. Atau mungkin kamu mau membuat 1 kata dengan huruf yang ber-style berbeda, misalnya kata "Halo" dengan font 21, font 40, font 25, dan font 32, seperti ini: [f21]H[/f][f40]A[/f][f25]L[/f][f32]O[/f], kalau mau membuat kata ber-style beda, jangan beri spasi pada setiap hurufnya jika masih dalam satu kata, kecuali memang kamu ingin sengaja diberi spasi.

Selain teks beranimasi, situs Myniceprofile juga menyediakan konten - konten lain. Silahkan dieksplorasi dan jika tertarik,  tinggal copy kodenya deh.

Sudah cukup panjang rupanya artikel ini, silahkan dicoba buat kalian para blogger. Selain yang ini masih banyak lagi cara - cara untuk membuat blogmu terlihat menarik, kamu bisa melihat trik - trik lain di blog saya di kategori Trik dan Tips Blogspot.

1 komentar: