Customize Google Search Engine

Customize Google search engine ini dimaksudkan untuk mempercantik form Google search engine yang telah banyak dipasang di Website. Baik website pribadi, korporasi maupun Web-log site / blog-site.

Kodenya sendiri telah banyak di-post oleh para pemurah maupun para "pencari uang di Internet".
Kita semua mahfum, bahwa dengan memasang search-engine dari Google kita bisa mendapatkan penghasilan tambahan. Semakin banyak search-engine tersebut dipasang di berbagai tempat, semakin besar pula kesempatan untuk mendapatkan perolehan dana dari Google.

Pada kesempatan ini, saya tidak akan memberikan kode search-engine yang menguntungkan saya. Kode-kode berikut ini, tidak ada muatan komersial.

Baiklah, kita mulai dengan kode asal, plain search-engine yang tidak dipercantik oleh background maupun foreground.
Source code, plain Google Searh Engine :

<form name="form" method="get" action="http://www.google.com/search" class="searchinput"><input height="2" type="text" value=" " title="Type for search and Enter" size="27" framewidth="1" name="q"/><input type="hidden" value="http://trickmp.multiply.com" name="sitesearch" checked="checked"/><input type="submit"  value="search" name="sa"/></form>

Hasilnya :

Berbekal source-code tersebut, sekarang akan saya beri sedikit accessories, tombol submit "Search" saya ganti dengan gambar / image kaca pembesar. Image diambil dari site Multiply.com
Dan, source code nya :

<form name="form" method="get" action="http://www.google.com/search" class="searchinput"><input height="2" type="text" value=" " title="Type for search and Enter" size="27" framewidth="1" name="q"/><input type="hidden" value="http://trickmp.multiply.com" name="sitesearch" checked="checked"/><input type="image" title="Search" src="http://images.multiply.com/multiply/icons/clean/24x24/search.png" searchsubmit="" name="" alt="Search"/></form>

Hasilnya :

Sepertinya sudah bagus, tapi masih kurang sempurna.
Penempatan field isian dan gambar tombol tidak sejajar.
Ingat, browser akan menempatkan gambar sesuai dengan kaidahnya, yaitu dimulai dari kiri bawah.
Dengan demikian, tampilan tersebut memang sudah benar. Hanya saja tidak sedap dipandang.
Untuk mensejajarkannya, saya akan memasukkan dua object tersebut kedalam table yang mempunyai 1 baris dan 2 kolom.
Rencananya, field isian saya tempatkan di kolom kiri dan gambar kaca pembesar saya tempatkan di kolom sebelah kanan, keduanya pada baris yang sama.

<form name="form" method="get" action="http://www.google.com/search" class="searchinput"><table><tbody><tr><td><input height="2" type="text" value=" " title="Type for search and Enter" size="27" framewidth="1" name="q"/><input type="hidden" value="http://trickmp.multiply.com" name="sitesearch" checked="checked"/></td><td><input type="image" title="Search" src="http://images.multiply.com/multiply/icons/clean/24x24/search.png" searchsubmit="" name="" alt="Search"/></td></tr></tbody></table></form>

Sudah cukup baik dan semua sudah pada tempatnya. Form ini sudah dapat diletakkan dimana saja.

Kadangkala, saya memerlukan pewarnaan, agar bisa lebih serasi dengan area sekitarnya.
Saya akan memberikan style kepada Table tempat form.

<form name="form" method="get" action="http://www.google.com/search" class="searchinput"><table style="background:#B0B0B0 none repeat scroll 0 0;padding:5px;"><tbody><tr><td><input height="2" type="text" value=" " title="Type for search and Enter" size="27" framewidth="1" name="q"/><input type="hidden" value="http://trickmp.multiply.com" name="sitesearch" checked="checked"/></td><td><input type="image" title="Search" src="http://images.multiply.com/multiply/icons/clean/24x24/search.png" searchsubmit="" name="" alt="Search"/></td></tr></tbody></table></form>

warna #B0B0B0 bisa diberi nilai lain, yang sesuai.

Apabila ditambahkan background ( HS saya sebagai image background ) :

<form name="form" method="get" action="http://www.google.com/search" class="searchinput"><table style="background:transparent url(http://images.dangdutkoplo.multiply.com/logo) repeat scroll 0 0;padding:35px;"><tbody><tr><td><input height="2" type="text" value=" " title="Type for search and Enter" size="27" framewidth="1" name="q"/><input type="hidden" value="http://trickmp.multiply.com" name="sitesearch" checked="checked"/></td><td><input type="image" title="Search" src="http://images.multiply.com/multiply/icons/clean/24x24/search.png" searchsubmit="" name="" alt="Search"/></td></tr></tbody></table></form>

