Verifikasi Blog ke Akun Pinterest

| | , | 22 komentar
Bismillah. Alhamdulillah. Pada tanggal 24 Oktober 2012, pihak Pinterest mengumumkan penambahan fasilitas terbarunya yaitu verifikasi website yang ditulis pada halaman support.pinterest.com. Jika diterjemahkan secara bebas pengumuman itu berbunyi "Akun dengan situs terverifikasi berarti telah mengkonfirmasi kepemilikan situs web mereka menggunakan proses verifikasi otomatis yang kami sediakan. Situs terverifikasi menetapkan hubungan antara situs web dengan akun di Pinterest. Akun dengan situs terverifikasi ditandai dengan tanda centang yang ditampilkan disamping alamat situs web di halaman profil mereka dan di bawah nama mereka dalam hasil pencarian."

Bersihkan Website dari Badware-Malware

| | , | 10 komentar
Pernahkah anda melihat sebuah peringatan yang berisi "Mengunjungi situs ini dapat membahayakan komputer anda!" pada saat anda berkunjung ke sebuah blog atau situs? Sungguh sangat menyebalkan ketika blog kita kemudian terdeteksi sebagai situs yang membahayakan, padahal kita tidak pernah melakukan atau bertindak sebagai badware. Hal ini terjadi karena ulah Badware. Badware adalah perangkat lunak yang memiliki prinsip dasar mengabaikan kenyamanan pengguna tentang bagaimana menggunakan komputer atau koneksi jaringan[1]. Badware memang dirancang khusus untuk tujuan kriminal, politik, dan/atau tujuan nakal. Tujuan-tujuan tersebut mungkin mencakup:

jQuery Animation - Hover Image Caption

| | , | 12 komentar
Artikel kali ini kita akan membahas cara memberikan caption atau deskripsi pada gambar dengan bantuan jQuery untuk memberikan efek animasinya. Ketika kita mengarahkan pinter mouse (hover) diatas gambar maka caption yang tadinya disembunyikan akan dimunculkan dengan efek slideup. Pergeseran caption juga akan menggeser posisi gambar keatas. Dan ketika pointer mouse di geser menjauh dari gambar maka caption akan kembali turun dengan efek slidedown hingga tersembunyi, sedangkan gambar akan kembali turun pada posisi semula. Demikian sekilas gambaran cara kerja jQuery Animation - Hover Image Caption, namun harus diperhatikan bahwa script jQuery ini tidak bekerja dengan baik pada framework jQuery versi 1.7.1. Silahkan lihat demo dibawah ini untuk melihat hasil akhirnya.

jQuery Menu Malu

| | , | 33 komentar
Bismillah. Alhamdulillah. Sebelum menulis artikel ini, aku sudah "lemes" tertawa sendiri. Seperti tidak ada judul lain saja menggunakan nama "jQuery Menu Malu". Penamaan ini sebenarnya spontanitas ketika melihat hasil akhir dari efek menu tersebut. Kronologi kejadiannya itu tadi malam, karena tidur terlalu sore (sekitar jam 10) maka terbangun masih dini hari (sekitar jam 3), mata langsung segar dan bingung mau melakukan apa. Buka-buka buku menemukan naskah pidato Bacharudin Jusuf Habibie waktu di kampus UI sebanyak lima halaman. Begitu selesai otak justru menjadi "njlimet" antara mengerti dan tidak mengerti dengan isi pidato tersebut. Akhirnya buka laptop dan cari-cari inspirasi, mata tiba-tiba tertuju pada suatu gambar background berwarna gelap (yang nanti akan kita gunakan), maka lahirlah inspirasi untuk menulis kode jQuery. Menulis kode jQuery-nya juga cukup lama, hampir satu jam karena berganti-ganti ide dan efek yang digunakan. Dan akhirnya efek yang digunakan adalah on-hover, un-hover, slideUp dan slideDown seperti demo dibawah ini.

Link Kredit Efek jQuery Ease Out Bounce

