Selasa, 29 Desember 2009

>>>>>>>>> 2010


Belakangan ini mulai muncul web desain bergaya blogazine yang membutuhkan kreatifitas lebih, tapi dipertanyakan kebergunaannya.

Belakangan ini mulai muncul postingan yang mencoba mengoreksi kebergunaan, tapi dipertanyakan masalah kreatifitas desainnya.

Belakangan ini mulai muncul blog yang mengajak agar web aksesibilitas tidak terlihat membosankan. tapi kurang mendengung.

Belakangan ini javascript framework seperti jQuery dan Mootools makin bergairah, tapi dipertanyakan kebergunaanya dan aksesibilitasnya.

Belakangan ini blog mulai dilirik sebagai pendulang dolar, tapi terkadang penempatan iklannya menggangu pembaca.

Belakangan ini postingan bergaya 'round up' mulai menjamur, tapi dipertanyakan dari sisi pencerahan.

Kini telah hadir HTML 5 yang memcoba agar struktur elemen lebih baik, tapi baru efektif tahun 2012.

Kini telah hadir pengembangan CSS 3 yang lebih kaya dengan stylenya, tapi belum semua browser mendukung.

Lalu seperti apakah wajah pengembangan weblog di tahun 2010 ?

Senin, 28 Desember 2009

Say Hello To Id Tutorial

id Keinginan untuk membuat sebuah blog yang berisi tutorial yang tidak hanya membahas tentang blogger.com sebenarnya sudah ada sejak lama, namun sepertinya hal tersebut sulit untuk di wujudkan. Beberapa kali kang Rohman mencoba membuat blog khusus namun akhirnya selalu di tinggalkan begitu saja. Dari pengalaman yang ada, dan hal tersebut tidak ingin terulang kembali kang Rohman mencoba merangkul beberapa orang yang dianggap memang kompeten di bidangnya untuk membuat sebuah blog yang akan di isi tentang tutorial. Upppss… akhirnya lahir deh id Tutorial.

 

Apa Yang akan di tulis di Id Tutorial?

Menurut konsep awal yang ada, Id Tutorial akan di isi dengan Tutorial membuat blog di Blogger.com, Tutorial membuat blog di Wordpress.com, Tutorial membuat blog dengan wordpress.org, Tutorial CSS dan HTML, Tutorial Javascript.

Untuk materi yang lain tentunya akan di diskusikan seiring berjalannya waktu.

 

Siapa di balik Id Tutorial ?

Sesuai peribahasa “Tak Kenal Maka Tak sayang”, maka berikut para kontributor di Id Tutorial :

 

Abu Farhan

Sebagian mungkin sudah mengenal nama Abu Farhan di belantika Blogosphere. Beliau telah melahirkan banyak Hack untuk blog blogger. Beliau menguasai beberapa Desktop Programming seperti delphi, python, VB dan c++ serta web programming seperti Javascript, jQuery dan PHP.

 

Choen

Choen. Banyak blogger mengenal beliau karena karyanya berupa template blogger yang sudah beredar dan banyak di pergunakan. mahir dibidang CSS dan HTML serta web designer.

Kang Rohman

Pemilik Kolom Tutorial. Walaupun tidak ada bidang keahlian yang spesifik, namun akan berusaha memberikan kontribusi di Id Tutorial.

 

Untuk sementara kontributor di Id Tutorial masih 3 orang, namun mudah-mudahan kedepannya akan bertambah lagi,

 

Ayo, siapa yang mau “ Say Hello To Id Tutorial?” di tunggu komentarnya di http://idtutorial.com Winking

Minggu, 27 Desember 2009

Generator @font-face Mempermudah Custom Font

Kamis, 24 Desember 2009

Redesign yang Kesekian Kali

redesign blogger template

Rabu, 23 Desember 2009

CSS Bubble Tooltips

CSS-Bubble-Tooltips Ingin blog anda lebih variatif? mungkin anda bisa menggunakan teknik CSS Bubble Tooltips. Dengan CSS Bubble Tooltips anda dapat memberikan syatu keterangn singkat suatu link yang di inginkan dan keterangan ersebut akan muncul apabila pengunjung blog menyorotkan cursor mouse pada link yang anda beri efek tooltips.

 

