msgbartop
komunitas para newbie
msgbarbottom

31 Jan 12 Lacak Posisi Pacar Pakai Google Latitude

Aduh pacar ane kemane yach? ditelpon bilang dirumah, taunye ane cari kerumah kagak ade? Artinya pacar ane boong…terus ane musti cari kemane?

Gak pake ribet sob, daftarin aja di Google Latitude,,, jamin dech ente tau posisi pacar ente layaknya GPS yang real time lengkap dengan maps ala google yg super detail ampe gang-gang ama RT/RW posisi pacar ente ketahuan,,, (Lebay dikit)

For Google Latitude

03 Nov 11 Problem Solved jQuery Datepicker on Thickbox Page

KomunitasKami.comThickbox merupakan sebuah tools yang berbasis jQuery dimana dengan thickbox kita bisa membuat sebuah aplikasi katakanlah seperti input data namun dalam tampilannya dimuncul dalam sebuah dialog box, sehingga web page tidak berpindah tempat, misalnya diawal anda berada di index.php maka dengan thickbox untuk memunculkan page input.php, browser tidak akan me-refresh ke page input.php, namun page.php dimunculkan melalui sebuah dialog box (masih di index.php).

Adapun tampilan thickbox seperti dibawah ini:

Thickbox Design

Nah masalah yang muncul adalah bagaimana jika anda menggabungkan jQuery function seperti datepicker pada thickbox? Hal ini menjadi kendala bagi saya sehingga saya mencoba untuk mencari tau dan akhirnya menemukan solusinya di situs ini.

Ternyata permasalahan diatas sangat simple sekali pemecahannya,,, cukup menaruh function Datepicker jQuery pada page yang ingin dimunculkan dengan thickbox, hehehe…. akhirnya nemu juga.

Sekian dari cilphie…contributor yang aduhai wkakakaka….

 

 

26 Jul 11 Pangkas Load Time Dengan CSS

Meminimalkan load time akses sebuah website bisa dilakukan dengan penerapan teknik css, yang dikenal dengan nama css sprite. Css sprite adalah sebuah metode pengurangan permintaan akses gambar dari sebuah website dengan mengumpulkan beberapa gambar menjadi satu kesatuan gambar, sehingga user hanya perlu mengakses gambar sekali waktu saja.

Untuk menggabungkan beberapa image menjadi satu kesatuan image cukup mudah, anda bisa menggunakan Aplikasi Design dan bisa juga menggunakan tools online CSS Sprites Generator. Nah setelah mempunyai satu master image dan file “gambar palsu” gif.gif, sekarang masuk ke bagian yang mengasikkan, yakni modifikasi file CSS nya. Pada prinsipnya CSS Sprites ini memanfaatkan satu gambar untuk berbagai macam fungsi background. Gambar besar itu hanya digeser-geser agar memunculkan bagian yang tepat di tempat yang diinginkan. Proser geser-menggeser ini berlangsung di sisi browser client sehingga tidak ada lagi transfer file gambar, begitu gambar masternya sudah di download oleh client. Inilah yang mempercepat waktu loading yang dibutuhkan situs kita.

Sebagai contoh untuk background Header Blog saya, awalnya saya menggunakan

#header{background:#EDEBD6 url(images/header-bg.png) no-repeat scroll 100% 0pt;height:143px;width:930px;padding:0;}

kemudian saya ubah menjadi:

#header{background:transparent url(images/imggatzet.png) top left; background-position: 0px 0px; height: 133px; width: 930px; }

Bagian yang saya tebalkan itu adalah fungsi untuk menggeser gambar ke posisi yang diinginkan. background-position: 0px 0px menunjukkan posisi sudut kiri atas dari bagian gambar yang dimunculkan. Dan kemudian agar gambar lainnya tidak ikutan muncul di header, ukuran kotaknya harus dibatasi dengan parameter height: 133px; width: 930px; dengan demikian bagian gambar yang lainnya akan tersembunyi.

Contoh lainnya adalah untuk background footer. Sebelumnya saya menggunakan :

#footer{color:#FFFFFF;background:#EDEBD6 url(images/nfooter-bg.png) no-repeat scroll 100% 0pt;height:90px;clear:both;padding:25px;}

kemudian saya ubah menjadi

#footer{background:transparent url(images/imggatzet.png) top left; background-position: 0 -240px;height:90px;clear:both;padding:25px;}

Pada parameter ini ada angka -240px, karena posisi gambar untuk footer yang saya butuhkan berada di 240pixel dari sisi atas master image (untuk lebih jelasnya bisa mengacu ke contoh master image yang saya sertakan), dan perintah background position: 0px -240px ini bisa diartikan geser gambar 240 pixel ke bawah.

Contoh ketiga adalah untuk logo blog. Sebelumnya saya menggunakan image link biasa untuk memunculkan logo.

< img src="http://www.komunitaskami.com/WordPress/wp-...es/gatzet.png" alt="gatzet info" style="margin-left:20px;float:left;border:none;" width="338" height="110"/>

kemudian saya ubah menjadi

< img src="http://www.komunitaskami.com/WordPress/wp-...mages/gif.gif" alt="gatzet info" width="1" height="1" style="border:none;" />

Disini gambar yang diload saya ganti menjadi gambar kosong berukuran 1×1 pixel untuk tidak menyalahi aturan HTML. Sedangkan gambar aslinya disertakan dalam fungsi