Semua contoh di atas, bukan image, tapi di-create dari HTML.
Dengan mengisi form tersebut, Anda dapat mecobanya.
Ganti value="http://trickmp.multiply.com" dengan URL Anda.
Semoga bermanfaat.
Enjoy.

Cara Membuat Screenshot

maap banget ini udah basbang (basi banget). tapi saya angetin lagi, yah? hihi. buat yang belom tau aja gitu. berikut ini adalah cara membuat screenshot. yaa.. nge-foto yang ada di kompi gitu lah.
ini cara yang paling simpel aja. dan gambarnya penuh juga.

1. Langkah pertama, cari dan tekan tombol "Print Screen SysRq" yang ada di dekat Insert, Scroll Lock, dll.
Contoh halaman yang akan difoto:
2. Buka program Paint. Klik Edit > Paste. atau CTR + V.


3. Hasilnya akan jadi seperti ini:



Tinggal di save deh.

Siapa Saja ang Bisa Melihat CSS Kita?

Tulisan ini saya terbitkan guna menjawab beberapa pertanyaan kepada saya, tentang bisakah kita memonitor dan mengetahui siapa saja yang "mengintip" CSS pada umumnya, dan Custom-CSS MP pada khususnya.

Secara garis besar, CSS atau Cascading Style Sheet adalah sekumpulan kode perintah kepada browser untuk mengatur penampilan halaman / page yang muncul di layar oleh perintah HTML ( Hyper Text Markup Language ).
Pada kode HTML bisa juga disertakan kode "style" yang pada ujungnya juga mampu mengatur penampilan dari perintah yang bersangkutan.

Singkatnya, HTML adalah perintah untuk menampilkan object di layar browser dan CSS adalah yang mengatur bagaimana object tersebut tampil di layar (atau juga di printer).

Hanya saja, jika style tersebut ditempatkan di dalam HTML, maka pada saat diperlukan perubahan akan menyebabkan editing per-bagian di HTML. Dan ini akan membuat perancangan halaman web menjadi sangat tidak praktis dan memakan waktu.
Untuk mempermudah seting tampilan, maka dibuat sebuah atau beberapa kelompok pengatur yang selanjutnya disebut sebagai Style Sheet. Dan sering kita dengar dengan sebutan CSS.

CSS dalam file terpisah selalu dipanggil paling awal, karena jika dipanggil belakangan ... akan terlambat. Konten sudah terlanjur tampil baru disusul oleh pengaturnya dan bagaimana cara tampil.
Pada site multiply.com atau page MP kita, CSS selalu di-load pada awal pemuatan halaman.
Dengan demikian, siapa saja yang bisa memanggil dan menampilkan page kita ... mereka juga bisa melihat source-code HTML kita dan juga sekaligus CSS-nya.

Tidak ada cara untuk mengetahui siapa saja yang "mengintip" CSS kita.
Jangankan Multiply-User yang sudah tercatat, para pengguna Internet di seluruh dunia, asal bisa menampilkan page kita juga bisa melihat CSS kita, karena ... CSS kita memang harus di-load oleh browser mereka. Dan dengan leluasa juga bisa dilihat dan dicopy yang pada ujung-ujungnya, diaplikasikan ke page / site mereka.

Dengan demikian, jangan terlalu berharap akan CSS yang sudah anda rancang selama berminggu-minggu aman dari penjiplakan. CSS kita sangat-sangat rentan terhadap penjiplakan.
Yang bisa Anda lakukan adalah, berbesar hati bahwa CSS anda telah dipakai dan itu mempunyai satu arti ... CSS anda memang laik dipakai, berbanggalah.

Semoga bermanfaat.
Enjoy.

Tutorial Merapikan Video Thumb di Video Page

Merapikan jajaran Video Thumb di Video Page dengan CSS.

Untuk melakukannya, anda hanya perlu menambahkan deklarasi satu set ( blok ) selector saja. Dan berikut adalah Preview-nya .

Sebelum perapian :



dan setelah perapian :



Tambahkan blok kode CSS di bawah ini kedalam Custom CSS Anda.

.videothumb {
float: left;
font-size: 10px;
margin: 10px;
overflow: hidden;
text-align: left;
width: 140px;

}

Yang perlu diperhatikan adalah width: 140px; , lebar ini saya sesuaikan untuk lebar content termuat di item box yang hanya 528px ( fix ) pada AVLACK.
Jika theme anda mempunyai lebar item box yang auto atau bisa bervariasi seperti SKYLINE basic theme, Anda harus "bereksperimen" untuk menentukan lebar thumb yang ideal untuk theme Anda.