| | , | 7 komentar
Bismillah. Alhamdulillah... Kali ini kita akan membahas proses pembuatan suatu efek Ease Out Bounce yang di terapkan pada link kredit yang biasanya terdapat pada bagian bawah halaman blog. Mungkin sebagian blogger menyebutnya sebagai tooltips namun sebenarnya lebih dari sekedar tooltips dan saya lebih cocok menyebutnya sebagai Credits Ease Out Bounce. Kata Ease Out Bounce sendiri di ambil dari efek yang dihasilkan dari sebuah plugin jQuery Easing yang dibuat oleh George McGinley Smith. Penekanan pada artikel ini lebih ke pemahanan tentang pemanfaatan plugin jQuery Easing sehingga setelah artikel ini anda baca, pembaca bisa mengembangkannya sesuai dengan imajinasinya sendiri. Artikel ini tidaklah bersifat copy paste dan langsung dapat digunakan namun hanya berupa pancingan mengenai indahnya menulis script jQuery. Mari mulai bermain-main dengan jQuery...

Menyisipkan Kode atau Script pada Artikel Blog

| | , , | 5 komentar
Bismillah. Sebenarnya artikel tentang insert script code into blogger post atau menyisipkan kode-kode atau script kedalam artikel blog pernah dibahas pada artikel sebelumnya dengan memanfaatkan fasilitas plugin SyntaxHighlighter yang dikembangkan oleh Alex Gorbatchev. Dua artikel sekaligus telah di tulis untuk menjelaskan tentang Integrasi SyntaxHighlighter pada Blogger dan Konfigurasi SyntaxHighlighter pada Blogger. Namun pada artikel kali ini kita akan memanfaatkan fasilitas dari pihak ketiga tanpa menggunakan plugin. Pihak ketiga penyedia layanan insert code sebenarnya banyak, namun kali ini kita akan memanfaatkan fasilitas dari pastebin.com karena situs ini sudah cukup lama dan paling banyak digunakan oleh para blogger.

Aktikan dan Non Aktifkan Fitur Lightbox Blogger

| | , , | 6 komentar
Akhirnya Blogger menambahkan menu untuk mengaktifkan dan menonaktifkan fitur lightbox. Lightbox menurut keterangan Blogger yaitu "Saat diklik, gambar Anda akan terbuka dalam hamparan di bagian atas blog. Jika pos Anda memiliki beberapa gambar, gambar tersebut akan muncul sebagai thumbnail di sepanjang bagian bawah."

Menambahkan Widget Page Loading Time

| | , , | 10 komentar
Kali ini kita akan membuat script Page Loading Time. Page Loading Time atau Waktu Pemuatan Halaman merupakan perangkat bantu untuk mengetahui waktu yang dibutuhkan untuk memanggil keseluruhan halaman dari suatu halaman situs atau blog. Dengan widget ini kita bisa mengetahui kecepatan load halaman blog, ini akan memicu pengelola blog untuk mengoptimasi blognya agar lebih cepat. Langkah-langkah untuk mengoptimasi blog akan dibahas pada artikel berikutnya. Satuan yang akan digunakan adalah milidetik jadi jika anda ingin menggunakan satuan waktu menit kira-kira bagaimana ya? Mari kita coba memasang script page loading time.

jQuery Auto Resize & Image Frame

| | , | 9 komentar
Bismillah. Alhamdulillah. Berawal dari malasnya melakukan pengeditan style gambar yang disertakan pada Blogger, maka Blogger Tune-Up pun melakukan manipulasi style pada gambar yang diberikan secara default oleh Blogger. Pada saat kita mengunggah suatu file gambar pada artikel blog maka secara default Blogger memberikan style otomatis berupa lebar (width), tinggi (height), dan alamat thumbnail gambar dengan resolusi rendah. Hal ini terkadang membuat artikel justru kurang menarik dilihat dan kurang nyaman jika gambar yang ditampilkan memiliki kualitas rendah dengan ukuran tidak sesuai dengan lebar artikel. Berawal dari hal inilah kemudian Blogger Tune-Up membuat script jQuery Auto Resize & Image Frame untuk menyempurnakan style yang diberikan oleh Blogger, walaupun sebenarnya script ini bisa dipergunakan untuk pengguna non Blogger.

