Ubah Background Web dengan Javascript

Merubah warna background website dengan bantuan javascript. Sebelumnya saya akan berikan sedikit pengertian dari javascript. JavaScript adalah bahasa pemrograman berbasis prototipe yang berjalan disisi klien, jadi gak perlu install server web localhost dulu deh untuk menjalankannya. Jika kita berbicara dalam konteks web, sederhananya, kita dapat memahami JavaScript sebagai bahasa pemrograman yang berjalan di browser.

Ada beberapa hal yang harus diperhatikan dalam pengelolaan pemrograman JavaScript, diantaranya JavaScript adalah “case sensitive”, yang artinya JavaScript membedakan huruf besar dan huruf kecil, Jika Anda pernah belajar bahasa pemrograman seperti Turbo C atau C++, maka sama seperti bahasa pemrograman tersebut, dimana huruf T tidak sama dengan huruf t. Dalam bahasa pemrograman JavaScript juga, sebagai contoh fungsi perintah var tidak boleh ditulis Var dan juga tidak boleh ditulis VAR (huruf besar semua), yang benar adalah var (huruf kecil semua). Perintah lain adalah new Date tidak boleh ditulis new date (huruf kecil semua), dan banyak yang lainnya.

Yah, kira-kita begitulah pengertian tentang javascript. Langsung aja deh. Coba klik link berikut :

Warna Merah

Warna Biru

Warna Hijau

Nah, sekarang saya akan berikan kode javascript untuk membuat link yang bisa menyulap warna latar belakang website. Berikut adalah websitenya:

<a href="#" onMouseOver="document.bgColor='red'">Warna Merah</a>
<a href="#" onMouseOver="document.bgColor='blue'">Warna Biru</a>
<a href="#" onMouseOver="document.bgColor='green'">Warna Hijau</a>

Silakan simpan di halaman web atau blog sobat, kemudian langsung uji coba deh tuh script.

PENJELASAN SCRIPT

Sedikit penjelasan untuk kumpulan kode di atas.

