Going to The France Blogger

Menara eiffel yang berkedudukan di negara Perancis ternyata menyimpan sejuta pesona. Begitu juga dengan para bloggernya. Walau masih minim walking² ke blogger sana, namun kendala yang menghadang cukup lumayan belibet. Faktor bahasa yang utama :D
Pertama Koben satroni and acak-acak artikel dari blog Blog d Aide pour Blogger. Kelihatannya sudah jarang update juga sama pemiliknya. Sibuk kali ;)) Sebagian besar konten blog mengeluarkan trik sekitar manipulasi image. Lumayan buat keren-kerenan dengan gambar sob :P Tapi satu hal menarik dari para blogger perancis ini, suka berkreasi dengan gadget ekstension .xml Beben baru liat hal baru tentang penggabungan penggunaan script dengan frame ternyata mungkin dilakukan ya dari sana sob :">

Langsung genjot aja deh :)) Persiapan menterjemahkan bahasa lebih baik pakai versi ini saja Translate Free Software. Tinggal grab saja prosesnya ;)

Manipulasi Image using CSS

Keliatannya cocok dipakai secara inline dalam postingan trick berikut bos. Perhatikan gambar asli berikut sebelum diapa-apakan:

Lalu diberi sentuhan variabel border & opacity menghasilkan efek

The Coded<div style="width: 240px;height: 320px;padding: 0px;border-width: 3px;border-style: solid;border-color: #555;background-image: url(http://YOUR-LINK-IMAGE.jpg); margin: 0 auto;">

<div style="border-right: 10px solid rgb(255, 255, 255);border-width: 10px;border-style: solid;border-color: rgb(255, 255, 255);opacity: 0.5;width: 220px;height: 300px;">

</div>
</div>Dont forget to look Effect Pada Image and Border Flexible Boxes for Image.

Efek image dengan background color memunculkan layak photoshop red effect

<div style="width: 240px;background-color: #ff4500;margin: 0 auto;">

<div style="width: 240px;height: 320px;filter: alpha(opacity=70);opacity: .70;background-image: url(http://YOUR-LINK-IMAGE.jpg)">

</div>
</div>Green effect like photoshop

<div style="width: 240px;background-color: #007700;margin: 0 auto;">

<div style="width: 240px;height: 320px;filter: alpha(opacity=70);opacity: .70;background-image: url(http://YOUR-LINK-IMAGE.jpg)">

</div>
</div>Perhatikan kode background-color, itu warna yg memberikan efek pada gambarnya.
Satu image bisa dikreasikan menjadi macam ngono re' @-)

Satu hal unik lagi yg Koben ambil dari france blogger that is about "Les Vignettes d'un Album Picasa sur son Blog" (Thumbnail from Picasa Album on The Blog) :D
Like this brooo
Perhatikan kodenya baik-baik!!!

<iframe style="width: 300px;height: 132px;margin: 0 auto;display: block" src="http://www.gmodules.com/gadgets/ifr?url=http://hosting.gmodules.com/ig/gadgets/file
/108621208120033273647/picasa-thumbnails.xml
&up_USR=Picasa Account
&up_AID=ID Album
&up_NBC=Jumlah Thumbnail yg akan ditampilkan (1 - 200)
&up_SIZE=Lebar Thumbnail (32 - 160 pixels)
&up_SHA=Efek ShadowBayangan (Yes - No)
&up_CLP=Open link gambar (Yes - No)
&up_URL=URL link pada judul
&up_TITLE=Teks Judul
&up_LCOL=%23Warna huruf pada judul
&up_BCOL=%23Warna border
&up_BKCOL=%23Warna latar belakang
&up_CCOL=%23Warna latar pertama kali muncul"
allowTransparency="true" frameborder="0"
scrolling="no">
</iframe>

Contoh penulisan kode jadi

<iframe style="width: 305px; height: 380px;" src="http://www.gmodules.com/gadgets/ifr?url=http://hosting.gmodules.com/ig/gadgets/file
/108621208120033273647/picasa-thumbnails.xml
&up_USR=philippe.chappuis
&up_AID=5297196325809923457
&up_NBC=20
&up_SIZE=72
&up_SHA=Y
&up_CLP=Y
&up_URL=http://beben-koben.blogspot.com/
&up_TITLE=Tutorial+Blog+for+Stylish+Blogger
&up_LCOL=%23AA0000
&up_BCOL=%23555555
&up_BKCOL=%23debe94
&up_CCOL=%23555555"
allowTransparency="true" frameborder="0"
scrolling="no">
</iframe>

Silahkan dibanding-banding saja. Ingat sob, album picasa berbeda dengan photo² hasil upload yang datang kala kita memosting. Tengok dimari cara membuat album dari picasa service. Bagi pemakai flickr bisa kunjungi blog sumber, ada 3 biji gaya macam ginih. Picasa is google =))

Bonus

<iframe allowtransparency="true" scrolling="no" frameborder="0" width="210" height="205" src="http://www.gmodules.com/ig/ifr?url=http://hosting.gmodules.com/ig/gadgets/file/108621208120033273647/flash_container.xml&up_File=http://sites.google.com/site/annuairevin/files/GoogleClock.swf&up_FlashWidth=210&up_FlashHeight=200&up_ContainerCol=%23FFFFFF">Inserer une animation Flash http://sites.google.com/site/annuairevin/flash-reader</iframe>
Sambung lagi besok =))
Semoga bermanfaat :)