yang saya tambahkan ke dalam CSS.

#titlepage{background:transparent url(images/imggatzet.png) top left; background-position: -210px -118px; height: 110px; width: 320px; margin:0 0 0 20px; float:left; border:none; }

Lagi-lagi di sini masih menggunakan gambar master yang sama, dan perhatikan juga nilai background-position yang berarti menggeser gambar 210 pixel ke kiri dan 118 pixel ke bawah.

Prinsip CSS Sprites ini bisa digunakan di semua bagian template situs kita yang membutuhkan gambar. Misalkan icon-icon untuk social network (digg, furl, delicious.. dsb, yang biasanya di load satu per satu) bisa digabungkan menjadi satu gambar saja.

Menurut saya, saat menggunakan CSS Sprites ini, hal yang paling melelahkan adalah menentukan posisi yang tepat untuk memunculkan gambar. Memunculkan alat bantu ruler di Photoshop atau GIMP yang saya gunakan memang sangat membantu, setidaknya untuk pedoman awal penentuan posisi gambar.

Namun tetap saja mesti dilakukan fine adjustment di semua bagian saat CSS Sprites sudah berada di server. Sehingga akan lebih baik jika untuk proses uji cobanya dilakukan di server lokal anda dulu, baru setelah semua sempurna bisa di upload ke server utama.

Sumber

09 Jul 11 Google Plus – New Social Network

Google + merupakan sebuah sosial network baru yang merupakan project dari perusahaan besar Google. Setelah berhasil menciptakan sebuah engine untuk Tombol Like, kini dilengkapi dengan sebuah sosial network yang banyak diperbincangkan sebagai Facebook Killer.

Apa saja yang terlihat menarik di sosial network besutan google ini?

1. Simple Design
Google selalu menciptakan sebuah tools atau media yang mudah digunakan oleh banyak orang, kesederhanaan tampilan membuat banyak orang mudah menggunakannya. Namun dibalik kesederhanaan itu tersimpan performa yang tangguh, aku rasa patut dech diancungi 2 jempol xixixi…

2. Circles
Apaan sie Circle? Bukan Circle K yach xixixi,,,, ini mah mini mart, yang ini ialah sebuah media dari google plus untuk mengumpulkan teman kedalam satu grup dimana memudahkan dalam melakukan sharing, tentunya bila sudah dibagi dalam 1 grup otomatis gak perlu susah2 lagi yaa ke add satu2 apabila kita hendak mo share sesuatu.

3. Spark
Sebuah fasilitas yang memungkinkan share sebuah artikel yang menurut kita menarik.

4. Hangout
Ini yang bisa disebut tools yang menjadikan Sosial Network ini Facebook Killer,,,tools yang memungkinkan chat dengan video gan,,,bisa konfren lagi, hebat banget xixixi…, 2 thumbs dah buat google plus

Asyiiiknya….
Google Plus memungkinkan kita menambahk dan menghapus sesuatu dengan Drag and Drop xixixi, sebuah fitur yang asyik punya gak sekedar klak klik mouse xixixi…

Daaan, sudah dilengkapi dengan Google +1 donk buat menilai komen kita seperti like di facebook xixixi

06 Jul 11 WordPress Update Version 3.2

Wordpress New Release

WordPress Update Version 3.2 adalah versi core wordpress terakhir saat ini mas bro, dimana fokus dari release core WordPress Versi 3.2 ini ialah menjadi WordPress Update Version 3.2 sebagai sebuah tools yang cepat dan ringan.

WordPress Update Version 3.2 ini memiliki beberapa fitur-fitur canggih yang merupakan tambahan baru dari core sebelumnya yang belum pernah ada dan beberapa perbaikan baik itu dari design ataupun sekuriti holenya.

WordPress Update Version 3.2 memiliki beberapa fitur unggulan yaitu:
1. Full Screen Write Content
Adalah sebuah fitur fullscreen yang dapat digunakan kita saat ingin menulis konten sehingga kita dapat lebih lega dan lapang dalam menulisnya, karena benar-benar lebar sebesar display kita xixixi…, yang pake notebook,,,ini sebuah solusi yang menjanjikan coz layar yang cuman 10″ terpakai semua xixixi…

2. New Twenty Eleven Theme
Adalah sebuah theme default baru dari wordpress, yang memiliki design simple elegan, dapat berjalan baik disemua platform termasuk handphone mas bro hehehe,,, juga design headernya berupa image dapat diganti-ganti seperti theme default sebelumnya. Hanya saja yang baru ini image tersebut dapat dipilih dan dicrop, lalu bisa dijadikan slideshow loh dengan fitur random,,,so tambah cihuy dech design theme yang satu ini xixixi…

3. Conversation management komeng juga telah dibuat baru,,,sehingga terasa lebih cepat jeer,,,patut dicoba dech, kerasa banget klo komengnya buanyak xixixi…

4. Fasilitas pengecekan browser yang agan pake,,,klo udah gak uptodate langsung dikasi tau ketika agan login xixixi, hebat yaaa

Selebihnya bermain didesign theme baru, juga tambahan perbaikan lebih dari 400 perbaikan,,,hmn,,,,salutedech ama om WordPress.

Buat yang pake WP, yuk update corenya hehehe. Buat yang belom yuk download disini

By Cilphie G-Land