10 Website Pengguna JavaScript Mengagumkan

| | , | 12 komentar
Bismillah. Alhamdulillah. Sejak diperkenalkannya framework JavaScript seperti jQuery, Mootools, Prototype dan lain sebagainya, banyak sekali para web desainer yang beralih dalam menyusun website-nya dari konten berbasis flash menjadi konten berbasis JavaSript. Efek-efek yang dibuat pada website sudah hampir meninggalkan basis flash, mereka berbondong-bondong beralih ke basis JavaScript, selain dapat memperingan load website, juga proses penulisan script yang lebih mudah dari pada menggunakan flash namun tentunya dengan hasil akhir yang tetap memukau.

Perpustakaan jQuery pada Blogger

| | , | 15 komentar
Sebenarnya artikel tentang perpustakaan jQuery pernah dibahas lengkap pada beberapa artikel Blogger Tune-Up, namun entah karena arsipnya sudah lama atau karena malas menjelajah Blogger Tune-Up sehingga masih ditemukan beberapa kesalahan-kesalahan dan kekurang telitian para blogger dalam menggunakan perpustakaan jQuery. Perpustakaan jQuery di sebut juga jQuery Library, jQuery Framework atau sering di sebut jQuery saja.

Animasi CD/DVD Promosi dengan CSS 3

| | , , | 14 komentar
CSS atau Cascading Style Sheet telah mengalami perkembangan yang semakin hari semakin menakjubkan. Animasi yang sebelumnya di dominasi oleh file-file flash sekarang sudah mulai ditinggalkan dan para profesional desainer web beralih pada penggunaan jQuery dan CSS 3 sebagai animasi pada tampilan website yang dibuatnya. Selain ukuran file lebih kecil sehingga waktu load halaman lebih cepat juga proses penulisan script yang semakin hari semakin sederhana namun tanpa berpengaruh pada hasil akhir yang tetap menakjubkan. Bagi para pemula yang baru saja berkecimpung di dunia web desain mungkin agak sulit untuk membedakan mana animasi yang dihasilkan dari flash dan mana animasi yang dihasilkan dari jQuery atau CSS 3.

Ooppss! Aktifkan JavaScript

| | , , | 12 komentar
Bismillah. Artikel kali ini merupakan lanjutan dari "jQuery Anti Adblock" yang pernah dibahas sebelumnya. jQuery Anti Adblock digunakan untuk memberi peringatan kepada para pengunjung blog agar perangkat lunak blok iklan dinonaktifkan, namun jika para pengunjung blog menonaktifkan fungsi JavaScript pada browsernya maka jQuery Anti Adblock tidak dapat bekerja dan para pengunjung tetap dapat membaca artikel dalam keadaan iklan tidak ditampilkan, hal ini merupakan kerugian bagi para pengelola blog.

jQuery Accordion Versi 2

| | , | 9 komentar
Bismillah. Sebenarnya jQuery Accordion[1] pernah dibahas sebelumnya oleh Blogger Tune-Up tetapi karena banyaknya permintaan dari pembaca setia Blogger Tune-Up maka sekarang akan dibahas jQuery Accordion dengan jenis lainnya yang lebih sederhana dan sekaligus belajar tentang CSS (Cascading Style Sheet) dan penulisan script jQuery. Jenis ini merupakan jQuery Accordion yang di kembangkan oleh Soh Tanaka[2]. Seperti apa Simple jQuery Accordion Versi 2?

Membuat jQuery Ads Popout

| | , , | 15 komentar
Bismillah. Iklan pada blog bagi sebagian blogger adalah hal penting walau sebagian lagi tidak menyukainya. Terlepas dari suka dan tidak suka, kali ini Blogger Tune-Up akan memberikan artikel yang berkaitan dengan iklan. Sebenarnya telah beberapa kali Blogger Tune-Up menyuguhkan teknik menampilkan iklan, mulai dari Ads Popup[1], Banner Rotator[2] dan lain sebagainya. Semua artikel tersebut disuguhkan sebagai alternatif bagi para blogger untuk memilih mana tampilan yang terbaik untuk menampilkan iklan pada blognya.

