Pages

Subscribe:

Sabtu, 21 Desember 2013

Mempercantik Blog Atau Website Dengan Widget Kalendar

Share on :

Mungkin sudah banyak tutorial yang tersebar di internet mengenai cara agar blog atau website terlihat lebih menarik yang salah satunya dengan menambahkan widget kalender. Pada postingan ini pun akan memberikan tips menambahkan widget kalender pada blog atau website, walaupun sama tapi tidak ada salahnya menambah pengetahuan.

Sebenarnya tidak sulit menambahkan widget kalendar karena sudah banyak situs-situs yang menyediakan secara gratis, seperti yang akan dibahas dibawah ini:
LANGKAH 1:
==>kita akan gunakan salah satu situs penyedia widget gratis DISINI
==>setelah masuk, kita akan lihat banyak sekali pilihan-pilihan widget kalender
==>sebagai contoh kita akan ambil salah satu pilihan widget seperti dibawah ini:















Keterangan:
*) pilihan widget kalendar yang diambil ditunjukkan anak panah
**) ada 2 tombol pilihan seperti yang dilingkari warna merah
nomor 1: "Use the widget", klik tombol ini jika kita ingin langsung menggunakan pilihan widget diatas tanpa mengedit tampilannya.
nomor 2: "Customize this widget", klik tombol ini jika ingin mengedit tampilan kalendar diatas. (Untuk sementara kita klik tombol ini)



==> setelah tombol nomor 2 kita klik makan akan muncul tampilan "Customize Calendar" seperti dibawah ini:

Keterangan:
(1) nomor 1: "Configure Holidays", ini untuk pengaturan tanggal sesuai negara tempat kita tinggal, pilih saja INDONESIA pada pilihan "Country".
(2) nomor 2: "Configure Calendar", ini pengaturan yang paling utama karena kita akan mengatur tampilan kalendar disini.
  • Week Starts From (menentukan awal hari dalam kalendar): pilih saja SUNDAY(Minggu) atau MONDAY(Senin).
  • Background (warna tampilan belakang kalendar): klik "Pick Color" untuk memilih warna.
  • Foreground (warna tampilan depan kalendar): klik "Pick Color" untuk memilih warna.
  • Transparency (mengatur transparansi gambar): isi saja dengan angka 1-99, semakin besar angka yang diisi maka tampilan kalender akan semakin transparan begitupun sebaliknya semakin kecil angka yang diisi maka tampilan kalendar akan terlihat jelas. Sebenarnya pilihan ini akan terlihat effeknya jika background kalendar dengan gambar apel (contoh diatas) berbeda.
  • Calendar Border (memberikan garis bidang/sisi kalendar): pilih No jika tidak perlu atau Yes jika diperlukan.
  • Border Color (mengatur warna garis bidang/sisi kalendar): ini akan terlihat effeknya jika kita pilih Yes pada "Calendar Border". klik "Pick Color" untuk memilih warna.
  • Font Face (bentuk/style tulisan pada kalendar): pilih sesuai selera
  • Header (Month) Color (mengatur warna pada tulisan bulan di kalendar): klik "Pick Color" untuk memilih warna.
  • Header (Day) Color (mengatur warna pada tulisan hari/tanggal di kalendar): klik "Pick Color" untuk memilih warna.
  • Calendar Position (mengatur posisi tampilan kalendar): pilih Top untuk posisi kalendar diatas atau pilih Bottom untuk posisi kalendar dibawah.
(3) nomor 3: "Configure Background Image", ini pengaturan background/gambar belakang (seperti gambar apel contoh diatas), ada dua pilihan:
  • Use Available Image (dapat menggunakan gambar yang disediakan): klik tombol "Select Image ..." untuk memilih gambar.
  • Use Own Image (dapat mengambil gambar dari sumber lain): syaratnya anda sudah punya link gambar yang akan digunakan (bisa dari flickr, photobucket dan situs lain yang menyediakan link gambar), jika sudah punya link gambar bisa langsung ketik atau copas ke kotak kosong yang disediakan.
  • Image Border (memberikan garis bidang/sisi gambar background):  pilih No jika tidak perlu atau Yes jika diperlukan.
  • Border Color (mengatur warna garis bidang/sisi gambar background): klik "Pick Color" untuk memilih warna.
(4) nomor 4:  "Preview and generate your code", wajib klik tombol ini untuk melihat perubahan pengaturan dan juga menampilkan code yang akan digunakan untuk menampilkan kalendar di blog/website.
(5) nomor 5: hasil dari perubahan pengaturan tampilan kalendar yang sudah kita lakukan.
(6) nomor 6: code-code yang harus dicopas agar tampilan kalendar ada di blog/website, caranya dengan klik kotak code tersebut kemudian Ctrl+C (copy).

LANGKAH 2:
==> untuk sementara kita akan tampilkan kalendar di blog saja (ambil contoh blogspot)
==> kemudian Login ke blogger
==> setelah masuk lalu pilih Tata Letak --> Tambahkan Gadget
==> kemudian cari dan pilih HTML/Java Script
==> setelah muncul tidak perlu diisi Judul (jika mau diisikan silahkan), pada kotak Konten tekan Ctrl+V (paste)..INGAT!!!! sebelumnya sudah dicopy (Ctrl+C) code-code menampilkan kalendar di LANGKAH 1.
==> kemudian klik Simpan.

Jika semua langkah diikuti maka tampilan seperti contoh dibawah ini:

Demikian tips untuk menampilkan widget kalendar di blog/website, semoga bermanfaat.

Artikel Terkait

0 komentar:

Posting Komentar