Pertama kita simpan tulisan Warna Merah, Warna Biru dan Warna Hijau di dalam tag <a> yang artinya memberikan link. Tapi biar ketika diklik gak lari ke halaman lain, maka kita isikan href nya dengan tanda pagar (#).

onMouseOver="document.bgColor='blue'"

Kode di atas berarti ketika kursor berada di atas text, maka jalankan perintah mengubah warna latar dengan javascript document.bgColor='blue' .

Sekian, jika ingin mengganti warnanya silakan ganti tulisan blue dengan warna lainnya.

Wilianto Indrawan
Seorang blogger dan freelance web developer yang suka coba-coba hal-hal baru walaupun kadang suka sok tau, but be myself..
Web: http://www.desaiklan.com

Jayalah Selalu Indonesiaku

Seharusnya Ini dipublikasikan dari sejak pagi hari tadi, namun berhubung Kang Rohman tertidur pulas dari pagi hingga tengah hari, akhirnya baru dipublikasikan sekarang. Hanya ingin mengucapkan DIrgahayu Republik Indonesia Yang Ke 65.

Jika dilihat dari umur manusia, angka 65 adalah angka dimana boleh dikatakan telah matang, matang dalam pemikiran dan matang dalam tindakan. Semoga untuk kedepannya Indonesia semakin maju dalam berbagai bidang, Baik dalam bidang teknologi, Ekonomi, dan lain sebagainya.

Selamat Hari Ulang Tahun Republik Indonesia Ke 65

Jayalah Selalu Indonesiaku

Haruskah Halaman Web Valid HTML

Haruskah sebuah halaman web / blog valid (X)HTML? Sebuah halaman web atau blog sebaiknya memang Valid (X)HTML atau lolos validasi, tapi jika mengatakan bahwa itu adalah suatu keharusan mungkin terlalu berlebihan. Kang Rohman sedikit senyum simpul ketika menjumpai blog yang begitu antusias agar halaman blognya lolos validasi HTML.

Para pengguna mesin blogger aka blogspot harus rela menerima kenyataan bahwa mesin blog yang mereka gunakan tidak lolos validasi dari w3c validator. Dari blog-blog yang pernah kang Rohman baca, diantara mereka ada yang merasa minder memakai mesin blogger, bahkan yang lebih ekstrim lagi ada yang rela migrasi dari blogger ke wordpress gara-gara urusan validasi ini.

Lagi-lagi dari apa yang pernah dibaca, mereka beranggapan bahwa sebuah halaman web yang valid (X)HTML akan sangat mendapatkan perhatian dari mesin telusur ( search engine ) atau dengan kata lain akan sangat SEO friendly. Benahkah?

Berangkat dari rasa penasaran, kang Rohman coba mengintip validitas dari situs-situs raksasa yang ada di internet. Yuk bagi yang mau ngintip, kita intip bareng-bareng.

1. Google

Ada yang tidak kenal dengan dengan situs raksasa Google? coba ah intip apakah google lolos validasi w3c validator, dan ini gambar yang di dapatkan :

Upsss. menurut W3C Validator, halaman google.com yang hanya seiprit mempunyai sampai 35 error dan 2 warning. Ternyata Google tidak terlalu perduli akan validasi dari W3C validator, ini terbukti dengan membiarkan halaman mereka tidak lolos HTMl validator.

 

2. Yahoo

Pilihan kedua jatuh ke search engine raksasa Yahoo.com. Berharap bahwa yahoo bisa lolos validasi. Berikut hasil pengecekannya :

Duh. hasilnya mengatakan bahwa yahoo memiliki 161 error dan 32 warning. Lagi-lagi yahoo.com juga tidak perduli akan kevalidan halaman web mereka.

 

3. Bing

Coba mengintip situs raksasa bing, mungkin akan lain hasilnya :

Hasilnya mendapatkan 12 error. Ah, bing juga tidak perduli dengan validasi HTML halaman web mereka.

 

4. Facebook

Mungkin karena ketiga situs diatas merupakan search engine, mereka kurang perduli akan kevalidan halaman web mereka, coba beralih ke situs jejaring sosial raksasa facebook. Berikut hasil intipannya :

Tidak tahu kenapa ketika mengecek validasi dari facebook.com, yang keluar jasilnya adalah untuk halaman http://m.facebook.com/?w2m&refsrc=http%3A%2F%2Fwww.facebook.com%2F&r1cc4a831. Tapi yang jelas hasilnya adalah mendapatkan 9 error.

 

5. Twitter

Yang suka berkicau, pasti kenal situs microblogging twitter. Hasil intipannya :

Twitter.com mendapatkan 17 error dan 70 warning. Tidak valid juga ternyata.

 

6. Wordpress.com

Berharap mendapatkan hasil yang berbeda dari penyedia blog populer saat ini wordpress.com. Hasilnya :

Lagi, ternyata wordpress.com juga mendapatkan 9 error.

 

7 Matt Cutts Blog

Iseng-iseng mengintip dari blog bapak SEO google Matt Cutts. Mungkin hasilnya lain kali yah jika dari bapak SEO :

Oh tidak. Bapak SEO google yang inipun mendapatkan 14 error untuk halaman depannya. Jadi, bapak SEO ini ternyata tidak terlalu perduli juga akan kevalidan halaman blog beliau.

 

Benarkah halaman yang valid HTML menjadi SEO friendly? melihat dari contoh kasus diatas, sepertinya tidak mutlak, karena contoh situs yang dihadirkan bukanlah situs coro seperti blog kang Rohman. Mungkin pengaruh terhadap page rank? mungkin, tapi tidak juga tuh. Data page rank situs yang dicontohkan (tentunya saat ini ) : Google.com (PR10), yahoo.com (PR9), Bing.com (PR8), facebook.com (PR10), Twitter.com (PR8), Wordpress.com (PR9). mattcutts.com/blog (PR7).

Menurut pandangan Kang rohman sendiri, membuat halaman web atau blog agar lolos validasi memang perlu dan sebisa mungkin lakukan seperti itu. Namun, hal tersebut jangan terlalu dibesar-besarkan, jangan terlalu membuang waktu dengan memaksakan halaman blog anda harus bisa valid, fokuslah ke konten blog karena pengunjung melihat isi dari blog anda bukan dari kevalidan blog anda.

Catatan Tambahan :

• Artikel diatas bukanlah suatu hal provokasi, hanyalah sebuah tulisan yang mungkin tanpa makna.
• Hasil validasi diatas berlaku hanya pada saat artikel ini di publikasikan, jika anda membacanya diwaktu yang akan datang, tentunya akan berbeda hasilnya.
• Untuk anda pengguna mesin blogger yang notabene tidak valid HTML, tidak usah minder. Blog anda dinilai dari isi blog anda bukan dari segi validitas.
• Untuk anda yang sibuk dengan validasi, silahkan Lanjutkan, jangan terganggu dengan artikel ini. Langkah anda sudah pada jalan yang benar.

Sistem Kometar baru Di blogger

Lagi, blogger mengeluarkan fitur baru. Jika sebelumnya telah dikabarkan bahwa blogger mengintergarsikan statistik blogger langsung ke dashboard blogger, kini dirilis tentang sistem komentar baru di blogger.

Beberapa hari yang lalu blogger buzz mengabarkan akan sistem komentar baru yang dipakai oleh blogger. Dengan sistem komentar yang baru ini, kita sebagai pengguna blogger dapat melihat komentar-komentar yang telah di terbitkan, Menunggu moderasi, atau dideteksi sebagai komentar spam. Jadi, tentunya sistem yang baru ini lebih efektif daripada sistem komentar yang sebelumnya dipakai.

Dari pengamatan kang Rohman. Tab menu khusus komentar tersebut akan muncul jika kita mengaktifkan fungsi moderasi untuk komentar.

Disebutkan bahwa saat ini belum semua blogger mendapatkan fasilitas sistem komentar baru ini, namun dalam waktu dekat tentunya fitur tersebut akan segera anda nikmati.

Tips menampilkan postingan hanya judulnya saja

Fasilitas ‘Tanya Saja!” kolom tutorial rupanya banyak mendapatkan perhatian dari para pengunjung. Puluhan pertanyaan telah masuk, sebagian sudah dijawab secara langsung dan ada juga yang melalui postingan untuk pertanyaan yang memang memerlukan jawaban yang lebih rumit. Yang pertanyaannya belum dijawab, mohon sabar yah, mudah-mudahan nanti bisa terjawab

Pertanyaan :

Kang Rohman... sebelumnya saya minta maaf kl email saya menggangu, saya ingin tanya kang, gimana caranya menampilkan postingan yg hanya tampil judul postingannya saja

Jawaban :

Memang, beberapa blogger memilih blognya hanya menampilkan judul posting saja pada halaman depan atau home page. Mungkin dasar pemikiran dari pemilik blog itu sendiri adalah menampilkan hanya judul posting saja dapat menghemat ruang sehingga jumlah post yang ditampilkan bisa lebih banyak pada halaman depan atau beranda. alasan pendukung lainnya mungkin karena judul posting sangat mewakili isi dari posting itu sendiri sehingga dengan menampilkan judul posting di halaman depan lebih memungkinkan artikelnya akan lebih banyak di baca oleh para pengunjungnya. Berikut contoh blog yang hanya menampilkan judul post nya saja :

Agar pada halaman depan hanya menampilkan judul posting saja, berikut langkah-langkahnya :

• Silahkan login ke blogger dengan ID anda.
• Klik Rancangan

     

• Klik menu Edit HTML.

  

• Disarankan untuk membuat backup terlebih dahulu, klik pada tulisan Download Template Lengkap.

  

• Carilah kode ]]></b:skin>
• Copy kode berikut, lalu paste di bawah kode ]]></b:skin>

       
       <style type='text/css'>
       <b:if cond='data:blog.pageType != &quot;item&quot;'>
       <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
       .post-body{display:none;}
       </b:if>
       </b:if>
       </style>
      

  
  



