Tampilan Tombol Glossy Web

haloo teman, pada kesempatan kali ini kita akan belajar tentang membuat tampilan tombol Glossy Web.
okey tidak usah lama-lama mari kita ikuti langkah-langkah pembuatannya di bawah ini :

1. Dari Photoshop, buat dokumen baru berukuran 320x240px dengan background bewarna putih.
2. Buat shape kotak menggunakan Rounded Rectangle tool dengan nilai radius: 5px. Warna shape bebas.
3. Tambahka layer style Inner Glow dan Bevel and Emboss untuk layer shape 1.
4. Tambahkan layer style Gradient Overlay lalu pilih Style: Linear dan Angle: 50'. Klik pada kotak Gradient   untuk mengatur warna gradiasi.
5. Tambahkan layer style Stroke. Atur Size: 1px dan pilih warna antara hijau gelap dan terang  (atau pilih warna lain sesuai dengan nuansa warna gradiasi).
6. klik OK untuk menutup kotak dialog Layer Style. 
7. Buat layer baru diatas layer shape 1, kemudian buat seleksi menggunakan Elliptical Marquee tool.
8. Isi seleksi dengan warna gradiasi putih-transparan menggunakan Radial Gradient tool.
9. Tekan Ctrl+D untuk menghilangkan sleksi (deselect). Pilih Blend mode Soft Light dan kurangi Fill: 40%.
10. Tekan Ctrl+Klik pada Thumbnail layer shape 1 untuk membuat seleksi mengikuti bentuk shape tersebut.
11. Masih pada layer 1, gunakan perintah Select> Modify> Contract sekitar 2px untuk mengurangi ukuran seleksi.
12. Balik seleksi dengan Shift+Ctrl+I. Tekan Del untuk menghapus area yang diseleksi.
13. Tekan Ctrl+D untuk deselect. Kemudian Buat teks warna putih dengan jenis font sesuai keinginan. 
14. Tambahkan Drop Shadow pada teks.
15. Terakhir, gandakan layer Shape 1 lalu ubah warna Gradient Overlay dan Stroke manjadi nuansa hitam.

Nah Demikianlah langkah-langkah untuk membuat Tombol glossy Web.
Terimakasih dan semoga bermanfa'at.  

Read More..

Menyertakan URL Sumber Setiap Copy Paste Artikel Web

Artikel ini akan mencoba menyertakan URL sumber ketika seorang melakukan copy paste konten yang ada di website.

Pencurian Artikel tanpa tanggung jawab memang kadang menjengkelkan, buat orang yang sudah capek memikirkan konten apa yang bagus untuk website nya, capek menuliskan nya, lalu dengan gampang dan tanpa rasa bersalah orang lain malakukan copy paste ke website mereka dan langsung di posting sebagai milik mereka. Ini kadang menjengkelkaan.

Artikel itu sejatinya untuk di baca dan dipelajari, bukan untuk di copy paste dan di posting di website sendiri tanpa ada nya credit kepada penulis aslinya.

Perlu ada cara-cara pencegahan untuk mengatasi masalah itu,  kali ini kita mencoba metode lain yaitu dengan menyertakan URL sumber artikel setiap kali seseorang melakukan copy paste.

Untuk melakukan itu kita membutuhkan Javascript, karena sepertinya hanya javascript yang bisa melakukan itu terhadap client (client site scripting).

Kegunaan Lain

Selalu ada sisi baik dan sisi buruk dari suatu hal, buat yang suka copy paste pasti ini menjengkelkan, tapi buat orang-orang yang peduli akan hak cipta maka ini sangat membantu. Mengapa?
Kadang karna terlalu banyak copy paste seorang yang sedang mengerjakan karya ilmiah sampai lupa dari mana dia mengambil / mengutip tulisan. Ini bisa membantu mereka karena dengan mudah mengetahui dari mana dia melakukan copy paste. Kegunaan lain pasti ada diantaranya untuk SEO, tapi kita tidak akan membahas lebih banyak lagi, kita langsung praktekan saja.

Langkah-Langkah.

1. Disini kita hanya perlu mendaftar di website Tynt ( http://www.tynt.com ) dengan memasukan email dan data-data pribadi.

2. Lalu nanti kita akan diberikan code yang bisa kita ambil. Contoh Code

1	<!-- BEGIN Tynt Script -->

2	<script type="text/javascript">

3	if(document.location.protocol=='http:'){

4	var Tynt=Tynt||[];Tynt.push('aXXXXXXJ0r4QTIacwqm_6l');

5	(function(){var s=document.createElement('script');s.async="async";s.type="text/javascript";s.src='http://tcr.tynt.com/ti.js';var h=document.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})();

6

}

7

</script>

8	<!-- END Tynt Script -->

3. Copy kode tersebut dan letakan di bagian atas web, tepatnya sebelum tag/head;

4. Jika anda sudah mendaftar maka akan ada panduan-panduan nya di situ, baik untuk Website pribadi, WordPress, Blogger atau  yang lain nya.

5. Jika sudah diletakan di atas tag /head Lalu jalankan kembali website, dan coba untuk meng-copy artikel website kamu. Maka hasilnya akan terlihat seperti gambar ini.

Contoh paste artikel ke Microsoft Word

Saya terapkan di website ini, dan saya mencoba paste di Microsoft word. Hasilnya akan sama seperti gambar diatas jika anda paste di web editor, atau code editor atau dimana pun.

Read More..