< (((((((( \\\\\\\\\\\\\\\\\\\\      LIve Demo      ///////////////////// )))))))) >

 

Silahkan arahkan mouse komputer anda pada link yang ada pada halaman tersebut, dan seharusnya ada akan melihat efek bubble tooltips.

 

Teknik Tooltips yang dipakai adalah 100% menggunakan CSS, jadi tentunya tidak akan terlalu membebani loading blog anda. Cara untuk mengimplementasikan CSS Bubble Tooltips terbilang sangat mudah, berikut caranya.

 

Langkah #1

 

  1. Silahkan login ke blogger dengan ID anda.
  2. Klik Tata Letak.
  3. Klik Tab Edit HTML.
  4. Jangan lupa untuk Membackup template anda terlebih dahulu, klik link Download Template Lengkap.
  5. Silahkan cari kode ]]></b:skin>
  6. Copy lalu paste kode berikut diatas kode ]]></b:skin>

    /*---------- bubble tooltip -----------*/
    a.tt{
        position:relative;
        z-index:24;
        color:#3CA3FF;
        font-weight:bold;
        text-decoration:none;
    }
    a.tt span{ display: none; }

    /*background:; ie hack, something must be changed in a for ie to execute it*/
    a.tt:hover{ z-index:25; color: #aaaaff; background:;}
    a.tt:hover span.tooltip{
        display:block;
        position:absolute;
        top:0px; left:0;
        padding: 15px 0 0 0;
        width:200px;
        color: #993300;
        text-align: center;
        filter: alpha(opacity:90);
        KHTMLOpacity: 0.90;
        MozOpacity: 0.90;
        opacity: 0.90;
    }
    a.tt:hover span.top{
        display: block;
        padding: 30px 8px 0;
       background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiH-ZcGDymgGb_zuO-9p1q2v8sA3xyjZYW_AcqRs94eD10RLY6FnK5tVv_E4K0rDSEM9vynrLWMbXfBhCf9JJk_AyjjXiZy1NHAfQJ7DYz7pNFZ8kBE1dXguI1QF3XN_-Cs-b0ubi2wBFc/) no-repeat top;
    }
    a.tt:hover span.middle{ /* different middle bg for stretch */
        display: block;
        padding: 0 8px; 
       background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpGJH0z-q9FJM1OIh4gV2yCNwLyF-m1njteaPb_z14tBr4qJpUKFBY0xjlbzo3v8YEqCeqWGHKB50HxjjKZ7caCQjB5fuUVxXtD0pnYAlevhEnEu-covf1YDwpVu0bzOTJTtZiJWn1C1s/) repeat bottom;
    }
    a.tt:hover span.bottom{
        display: block;
        padding:3px 8px 10px;
        color: #548912;
       background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiH-ZcGDymgGb_zuO-9p1q2v8sA3xyjZYW_AcqRs94eD10RLY6FnK5tVv_E4K0rDSEM9vynrLWMbXfBhCf9JJk_AyjjXiZy1NHAfQJ7DYz7pNFZ8kBE1dXguI1QF3XN_-Cs-b0ubi2wBFc/) no-repeat bottom;
    }

  7. Klik tombol SIMPAN TEMPLATE.
  8. Langkah pertama selesai.

Untuk langkah selanjutnya anda hanya perlu menambahkan sedikit kode HTML pada link yang ingin ada efek bubble tooltips nya. Posisi link tentunya bisa dimana saja sesuai dengan keingina, bisa di dalam posting, sidebar, ataupun footer. Format kode tambahannya seperti ini :

 

<a href="link_tujuan" class="tt">Teks link yg muncul<span class="tooltip"><span class="top"></span><span class="middle">Pesan yang akan muncul</span><span class="bottom"></span></span></a>





 



Contoh :



Bagi yang ingin belajar membuat blog di blogspot, coba kunjungi deh <a href="http://kolom-tutorial.blogspot.com" class="tt">Kolom Tutorial<span class="tooltip"><span class="top"></span><span class="middle">panduan lengkap membuat blog di blogspot</span><span class="bottom"></span></span></a>, di jamin puas karena tutorialnya gratisss.





 



Langkah #2



Untuk mencoba memasang di bagian sidebar, berikut caranya :



 




  1. Silahkan login ke blogger dengan ID anda.


  2. Klik Tata Letak.


  3. Klik tab Elemen Halaman.


  4. Klik Tambah Gadget.


  5. Klik tanda plus (+) untuk HTML / Javascript


  6. Masukan kode link yang anda inginkan ( lihat kode diatas).


  7. Klik SIMPAN.


  8. Selesai.



Jika anda ingin memasukkan didalam posting, pilih terlebih dahulu mode Edit HTL bukan pada mode Compose, kemudian masukan kode tambahan link tooltipnya, setelah itu anda dapat kembali ke mode compose jika mau.



edit-html



Silahkan mencoba!



 



Credit : trentrichardson

Sabtu, 19 Desember 2009

Free Blogger Template - Smart Shadow

Free Blogger Template - Smart Shadow

Demo Download

Kamis, 17 Desember 2009

Free Template : Smart Shadow

Untuk anda yang mendambakan mempunyai blog dengan tampilan template yang cool dan terkesan Profesional, Smart Shadow adalah salah satu free template yang mungkin layak untuk anda pertimbangkan. Smart shadow di design apik oleh salah satu sahabat kang Rohman, Choen.

 

smart shadow blogger template

Live Demo

 

Dengan balutan warna merah menyala menjadikan template ini terkesan begitu profesional layaknya web-web populer dunia, namun kesan cool pun segera hadir dengan adanya warna coklat dan abu-abu, hmmmm… bagaimana menurut kesan anda?

Smart Shadow telah kompatibel dengan beberapa browser internet ternama versi terbaru seperti Firefox, Opera, Google Chrome, serta Safari. Namun untuk Internet Explorer masih belum dapat menampilkan text shadow karena memang masih belum mendukung.

Untuk yang mau menjajal Smart Shadow Template, silahkan di coba.

 

Download Smart Shadow Template

Sebenarnya Kita Menulis Untuk Siapa?

kita menulis untuk siapa? pembaca vs mesin pencari

Rabu, 16 Desember 2009

The Best Accordion Untuk Blogger

Banyak dari para blogger mandambakan bahwa blog yang dimilikinya tampil menarik, elegan serta profesional. Banyak cara untuk mewujudkan itu semua, salah satunya adalah dengan menggunakan The Best Accordion untuk blogger yang di rancang oleh sahabat kang Rohman yaitu Abu Farhan.

Dengan menggunakan The best Accordion by Abu Farhan maka sidebar anda akan tampak rapih dan hemat tempat karena isi dari widget sidebar akan disembunyikan ( Hide ) dan akan tampil ( Show ) ketika judul sidebar di klik oleh pengunjung, namun tidak hanya itu saja, gerakan yang halus saat membuka dan menutup ( Show / Hide ) menjadikan The best accordion terlihat profesional.

 

the-best-accordion

Live Demo

Untuk  membaca tutorial lengkap tentang pemasangan The best Accordion, silahkan di baca disini!

Senin, 14 Desember 2009

UvumiTools Drop down Menu

Menepati janji yang kemarin bahwa akan mencoba untuk eksis kembali dalam menulis artikel yang berhubungan dengan blog tutorial. Posting kali ini kang Rohman akan mencoba membahas tentang Navigasi yang bernama UvumiTools Drop Down Menu.

 

uvumitools-drop-down-menu

Minggu, 13 Desember 2009

Intermezo Sejenak

Dulu, Blog Kang Rohman atau lebih dikenal dengan sebutan Kolom Tutorial begitu kental akan nuansa Blog Tutorial atau panduan membuat blog,  dan lebih spesifik kepada cara membuat blog di blogspot atau sekarang blogger. Target utama pengunjung yang diharapkan adalah mereka yang tertarik ingin membuat blog namun belum mengerti caranya. Artikel tentang tutorial pun begitu gencar dipublikasikan, dan sepertinya usaha tersebut membuahkan hasil jika ditilik dari jumlah pengunjung yang mencapai ribuan setiap harinya.

Sekarang, Blog Kang Rohman sepertinya sedikit ngawur, ini terlihat dari banyaknya artikel selain Blog Tutorial. Sudah hilangkah jati diri dari Kolom Tutorial? Mungkin “Ya” atau mungkin juga “Tidak". Dari sekian banyak pembaca, ada beberapa diantaranya yang merasa dan mungkin peduli dengan Kolom Tutorial. berikut kutipan komentarnya.

 

makasih atas infonya kang.... oia kok makin lama blog ini jadi ngebahas tentang software bukannya tentang tutorial blog lagi?

setelah sekian lama, kang rohman sudah tidak punya materi lagi tentang blog, yg dibahas hanya yahoo, google dan layanan yg jauh dr blog. kenapa gak bahas menu vertikal versi anyar atau yg horisontal, atau ide cerdas tentang blog misal buat menu komentar hari ini, posting hari ini, posting kemarin dll. maaf hanya ngingetin

Terima kasih atas komentarnya. Di waktu ke depan, Kolom Tutorial akan mencoba eksis kembali dalam menulis yang berhubungan dengan Blog dan tidak hanya informasi seputar free software.

Membuat Postingan Blogger Lebih Friendly

tag paragraf itu p bukan br

Kamis, 10 Desember 2009

Free Blogger Template Valid XHTML

Free Blogger Template Valid  XHTML

Demo Download

Free Video Accelerator Untuk YouTube

Speedbit-Video-Accelerator Anda sering menyaksikan video pada situs-situs video seperti YouTube atau yang lainnya? hal yang paling membosankan dalam menonton video di intyernet adalah saat menunggu video tersebut loading data. Agar anda tidak usah merasa bosan untuk menunggu sebuah video bisa di saksikan, mungkin anda memerlukan bantuan software yang bernama Speedbit Video Accelerator. Dengan Speedbit Video Accelerator loading data video yang anda saksikan akan lebih cepat dari biasanya. Speedbit Video Accelerator akan secara otomatis bekerja ketika anda menyaksikan sebuah video di internet.

Speedbit Video Accelerator sebenarnya tidak hanya untuk situs Youtube saja, namun support juga untuk situs-situs video lainnya seperti Yahoo Video, Smin, AOL Video, Facebook, Metacafe, Veoh, ABC, Adobe, Ameba Vision, Bebo, Bofunk, Break, CANAL+, CAtPost, Cbs2/KCAL9, Cbs4, Clipfish, CNN, Crackie, Dag, Dance Jam, Discovery Channel, DropShots, EA Sports, eFootage, ESPN, Expo TV, FHM, Flurl, FOX NEWS, FunnyJunk, GameArena, Gametrailers, Glam, graspr, Guzer, hi5, Ina, JibJaB, KeyeTV, libero Video, LiveVideo, MojoFlix, KoVideo, MyVideo, Netlog, Nothing Toxic, Pandora TV, Pomoho, Red Balcony, Revision3, Rocketboom, Rutube, Sharkle, Sky News, Stickam, Submarinechannel, Tagged, The Onion, The Weather Channel, Tudou, VBS. TV, videa, Video Web Town, VideoLog, Vidiac, Vidking, Vimeo, vodpod, vume, WannaHaves, WBZ-TV, WFRV-TV, Your Daily Media, Youtube, AOL UncutVideo, Dailymotion, iTunes, Myspace, 56, ABC News, Dan lain-lain ( cape ngetiknya Big Grin).

 

Bagi yang suka nonton video di Internet, sepertinya anda layak menjajal software ini.

 

Download Speedbit Video Accelerator

Page Navigation di Classic Template Blogger

Page Navigation

Free AMV Video Converter

Seperti yang diketahui bersama, format file dari sebuah video sangat beraneka ragam, ada MPEG, MPG, DAT, WMV, WMA, ASF, RM, RMVB, RAM, MOV, QT, AVI, AMP dan lain sebagainya. Banyak player video yang beredar dipasaran hanya bisa playback video format AMP, jika player yang anda miliki adalah salah satunya maka tidak akan bisa playback video selain AMP. Oleh karenanya, anda memerlukan sebuah software yang dapat mengkonversi dari file video yang lain ke file AMP.  Mungkin pilihan anda akan jatuh pada software yang bernama AMP Video Converter.

AMP Video Converter adalah sebuah freeware atau software gratis yang dapat mengkonversi file video format MPEG, MPG, DAT, WMV, WMA, ASF, RM, RMVB, RAM, MOV, QT, AVI, menjadi video format AMP.

AMP video converter tool

Yang berminat silahkan download.

 

Download AMP Video Converter

Senin, 07 Desember 2009

Free M4a to MP3 Converter

Free M4a to MP3 Converter adalah sebuah free software yang dapat mengkonversi file MP4 audio ke MP3, AAC ke MP3, M4a ke MP3. Software ini berguna jika player yang anda miliki hanya support untuk playback file MP3 dan tidak bisa untuk playback file MP4 atau AAC. Free M4a to MP3 Converter benar-benar gratis untuk anda gunakan dan bukanlah versi trial.

Fitur utama dari Free M4a To MP3 Converter :

 

  • AAC to MP3 converter.
  • Convert M4a to MP3.
  • Audio books M4b to MP3 converter.
  • MP4 audio converter.
  • 3GP audio converter.
  • AAC, M4a, M4b player.
  • MP3 quality settings up to 320 Kbit/s, 48 KHz.
  • Drag&Drop.
  • Batch processing of multiple M4a, AAC, M4b, MP4 etc. files.
  • User-friendly multilingual interface.
  • Meta information (ID3 tags) is copied from source files. Converted files contain all necessary data: title, artist, album (if the data was present in the source files).
  • AAC to WAV converter.
  • M4a to WAV converter.

Free M4a to MP3 Converter

Yang berminat silahkan download pada situs reminya!

Download Free  M4a to MP3 Converter

Blogger Template Framework

Blogger Template Framework

Demo Download

Sabtu, 05 Desember 2009

FireFox Add-Ons: Buat catatan dengan List It

firefox Anda seorang yang super sibuk sehingga kesulitan mengingat segala kegiatan yang harus anda jalankan? mungkin anda memerlukan Lis It. List It adalah sebuah add-ons Firefox yang ringan untuk membuat catatan kegiatan yang mau anda jalankan.

Karena ini adalah sebuah add-ons firefox maka tool ini diperuntukkan bagi anda pengguna browser Internet Firefox. Untuk mengaktifkan List It anda hanya klik icon yang ada di sebelah kanan bawah browser firefox a juga dengan shortkey  Ctrl + Shift + F.

list it

List It add-ons bisa anda download secara langsung pada halaman resmi add-ons firefox.

 

Download add-on List It

Mencari DNS Server dengan Namebench

namebench Pada postingan sebelumnya, Kolom Tutorial menginformasikan tentang peluncuran Google Public DNS. Sebagian besar dari pembaca kolom tutorial mungkin telah mencoba DNS tersebut, namun tentu tidak semuanya memakai DNS tersebut karena setelah dibandingkan hasilnya tidak lebih baik dengan DNS yang biasa anda pakai. Jika anda ingin mencoba mencari DNS server yang cocok dengan koneksi yang anda gunakan, mungkin anda bisa menggunakan Namebench.

Namebench adalah sebuah free software yang bisa mencari secara otomatis Public DNS Server yang tercepat dan bisa diandalkan untuk digunakan oleh anda. Konsep dasarnya yaitu Namebench tidak akan mengubah settingan apapun dari DNS anda namun hanya akan memberikan sugesti atau rekomendasi kepada anda alamat DNS server yang terdeteksi sangat cocok untuk di gunakan.

 

Tips dari kang Rohman :

Bandingkan terlebih dahulu antara DNS server yang biasa anda gunakan dengan DNS servers yang disarankan oleh namebench, silahkan anda lakukan ping pada kedua DNS tersebut, mana yang lebih cepat berarti itu yang lebih baik.

Jika DNS server yang biasa anda pakai ternyata lebih cepat, berarti lebih baik memakai DNS yang lama, tapi jika DNS server yang di sarankan lebih cepat, tidak ada salahnya untuk dipergunakan.

 

Download Namebench

Kamis, 03 Desember 2009

Google Luncuran Google Public DNS

google Google sepertinya tidak mau berhenti dalam melebarkan sayap-sayapnya di dunia maya. Belum lama ini google telah meluncurkan produk yang dinamakan Google Public DNS, sebuah layanan DNS ( Domain Name System ) server yang bisa dinikmati secara gratis. Dengan menggunakan Google Public DNS di klaim bahwa browsing akan terasa lebih cepat, keamanan yang lebih baik serta tanpa adanya redirect.

Berikut IP addess untuk Google Public DNS :

 

  • 8.8.8.8
  • 8.8.4.4

Google Public DNS

 

Untuk cara konfigurasi, Google telah menulis secara lengkap bagaimana cara konfigurasi google public DNS secara lengkap baik itu pada Microsoft Windows, Max OS X, ataupun Linux, silahkan baca disini!

Khusus bagi pengguna Windows XP, anda bisa melihat bagaimana cara konfigurasi Google DNS server untuk  komputer anda

 

 

Tips dari kang Rohman :

Bandingkan terlebih dahulu antara DNS server yang biasa anda gunakan dengan DNS publik dari google, silahkan anda lakukan ping pada kedua DNS tersebut, mana yang lebih cepat berarti itu yang lebih baik.

Jika DNS server yang biasa anda pakai ternyata lebih cepat, kenapa harus berpindah ke DNS google, tapi jika DNS server dari google lebih cepat, tidak ada salahnya untuk digunakan.

Rabu, 02 Desember 2009

Device Doctor: Free Windows Driver Updater

device-doctor-logo Kinerja komputer anda terasa kurang optimal? mungkin hal tersebut disebabkan oleh adanya virus dalam komputer anda atau memory kurang memadai atau banyak faktor lain yang membuat komputer anda kurang optimal. Salah satu faktor yang mungkin terjadi adalah driver dari hardware komputer anda sudah tidak update sehingga perlu adanya update driver.

Untuk urusan update driver hardware komputer, kini anda tidak perlu lagi pusing mencari satu-satu mana driver yang harus di update karena banyak tool yang otomatis bisa scan driver mana saja yang harus di update, salah satunya adalah Device Doctor.

Device Doctor adalah sebuah freeware Windows Driver Updater yang dapat scanning secara otomatis terhadap hardware mana saja dalam komputer anda yang perlu di update, dan anda dapat mendownload Driver terbaru secara gratis di situs mereka. Device Doctor di desain sangat simple sehingga sangat user friendly, untuk melakukan scanning driver mana yang harus di update anda hanya perlu klik tombol ‘Begin Scan “.

Devide doctor

 

Yang mau menjajal, silahkan download. Ada dua versi yang bisa anda pilih, yaitu installer serta portable .

 

Download Device Doctor installer ( 4.6 MB)
Download Device Doctor Portable ( 5.10 MB)

Free Online Avatar Creators List

Ingin menggambarkan diri kamu menjadi sebuah avatar atau gambar kartun? Sekarang anda tidak harus pusing dan mempunyai kemampuan yang mumpuni dalam editing gambar karena sudah banyak layanan online yang bisa membuat avatar secara instant namun mengesankan.

 me  fooz2  weemee

 

Berikut kang Rohman cantumkan beberapa website yang menyediakan layanan free online avatar creator, silahkan anda coba mana yang dirasa favorit :

 

Yahoo-Avatar
urFooz
moeruavatar
weeWorld
tizme
Moonjee
doppelme
muggins
sp-studio
miihowjpg
Voki

 

Selamat menjajal layanan mereka.

Belajar Kritis dan Memilah Sebuah Tren


Selasa, 01 Desember 2009

Obrolan Seputar Browser Google Chrome

google chrome Sebenarnya yang sedang hangat jadi pembicaraan di Internet saat ini bukanlah browser internet besutan Google yang bernama Google Chrome, namun sebuah Sistem operasi komputer baru dari Google bernama Google Chrome OS yang rencananya akan di launching secara resmi tahun 2010 nanti. Yang menyedot perhatian banyak orang adalah Google Chrome OS bisa di pakai secara gratis, ditenggarai bahwa Google Chrome OS dibuat untuk menggeser dominasi dari Sistem Operasi Windows dari Microsoft.

Walaupun Google belum secara resmi meluncurkan Google Chrome OS untuk user, namun google telah merilis Chromium OS open source project silahkan baca langsung dari blog google system untuk membaca detail tentang rilisnya Chromium OS open source project..

 

Bagi anda yang ingin lebih cepat mencicipi rasa dari Chrome OS, ada beberapa website yang telah menyediakan link download Google Chrome OS secara gratis.

 

Download Chrome OS

 

Untuk menjalankan multi OS dalam satu komputer, diperlukan software seperti VirtualBox atau VMware Player atau bagi pengguna Macs bisa memakai VMware Fusion.

 

Apabila ingin boot komputer secara langsung dengan Chrome OS, anda bisa install Google Chrome OS pada USB flash drive. Silahkan download versi USB drive :

 

Download Chrome OS Diet USB Version

Download Chrome OS Diet USB Version ( alternatif link )

 

Catatan : Segala resiko dalam menginstall Chrome OS sepenuhnya tanggung jawab anda sendiri, silahkan baca informasi cara menginstall Chrome OS yang banyak tersedia di Internet.

 

Masuk ke obrolan utama postingan kali ini yaitu mengenai browser internet Google Chrome. Sejak peluncurannya tahun lalu, kang Rohman tidak terlalu banyak mencurahkan perhatian terhadap browser yang satu ini karena saat pertama kali menginstall terkesan bahwa Chrome terlalu minimalis sehingga kurang nyaman untuk di gunakan. Namun, akhir-akhir ini kang Rohman mulai sedikit jatuh hati dengan Chrome dan sering menggunakannya saat browsing, alasan utama yaitu proses loading saat membuka halaman website dirasakan lebih cepat di banding dengan browser internet lain. Bagaimana dengan pengalaman anda?

Alasan lain kenapa selama ini tidak menggunakan Google Chrome adalah Google Chrome tidak bisa menginstall Google Toolbar yang selama ini selalu bertengger di browser kesayangan Firefox. Sedikit aneh memang, Google Chrome yang nyata-nyata buatan google tidak bisa di install google toolbar yang notabene buatan google sendiri.

Asumsi yang muncul kenapa google toolbar tidak bisa di install di chrome yaitu google ingin menunjukkan bahwa google Chrome adalah browser tercepat yang apabila di install google toolbar bisa sedikit mengganggu kecepatan, tapi itu adalah sebuah asumsi mungkin bisa benar atau mungkin salah. Untuk masalah ini, pihak developer Chrome berdalih bahwa saat ini mereka masih bekerja keras agar google toolbar bisa di install pada chrome.

 

Google Toolbar Isu

Tidak tersedianya Google Toolbar untuk Chrome merupakan alasan banyak pengguna internet untuk tidak beralih ke browser Google Chrome. Untuk menanggapi reaksi ini pihak google menjawabnya dengan membuat sebuah halaman yang bisa anda akses di disini. Pada halaman tersebut diterangkan bahwa banyak dari fitur-fitur Google Toolbar seperti The New Tab Page, Spiffy search box, Suggestions instead of error pages, Autofill, Pop-up blocker, Spell-checker sebenarnya telah tersedia pada google Chrome.

 

Google Chrome Extensions

Layaknya pada browser firefox yang bisa menambahkan berbagai add-ons untuk lebih mendukung kinerja browser, pada Google Chrome pun ada fitur tersebut namun dinamakan sebagai Extension. Seiring dengan berjalannya waktu, kini telah tersedia banyak extension yang bisa anda tambahkan.

Untuk mencari Extesion yang dibutuhkan, anda bisa mencarinya di http://www.chromeextensions.org. Berikut Extension yang terpasang di Google Chrome milik kang Rohman.

 

Kuber PageRank Checker

 

Dengan Extension ini kita dapat melihat Google Page Rank, Alexa Rank, dan informasi WHOIS dari blog atau website yang dikunjungi.

 

Sebuah extension yang bisa memasang google translate yang bisa secara langsung menterjemahkan isi web sebagaimana fitur yang ada pada google toolbar.

 

Yang tidak suka akan kehadiran iklan di web yang anda kunjungi, Extension AbBlock+ cocok di pasang untuk menghalau kehadiran iklan-iklan tersebut.

 

Tool yang berbasis pada Google Tools

 

Dan masih ada beberapa extension lainnya.

 

Jika google chrome anda tidak bisa menginstall Extention, kemungkinan besar Chrome anda bukan versi developer, oleh karena itu silahkan install google chrome developer di:

http://www.google.com/chrome/eula.html?extra=devchannel

 

Google Chrome Themes

Yang kurang menyukai tampilan default dari Google Chrome, kini tersedia theme chrome untuk anda pilih sesuai kesukaan, silahkan langsung install di https://tools.google.com/chrome/intl/en/themes/index.html

 

Ngobrol panjang lebar ternyata cape juga nih, cukup dulu deh. lain kali di sambung lagi.

Minggu, 29 November 2009

Reset Blogger Template

Reset  Blogger Template

Sabtu, 28 November 2009

Variasi Icon Pada Judul Sidebar

variasi icon

Pernah melihat blog yang judul sidebarnya memiliki variasi icon yang berbeda antara satu widget dengan widget lainnya?

Memang sepertinya sedikit cukup menarik apabila setiap judul di sidebar mempunyai icon yang berbeda karena sejatinya judul disidebar tidak mempunyai icon, atau apabila mempunyai icon, icon tersebut akan sama anatara widget yang satu dengan widget yang lainnya.

Agar judul sidebar anda mempunyai icon yang bervariasi, maka ada sedikit trik yang harus anda lakukan.

Bagi anda yang tertarik namun belum mengetahui caranya, berikut kang rohman akan memberi gambaran bagaimana agar anda bisa dapat memasang icon favorit anda pada judul sidebar.

 

#1 Pilih Icon Favorit anda

Silahkan persiapkan icon favorit milik anda atau jika belum mempunyai koleksi icon anda bisa mendownloadnya secara gratis di internet. sedikit referensi, kang rohman pernah posting beberapa penyedia icon gratis, silahkan anda baca pada artikel Free Icon Untuk Blog Dan Website atau pada artikel

Cari icon  di IconFinder.

 

Sebagai contoh, beberapa icon yang kang Rohman pakai ;

 

 icontexto-user-web20-blogblogs icontexto-webdev-social-bookmark-09 icontexto-webdev-social-bookmark-blogblogs icontexto-webdev-valentine icontexto-webdev-arrow-right-032x032 icontexto-webdev-add-032x032 icontexto-webdev-contact-032x032 icontexto-webdev-file-032x032 icontexto-webdev-ok-032x032 icontexto-webdev-rss-feed-032x032 

 

Silahkan upload icon-icon tersebut ke hosting tempat biasanya anda menyimpan gambar, jika anda belum mengetahui bagaimana cara upload gambar, anda bisa membaca artikel kang Rohman tentang  Buat Logo & Image Button atau bisa juga anda baca artikel Upload gambar melalui blogger.

 

Berikut beberapa contoh alamat gambar (URL) icon yang telah kang di upload :

 

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghA-AXXQ3daHto2r3AbG1d1Xm3NIE0G_jkbrRKVCagHfpQi-VhyOcoxu73_p8k_y4VMXPqgE9Fj5AjNFhGwbdduzcEq0_FsVS8yYH4g6GYxpMZPrTcjDXVBlZYQl26-aMAA3Eid8Zok7A/

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7HjH4Y21iwwDYyvGidgNB4w0t5zmJflPEw3wAb_imlQcu4L1Nz5kc18WdgfB-R8B57i1mLR56IV__XAe5LGS1sFkmZBXK4sRTqo6HBBnZkhLJacGXMFrrmrh3HpFSbf75wyVp2dyGUkc/

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-uK4sc1WPl2XYmlOu7TOUUCbChlRJMHfoEHqwfUHZKsyNqOcgq8cZqPe6v1MVkDGBVQLicrl2FAcaLOmWWwAn-r0PFimhZd7GcyILA1aEv87dXeQP1PmbyTgo9hB_3SuNPnv4jGBxMcc/

 

Silahkan anda sesuaikan berapa jumlah icon yang ingin anda pasang. Sebagai contoh akan diterangkan untuk memasang 3 icon saja.

 

#2 Mencari Kode Widget Sidebar

Langkah kedua yaitu mencari tahu kode widget di dalam template anda, mana yang ingin di pasang icon. Berikut langkah-langkahnya :

 

  • Silahkan login ke blogger dengan ID anda.
  • Klik Tata Letak.
  • Klik tab Edit HTML
  • Carilah kode yang mirip-mirip seperti ini :

    <b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>
    <b:widget id='Label1' locked='false' title='Categories' type='Label'/>
    <b:widget id='HTML2' locked='false' title='Friend Llinks' type='HTML'/>
    <b:widget id='HTML1' locked='false' title='Sponsors' type='HTML'/>
    <b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>

  • Setiap blog pasti berbeda kodenya, makanya kang Rohman tulis yang mirip dengan kode diatas. Copy kode tadi pada pada note pad atau sejenisnya.

Dari contoh diatas, blog kang Rohman mempunyai 5 widget, dan yang penting harus anda perhatikan adalah yang tercetak merah  dan orange yaitu :

 

  • Profile1   -    About Me
  • Label1    -    Categories
  • HTML2   -   Friend Llinks
  • HTML1  -   Sponsors
  • BlogArchive1  -  Blog Archive

Yang dicetak merah adalah ID dari widget dan yang dicetak orange adalah judul widget atau judul yang ada di sidebar.

Sebagai contoh, kang Rohman hanya akan memasang pada widget  dengan ID Profile1, Label1, serta HTML2.

 

#3 Membuat kode CSS

Langkah ke tiga adalah membuat kode CSS untuk ID widget yang tadi (Profile1, Label1, serta HTML2). Property yang di buat cukup sederhana, yaitu anda hanya menambah h2 pada ujungnya, contoh :

 

#Profile1 h2 { }

#Label1 h2 { }

#HTML2 h2 { }

 

Untuk value nya, anda bisa berkreasi sendiri sesuai dengan keinginan, namun sebagai contoh, value nya misalkan seperti ini :

 

#Profile1 h2{
background:transparent url(URLGambar) no-repeat scroll left center;
padding:8px 8px 2px 40px;
margin-top:15px;
}
#Label1 h2{
background:transparent url(URLGambar) no-repeat scroll left center;
padding:8px 8px 2px 40px;
margin-top:15px;
}
#HTML2 h2{
background:transparent url(URLGambar) no-repeat scroll left center;
padding:8px 8px 2px 40px;
margin-top:15px;
}


 