• Klik tombol SIMPAN TEMPLATE.



• Selesai. Silahkan lihat hasilnya.

Mudah bukan? namun, dengan memasang kode diatas masih menyisakan beberapa elemen seperti tanggal posting, komentar dan yang lainnya. Jika anda ingin menghilangkan semuanya dan yang tersisa hanya judul post nya saja, mungkin anda bisa menggunakan kode berikut :

     
     <style type='text/css'>
     <b:if cond='data:blog.pageType != &quot;item&quot;'>
     <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
     .post-body, .post-footer, .jump-link, 
     .post-timestamp, .reaction-buttons, 
     .star-ratings, .post-backlinks, 
     .post-icons, .date-header{display:none;}
     </b:if>
     </b:if>
     </style>
    

Jika ternyata masih ada elemen tersisa selain judul post, mungkin kode template anda tidak mengikuti standar template blogger. Bagaimana solusinya? anda harus mengenali struktur template anda.

Bagi anda pengguna browser internet firefox, kang Rohman punya tips mudah mengenali struktur template anda yaitu dengan menginstall add-ons Web Developer yang bisa anda download di add-ons for firefox.

Sekarang kang Rohman anggap anda telah menginstall add-ons web developer pada firefox yang anda gunakan. Silahkan buka alamat blog anda ( tentunya yang akan di edit sesuai artikel diatas ). Klik menu Information, kemudian pilih Display Div Order.

Maka secara otomatis akan ditampilkan struktur div dari template anda. Contoh gambar :

Dari gambar tersebut terlihat bahwa tanggal posting serta komentar disimpan dalam elemen div :

.databarleft

.datebarright

 

Sehingga kode yang digunakan menjadi seperti ini :

     
     <style type='text/css'>
     <b:if cond='data:blog.pageType != &quot;item&quot;'>
     <b:if cond='data:blog.pageType != &quot;static_page&quot;'> 
     .post-body, .databarleft, .datebarright{display:none;}
     </b:if>
     </b:if>
     </style>
    

Semoga bisa difahami.