Menulis dan Menerbitkan Artikel Blog via Facebook

| | , , | 15 komentar
Bismillah. Satu bulan penuh Blogger Tune-Up tidak di update. Selain karena kekesalan masalah Account Google Code yang di suspend kemudian dilanjutkan Account Twitter yang juga ikut-ikutan di suspend, membuat saya secara pribadi menjadi malas untuk menulis. Sekarang Blogger Tune-Up kembali sibuk dengan dunia nyata, berbagai inovasi dicurahkan didunia nyata, mulai dari Microcontroller, CNC Machine dan hal-hal lain yang berbau elektronik. Tapi setelah ditelaah baik-baik sangatlah tidak adil jika Blogger Tune-Up kemudian "diam", toh Google tidak akan peduli dengan aksi diam.

Menambahkan Tombol Berbagi Jejaring Sosial

| | , , | 13 komentar
Jejaring sosial merupakan media yang paling banyak dikunjungi dan Facebook merupakan jejaring sosial yang menempati peringkat pertama paling banyak dikunjungi di seluruh dunia[1]. Banyaknya pengunjung yang menggunakan jejaring sosial merupakan kesempatan baik bagi para blogger untuk membagikan setiap artikelnya kedalam situs jejaring sosial dengan harapan semakin banyak pengunjung yang datang untuk membaca-baca blog kita, tentunya hal ini sangat berpengaruh terhadap posisi blog kita di mata mesin pencari. Namun jika kita sendiri yang membagikan artikel demi artikel dari blog kita ke situs jejaring sosial, maka para pengunjung yang akan datang ke blog kita hanya sejumlah teman-teman yang ada pada jejaring kita saja. Untuk itu menambahkan tombol atau link yang berfungsi untuk membagikan artikel kita ke situs jejaring sosial sangat bermanfaat agar para pengunjung blog kita dapat membagikan link artikel kita ke jejaring mereka.

Ads Popup - Iklan Yang Muncul Tiba-tiba (Update!)

| | , | 32 komentar
Sudah mencoba artikel "Membuat Wadah Iklan Tiba-tiba Muncul (Ads Popup Container)"? Nah, artikel ini merupakan update dari artikel sebelumnya yang tentunya dengan tampilan baru dan lebih segar. Walaupun masih menggunakan script yang sama tapi sekarang Blogger TuneUp menggunakan sentuhan yang lebih bagus pada kode CSS versi 3. Penasaran?

Memasang Efek jQuery Image Zoom Versi 2.0

| | , | 19 komentar
Bismillah... Lama Blogger Tune-Up berdiam dalam hiruk pikuk nge-blog. Mohon ma'af yang sebesar-besarnya pada teman-teman blogger, tidak bermaksud untuk tidak menghormati tapi karena ada satu dan lain hal, maka Blogger Tune-Up harus rehat dulu beberapa hari untuk tidak menulis artikel. Tapi Insya Allah mulai hari ini Blogger Tune-Up akan aktif kembali menulis artikel.

Menciptakan Bayangan Gambar (Image Reflexion)

| | , | 11 komentar
Bismillah. Ketika suatu objek benda ditempatkan diatas sebuah permukaan yang rata dan mengkilap (misal kaca) maka akan terbentuk bayangan yang hampir sama dengan objek tersebut di atas kaca. Bayangan yang terbentuk diatas kaca semakin jauh jaraknya dengan objek maka akan semakin kabur (tidak jelas). Sekarang kita akan menggunakan plugin reflex untuk menciptakan efek bayangan pada gambar-gambar artikel blog kita, sehingga tampilannya semakin menarik. Menurut sang pembuat efek plugin reflex[1] ini, beliau terinspirasi dari tampilan desktop Mac OS. Efek bayangan ini mengingatkan pada salah satu kemampuan software Adobe Photoshop (perspective) dan kemampuan software 3D Studio MAX (raytrace). Mari kita coba menerapkan efek reflex ini pada blogger.