Untuk URLGambar tentunya harus anda ganti dengan URl gambar anda, namun sebagai contoh kang Rohman akan memakai URL gambar yang sudah di tulis di artikel bagian atas, sehingga kodenya akan seperti ini :



 



#Profile1 h2{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghA-AXXQ3daHto2r3AbG1d1Xm3NIE0G_jkbrRKVCagHfpQi-VhyOcoxu73_p8k_y4VMXPqgE9Fj5AjNFhGwbdduzcEq0_FsVS8yYH4g6GYxpMZPrTcjDXVBlZYQl26-aMAA3Eid8Zok7A/) no-repeat scroll left center;
padding:8px 8px 2px 40px;
margin-top:15px;
}
#Label1 h2{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7HjH4Y21iwwDYyvGidgNB4w0t5zmJflPEw3wAb_imlQcu4L1Nz5kc18WdgfB-R8B57i1mLR56IV__XAe5LGS1sFkmZBXK4sRTqo6HBBnZkhLJacGXMFrrmrh3HpFSbf75wyVp2dyGUkc/) no-repeat scroll left center;
padding:8px 8px 2px 40px;
margin-top:15px;
}
#HTML2 h2{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-uK4sc1WPl2XYmlOu7TOUUCbChlRJMHfoEHqwfUHZKsyNqOcgq8cZqPe6v1MVkDGBVQLicrl2FAcaLOmWWwAn-r0PFimhZd7GcyILA1aEv87dXeQP1PmbyTgo9hB_3SuNPnv4jGBxMcc/) no-repeat scroll left center;
padding:8px 8px 2px 40px;
margin-top:15px;
}


 



