Saturday, May 19, 2012

cssAlhamdulillah, setelah beberapa saat istirahat mengumpulkan tulisan singkat tentang Joomla 1.6, kami berkesempatan kembali mengupdate My Little Notes dengan sedikit artikel yang Insya Alloh bermanfaat buat pembaca semua.

Tulisan ini berawal dari browsing di internet yang rencana awal mau belajar flash player sebagai pemutar video berbasis web. Akhirnya tanpa sengaja menemukan website yang cukup menarik yaitu psd2css.com. Sesuai dengan namanya, web ini mampu mengkonversikan file PSD yaitu ekstensi file image yang cukup popular yang dihasilkan oleh program Adobe Photoshop, ke dalam bentuk css yang mampu ditampilkan di website.

Untuk menunjukan kehandalan online web converter ini, dalam artikel ini anda akan kami ajak untuk membuktikanya.

demo            vid_tutorial

Dalam contoh ini, sesuai dengan judul di atas, kita akan mengkonversikan file PDF berupa Flash Video Player yang lazim dipakai di dunia website. Untuk memudahkan praktek kita akan mempergunakan file psd yang telah disiapkan, silakan download di sini. Selanjutnya, jika anda ingin mengeditnya sesuai selera anda, silakan persiapkan dan simpan kembali sebagai psd file. Tetapi hati-hati, jangan merubah nama layer, karena file psd tidak menggunakan code akan tetapi nama file yang spesifik. Silakan pelajari lebih lanjut di psd2cssonline.com. Jika psd file telah siap, upload file yang dimaksud ke psd2cssonline.com.

upload-psd

Dalam beberapa saat (tergantung besar file dan koneksi internet anda) file akan terupload dan html link akan tersedia sebagai ‘live preview’. Download file zip yang ada file siap di edit. File yang ada seperti lebih kurang seperti berikut:

file_psd

Lakukan pengeditan pada file index.html, seperti berikut:

  • Klik kanan pada index.html – open with… cari program notepad atau wordpad. Kami menyarankan untuk menginstal notepad++ untuk memudahkan pengeditan.
  • Edit bagian-bagian yang penting (disarankan untuk membackup file untuk mengembalikan kode jika ada kesalahan) antara lain: title, meta, c2_text_#FFF, controls_text_#000, atau baris lain yang berupa text.
  • Jika telah siap save file dan klik dua kali index.html untuk melihat perubahan yang terjadi.
  • Jika semua file siap dan pengeditan selesai, upload seluruh file yang ada ke server hosting dan siap dipublikasi.
  • Jika semua berjalan normal, maka akan terlihat webpage seperti berikut:

demoSemoga bermanfaat.

COMMENTS  

farannisa
Posted On
%b %18, %2011
Posted By
farannisa
0 ilmu baru
Alhamdulillah
dapat ilmu baru.. menarik sekali untuk dipelajari.
Jazakalloh

LEAVE A REPLY

Mohon Perhatian Anda...1). Kami berhak mengedit, menyortir bahkan mengeblok IP anda jika dipandang tidak sesuai dengan visi dan misi kami tanpa pemberitahuan terlebih dahulu. 2). Jika anda telah mengeklik tombol send dan komentar anda belum muncul, coba dulu klik tombol 'Refresh Comments List'. 3). Jika ikon anda ingin ditampilkan di kolom komentar, silakan daftarkan email anda di Gravatar.com. Terima kasih atas komentar dan perhatian anda.

Security code
Refresh

Category: Internet - Web