Anda Juga bisa set margin dan padding-nya agar thumb dapat berjajar rapat atau renggang, sesuai keinginan Anda.

Adapun seting overflow: hidden; dimaksudkan untuk memotong lebar gambar thumb yang melebihi width 140px ( hidden / terpotong di sebelah kanan ).
Multiply meng-capture video untuk dijadikan image thumb berdasarkan aspect-ratio video yang Anda upload. Bisa 3:4 ( layar TV konvensional ) atau 9:16 ( Wide Screen video output ) atau berapapun rasio aspek Video Anda.

Semoga bermanfaat.
Enjoy.

Scribe 3.1.6

Kamu kepengen posting di blog kamu (wordpress, movable type, drupal, textpattern, roller, metaweblog api, blogger atau tumblr) tapi kamu lagi males join di sitenya
aneh dech pengen post tapi males join

Tapi gak masalah kok, begitulah klo jadi org males maunya simple ajah, ya iyalah masa iya domz

mau tau caranye?

download ajah attachmentnya terus instal di firefoxna. Udah gitu gimana lagi?

ya liat domz dipojok kanan bawah mozillamu, disitu ada plugin warna orange kamu klick ajah dech, ntar muncul kok tampilan Scribefirenyanya.

Selanjutnya kamu login ajah melalui Scribefire terus posting dech di blog kamu (blogger). Pengen posting di wordpress juga? login lagi dech di scribefire terus post lagi dech tanpa harus membuka halaman blog kita

sayang blom bisa buat multiply

Next.... icon buat posting di multiply tanpa menggunakan HTML

Attachment: scribefire-3.1.6-fx+sm.xpi

CSS untuk dua Background Image pada satu halaman

CSS untuk menampilkan dua image-background sekaligus pada sebuah halaman ini cukup sederhana dan tidak ribet.

Pada kesempatan ini saya hanya akan memberikan dasar-dasar trick-nya saja. Tidak membahas secara keseluruhan sebuah Theme.
Saya berharap, Anda akan dapat mengembangkan sendiri CSS tersebut hingga membentuk sebuah Style Sheet yang lengkap, yang dapat mengatur bagaimana page Anda tampil, sesuai keinginan Anda.

Artikel ini saya terbitkan guna menjawab beberapa pertanyaan yang sering saya terima, baik di page DK maupun di group ini yaitu, bagaimana agar background tidak tampil terpisah / terpotong-potong (saat diberi value repeat, repeat-x). Pada kesempatan tersebut, ada masukan / ide dari Juriglagu tentang memberikan background sebanyak dua buah. Secara kebetulan, beliau pasang dua buah tapi tampil secara bergantian dengan perintah hover ( hover pseudo-class ).
Berikut adalah block CSS-nya.

/* --- Background Left-side --- */
body {
background:#FFFFFF url(http://i271.photobucket.com/albums/jj141/dangdutkoplo/scratch/JL-bg-left.jpg) no-repeat Bottom Left fixed;
}