#4 Memasang kode CSS




Karena tadi sudah mendapatkan kode CSS yang di perlukan, maka langkah terakhir adalah memasang kode CSS tadi ke template anda, berikut langkah-langkahnya :

 




  • Silahkan login ke blogger dengan ID anda.


  • Klik Tata Letak.


  • Klik tab Edit HTML


  • Carilah kode ]]></b:skin>



  • Copy lalu paste kode berikut diatas kode tadi ( namun ingat! widget ID serta URL gambarnya harus anda ganti sesuai dengan blog anda )



     



    #Profile1 h2{
    background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghA-AXXQ3daHto2r3AbG1d1Xm3NIE0G_jkbrRKVCagHfpQi-VhyOcoxu73_p8k_y4VMXPqgE9Fj5AjNFhGwbdduzcEq0_FsVS8yYH4g6GYxpMZPrTcjDXVBlZYQl26-aMAA3Eid8Zok7A/) no-repeat scroll left center;
    padding:8px 8px 2px 40px;
    margin-top:15px;
    }
    #Label1 h2{
    background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7HjH4Y21iwwDYyvGidgNB4w0t5zmJflPEw3wAb_imlQcu4L1Nz5kc18WdgfB-R8B57i1mLR56IV__XAe5LGS1sFkmZBXK4sRTqo6HBBnZkhLJacGXMFrrmrh3HpFSbf75wyVp2dyGUkc/) no-repeat scroll left center;
    padding:8px 8px 2px 40px;
    margin-top:15px;
    }
    #HTML2 h2{
    background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-uK4sc1WPl2XYmlOu7TOUUCbChlRJMHfoEHqwfUHZKsyNqOcgq8cZqPe6v1MVkDGBVQLicrl2FAcaLOmWWwAn-r0PFimhZd7GcyILA1aEv87dXeQP1PmbyTgo9hB_3SuNPnv4jGBxMcc/) no-repeat scroll left center;
    padding:8px 8px 2px 40px;
    margin-top:15px;
    }



  • Klik tombol SIMPAN TEMPLATE


  • Selesai.



    Ternyata mudah sekali bukan?




      Tambahan, agar tampilan icon cocok dengan kondisi template anda maka anda bisa mengubah nilai padding atau margin nya.


    padding:8px 8px 2px 40px;



    margin-top:15px;



     



    Selamat Mencoba!

    Twitter Delicious Facebook Digg Stumbleupon Favorites More