Update : kode telah di sempurnakan agar tidak konflik dengan static page / static post

Pengenalan (dasar) PHP

Menurut dokumen resmi PHP. PHP merupakan singkatan dari Hypertext Preprocessor. PHP merupakan sebuah file teks yang terpasang pada HTML dan merupakan bahasa berbentuk script yang ditempatkan dalam server dan diproses di server. Hasilnya dikirimkan ke klien tempat pemakai menggunakan browser. Analogikanya PHP merupakan bahasa pemrograman web yang bersifat server side html atau embedded scripting, dimana sintaknya menyatu dengan sintak HTML. Tujuan dari PHP ini sama dengan HTML yaitu untuk memungkinkan webdesain membuat halaman web dengan relatif mudah dan cepat.

Secara khusus PHP, dirancang untuk membentuk aplikasi web dinamis. Artinya dapat membentuk suatu tampilan berdasarkan permintaan terkini. Misalnya Anda bisa menampilkan isi database ke halaman web. Pada prinsipnya PHP mempunyai fungsi yang sama dengan script-script seperti ASP (Active Server Page), Cold Fusion ataupun Perl. Namun perlu diketahui bahwa PHP sebenarnya bisa dipakai secara command line. Artinya script PHP dapat dijalankan melibatkan web server maupun browser. Yang menarik kode PHP juga bisa berkomunikasi dengan database dan melakuakan perhitungan-perhitungan yang kompleks sambil jalan.



Kelahiran PHP bermula saat Rasmus Lerdorf membuat script PERL yang dapat mengamati siapa saja yang melihat-lihat daftar riwayat hidupnya yakni pada tahun 1994. Script-script ini selanjutnya dikemas menjadi tool yang disebut "Personal Home Page". Paket inilah yang menjadi cikal bakal PHP. Pada tahun 1995, Rasmus menciptakan PHP/FI versi 2. Pada versi inilah pemrograman dapat menempelkan code terstructur di dalam tag HTML.



Pada saat ini PHP cukup populer sebagai pemrograman Web, terutama di lingkungan Linux. Walaupun demikian, PHP sebenarnya juga dapat berfungsi pada server-server yang berbasi UNIX, Windows, Macintosh.



Pada awalnya PHP dirancang untuk diintegrasikan dengan webserver Apache. Namu belakangan PHP juga dapat bekerja dengan web server seperti PWS (Personal Web Server), IIS (Internet Information Server) dan Xitami.



Untuk mencoba PHP, Anda tidak perlu menggunakan komputer berkelas server. Hanya dengan sebuah komputer biasa, Anda bisa mempelajari dan mempraktikan PHP.

PHP bersifat bebas dipakai, Anda tidak perlu membayar apa pun untuk menggunakan perangkat lunak alias Free. Anda bisa men-downloadnya melalui situs http://php.net/ PHP tersedia dalam bentuk kode binner maupun kode sumber yang lengkap.

HUBUNGAN PHP dengan HTML

Sekilas tentang HTML



HTML merupakan Hyper Text Markup Language. HTML merupakan dokumen yang disajikan dalam suatu web yang dapat dibuat dengan teks editor semisal notepad.



Lalu apa hubungan antara PHP dengan HTML? Suatu halaman web biasanya disusun dari file teks murni HTML yang kemudian disimpan pada sebuah file yang berekstensi *.html File tersebut dikirimkan oleh host server ke web browser, seperti IE, Opera, Nescape Navigator, Mozila Firefox, dll yang kemudian file tersebut diterjemahkan sehingga menghasilkan suatu halaman web yang indah. Beda halnya dengan PHP file ini berekstensi *.php kemudianfile tersebut harus diterjemahkan oleh web server sehingga menghasilkan file html yang kemudian dikirim ke web browser agar dapat ditampilkan pada suatu halaman web.

Author : Gus Ikhwan

CSS writer, web enthusiast, yang berhasrat menjadi web developer dan Tidak bisa hidup tanpa Gmail, Google Reader dan Twitter.

Marhaban Ya Ramadhan 1431H

Marhaban Ya Ramadhan 1431H. Alhamdulillah. Rupanya Allah SWT masih mengijinkan kang Rohman untuk bertemu dengan bulan suci ramadhan tahun ini. Marilah kita  sambut bulan yang suci ini dengan hati yang penuh keikhlasan.

Tentu, dalam perjalanan setahun ke belakang kang Rohman banyak sekali berbuat dosa, baik yang disadari ataupun yang tidak di sadari, oleh karenanya Kang Rohman secara pribadi beserta keluarga mohon maaf lahir dan bathin atas segala khilaf yang telah di perbuat selama ini kepada anda para pengunjung setia blog kang Rohman.

 

مَرْحَبًا يَا رَمَضَانُ