/* --- Background Right side --- */
div.bodywrap {
background:transparent url(href="http://i271.photobucket.com/albums/jj141/dangdutkoplo/scratch/JL-bg-right.jpg) no-repeat Bottom Right fixed;
}

/* --- Content Wrapper HARUS transparent --- */
div.contentwrapper {
background-color:transparent;
}Penjelasan :

Seting background untuk sebelah kiri, ditangani oleh tag selector body.
Seting background untuk sebelah kanan, ditangani oleh selector pada class bodywrap.
Agar semua background tampil, seting background color pada contentwraper harus di-set ke transparent. Jika tidak di-set ke transparent, tampilan anda akan ditutupi oleh warna background dari contentwrapper.

Pemakaian background ganda ini saya susun dari Whiteout base theme.
Pilih theme Whiteout, isikan group deklarai selector di atas ke dalam Custom CSS.
Jalankan, dan perhatikan efeknya. Tidak mengecewakan.

Terimakasih kepada Juriglagu atas idenya dan sekaligus dengan 2 buah image yang menjadi background dari CSS ini.





Semoga bermanfaat.
Enjoy.

Membuat Domain Gratisan dan Install Wordpress

Ayo.... siapa sih yang gak kenal sama Wordpress? Emang sih, pemakai Wordpress gak sebanyak Blogspot, tapi wordpress menang dalam pemakaian domain sendiri. Contohnya domain gratis yang aku buat nih Promoonly dan iLLymeYde Nah…, untuk membuat blog, kali ini kita akan belajar install wordpress secara manual. Untuk itu pastikan udah punya hosting dan domain. Karena hanya belajar, pakai aja yang gratis, 000webhost untuk hosting dan co.cc untuk domainnya.

Cara Pertama, daftar dolo di co.cc
1. Isi semua kolom yang di centangin. Klo dah jadi kita lanjut ke nomor 2
2. Pilih "Getting A New Domain"

3. Tulis alamat yang ingin kamu gunakan terus pilih check availability
4. Klo berhasil akan muncul Url "http://......co.cc is available
5. Terus pilih Continue to registration terus pilih lagi set up
6. Nah akan muncul 2 tampilan domain: co.cc dan cc.cc. Kamu pilih setup co.cc ajah
7. Terus centangin yang bulet di depan nomor 1 "Manage DNS"
8. Isi Name Server 1 dengan ns01.000webhost.com dan Name Server 2 dengan ns02.000webhost.com

9. Terus Setup dan OK

Cara kedua, kamu buka Wordpress.org kemudian download wordpressnya Kemudian buka archive yang didapat. Dalam archive itu ada folder wordpress. Ambil semua file dan folder yang ada di dalamnya dan buat menjadi satu archive sendiri, bukan dalam folder. Ini untuk memudahkan dalam penguplotan ke 000webhost.

Cara Ketiga, daftar lagi di 000webhost
1. Isi www dengan domain kamu yang didaftar di co.cc tadi, lihat gambar dibawah ajah

2. Terus create my acount dan akan muncul konfirmasi kode
3. Kamu download ajah kodenya dan masukin dikolom yang disediakan
4. Akhirnya masuk ke control panel
5. Dalam cPanel kamu pilih File Manager, maka akan ada jendela baru yang terbuka, kamu akan diminta password.

6. Sekarang kamu masuk dalam perut penyimpanan.

7. Pilih folder public_html.
Di dalamnya ada dua file, hapus aja keduanya. Jika keduanya udah dihapus, sekarang klik tombol upload, lalu pilih aja upload archive. Ingat bukan kalo tadi kita membuat archive dari semua file dan folder dari isi folder wordpress?


8. Untuk memulai proses upload, klik tanda centang. Setelah proses upload selesai, klik panah ke kiri untuk kembali ke folder public_html.
Cari dan beri tanda centang pada file wp-config-sample.php, lalu klik rename.
Pada halaman yang terbuka, ganti nama file tersebut menjadi wp-config.php. Simpan pengaturan dan kembali ke folder public_html.

Masih pada file yang sama, sekarang klik tombol edit.


Sementara biarkan saja begitu. Kita beralih ke cPanel yang tadi terbengkalai.

9. Di cPanel ini pilih mySQL, yang gambarnya lumba-lumba.
Pada halaman yang terbuka, masukkan nama data base, nama user dan pasword. Klik Create database untuk memulai proses, dan juga untuk mengantar kamu ke halaman informasi database.



10. Sekarang kembali ke jendela sebelah yang dibiarkan terbuka. Ganti bagian dbname, dbuser, pasword dan host sesuai informasi yang diberikan oleh mySQL tadi. Jangan lupa untuk menyimpan dengan klik gambar disket. sekali lagi jangan lupa klik tanda gambar disket untuk menyimpan.



Proses penyetingan pada hosting sudah selesai.

11. Langkah selanjutnya adalah menginstall.
Pada browser ketikkan http://namablog.com/wp-admin/install.php, selanjutnya ikuti perintah dari wordpress.
Selesai dah tahapan penginstalan Wordpress secara manual…..

12. Masuk ke edit profile terus ganti password defaultmu biar gak kelupaan
13. Untuk instal Plugin ataupun themes terlebih dahulu kamu download plugin dan themesnya di wordpress.org
14. Untuk Menguplodnya caranya hampir sama dengan uplod wordpress tapi disini kita terlebih dahulu masuk ke folder wp-content
15. Pilih folder plugins untuk uplod plugin yang di butuhkan
16. Pilih folder themes untuk uplod themes
17. Setelah semuanya selesai di uplod kamu masuk ke wp-admin webmu, aktifkan themes dan instal pluginnya yang telah di uplod
18. Selanjutnya tinggal anda utak atik wordpressnya dech, selamat berkreasi :D

sorry klo terlalu ribet, emang ribet kok cara buatnya tapi pasti dech anda akan puas :D
yach untung²♥ sebelum membeli hosting dan domain kan sebaiknya anda belajar dolo. Klopun mau ngeblog pakai gratisan juga gpp kayak gw nih hehehehehe