<body><script type="text/javascript"> function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener('load', function(){ object[attribute] = val; }, false); } else { window.attachEvent('onload', function(){ object[attribute] = val; }); } } </script> <div id="navbar-iframe-container"></div> <script type="text/javascript" src="https://apis.google.com/js/platform.js"></script> <script type="text/javascript"> gapi.load("gapi.iframes:gapi.iframes.style.bubble", function() { if (gapi.iframes && gapi.iframes.getContext) { gapi.iframes.getContext().openChild({ url: 'https://www.blogger.com/navbar.g?targetBlogID\x3d3225853982274805715\x26blogName\x3dTrick+Modifikasi+Friendster\x26publishMode\x3dPUBLISH_MODE_BLOGSPOT\x26navbarType\x3dBLUE\x26layoutType\x3dCLASSIC\x26searchRoot\x3dhttps://friendstermod.blogspot.com/search\x26blogLocale\x3den_US\x26v\x3d2\x26homepageUrl\x3dhttp://friendstermod.blogspot.com/\x26vt\x3d7734727760012780909', where: document.getElementById("navbar-iframe-container"), id: "navbar-iframe" }); } }); </script>
FriendsterMod Free friendster layoutKumpulan Layout friendster tutorial, themes, skin, graphic, juga cewek cantik di friendster.
Powered by  MyPagerank.Net

Advertisements
Google



Add to Google Reader or Homepage
Add to My AOL

web counter



Lihat Hits



Met Datang di FriendsterMod - Friendster Layout ??
Tutorial Layout Friendster tweaking profile FS
Welcome to Friendstermod. place where you can find Free Friendster Layout, skin, themes, you can download that layout for free and use it at your friendster profile. Layouts are well designed and optimized under friendster CSS code. Download free skins or request your own friendster layout themes.
Subscribe with Friendstermod (New)
Ingin berlangganan Free friendster layout lewat email?Tidak hanya friendster layout buatan Friendstermod, tapi juga seluruh artikel dan posting blog tentang tips trik Friendster juga akan langsung terupdate dengan cepat lewat email kamu. Silahkan Masukkan Email


2000 orang lebih para Friendsterholic telah berlangganan layout, tips dan trik Friendster dari FriendsterMod. Ayo buruan gabung sekarang juga.
Preview | Powered by FeedBlitz

Friday, March 28, 2008
Cara buat Friendster layout sendiri Tutorial
Cara design Friendster Layout

Tutorial ini akan membahas dengan singkat bagaimana cara mendesign sendiri layout Friendster kamu. Dengan menggunakan bantuan Friendster layout generator yang akan mempermudah kita untuk melakukan design, layouting, dan langsung mengetahui hasilnya. Apa yang membuat layout generator ini berbeda dengan lainnya? Tentu saja karena disana kita bias melakukan editing layout sedangkan preview hasilnya akan langsung terlihat on the fly. Lalu bagaimana caranya? Tenang cukup mudah koq sebab kamu gak perlu lagi belajar html dan css sampai mumet. Penjelasan akan disertai gambar screencrot ilustrasi. Tapi untuk menghemat bandwith kamu dan biar lebih mudah plus cepat diload browser jadi saya thumbnail aja ya. So kalo pingin memperbesar anunya gambarnya langsung klik aja.

Pertama silahkan buka browser kamu dan kunjungi Friendster layout generator buatan orang Indonesia (bangga nih..meski gk ikut buat). Di sana akan terlihat beberapa menu yang berjajar, pada dasarnya menu tersebut adalah urutan cara design layout. Gampangnya untuk mempermudah kamu tinggal ikutin aja urutan menu tersebut dari mulai create new layout sampai Member area. Loh koq ada menu member area? Ntar aja saya jelasin lagi. Nah sekarang klik dulu menu Create New Layout.

Create new layout

Untuk langkah awal dalam mendesign kita akan mulai dari menu Page Background. Nah selanjutnya sebuah jendela kecil akan muncul dari atas layar (asyik nih). Menu Page Background ini berguna untuk mengubah tampilan umum background profil friendster. Kolom Background color untuk mengubah warna latar halaman. Sedangkan “Background Image URL” dapat diisi dengan url gambar, ini jika kamu ingin background kamu berupa foto atau gambar. Kosongkan jika kamu cuma ingin menggunakan warna dasar saja. Sedangkan “Position” adalah letak posisi foto background di layar. Masih ada 2 opsi lain khan? Tanyakan aja jika gak paham oke. Selanjutnya langsung klik done.

Menu selanjutnya adalah Global Font yakni tempat kamu bisa mengatur jenis font dan pilihan warna font secara umum. Berhubung bagian ini saya anggap cukup dimengerti dan karena saya lupa ambil screencrot screenshootnya, jadi bisa kamu coba sendiri. Nah yuk kita lanjut ke menu “Links”.

Dari menu Links ini akan muncul 3 menu lainnya Global Link, Link on Hover dan Viwewall link. Link on hover itu untuk mengatur karakter font ketika ada cursor yang melintas di atas sebuah link.

Trus kita lanjutkan dengan menu “Boxes”. Di sini kamu bisa melakukan editing tampilan box (kolom-kolom) karena seperti kita tahu tampilan dasar layout friendster terbagi dalam kolom-kolom terpisah khan? Di sini sudah cukup jelas koq, dan jangan ragu untuk melakukan eksperiment dan kreatifitas sesuka hati, sebab preview akan langsung terlihat.

Disampingnya lagi ada menu Modules. Disana terdapat banyak pilihan customizing standard module yang ada di Friendster. Yang umumnya paling banyak dirombak tampilan layoutnya adalah module Friends dan Testimonial Box.

Nih preview sementara dari hasil mengedit tampilan beberapa module.

Gunakan daya kreatifitasmu biar gak jelek seperti punya saya ini.

Pada testimonial box kita bisa mengatur tampilan kotak/kolom testi. Herannya kenapa koq gak disatukan di menu Boxes tadi ya.

Nah bagian layout yang saya rasa paling penting adalah control panel. Klik menu Control panel kemudian banyak lagi opsi pengaturan editing layout control panel. Control panel adalah bagian utama tempat data diri dan profile kamu ditampilkan. Ditambah lagi letaknya yang above the fold, alias di bagian utama atas yang langsung nongol saat pertama kali profile friendstermu dibuka orang.

Bagian terakhir nih, menu Photo. Disamping kanan control panel kan biasanya langsung nongol juga tuh kolom/kotak foto? Nah ini dia. Yuk gunakan imajinasimu untuk menghiasi kotak fotomu. Border color juga banyak opsinya loh. Kamu bisa pilih warna, ukuran ketebalan, dan bentuk border (garis tepi) kotak foto milikmu.

Jika keseluruhan proses editing layout telah selesai sekarang saatnya untuk mengambil kode css-nya. Sayangnya kita tidak bisa langsung mengambilnya. Untuk itu kamu perlu menjadi member dulu, tapi gratis koq. Klik menu Get Friendster Code lalu sebuah jendela akan keluar menanyakan kamu untuk login. Jika udah pernah daftar sebelumnya langsung klik login aja. Tapi kalo belum ya klik Create an Account.

Proses pendaftarannya cukup mudah koq, bahkan tidak sesulit mendaftar account Yahoo. Nih liat contohnya di atas.

Nah selanjutnya kamu akan melihat preview hasil akhir layout buatanmu sendiri sekali lagi.

Oke jika udah login lalu klik lagi Get Friendster code. Nah menu yang keluar akan beda lagi kalo kamu udah login. Tuh klik aja Download Friendster Code.

Sebuah jendela browser baru akan muncul dengan full kode CSS hasil design friendster layout buatanmu tadi. Kira2 akan seperti ini.

Untuk mepermudah proses implementasi di Friendster sebaiknya copy-paste dulu kode tersebut ke Notepad. Kemudian save dengan ekstensi CSS. Tentang bagaimana caranya silahkan bolak-balik halaman blog ini karena sudah pernah saya posting sebelumnya.

Jika kode tersebut sudah berupa file berformat .css maka kamu tinggal menguploadnya ke server file hosting kesukaanmu. Langkah terakhir gunakan css linker untuk memasukkanya di Friendster kamu, tentunya setelah kamu login.

Oh iya jika kamu masih bingung tanyakan saja dengan menulis komentar di bawah ini. Tapi kalo kamu masih bingung dengan langkah terakhir untuk mengaplikasikan code css tersebut ke friendster, silahkan eksplorasi lagi artikel sebelumnya di blog ini. Makanya kemana aja kamu non? Biar gak ketinggalan update info terbaru makanya buruan aja gabung berlangganan update tips friendstermod lewat email. Sudah ratusan orang lebih yang berlangganan update artikel friendstermod via email. Gratis. Ayo buruan gabung caranya mudah koq. Isikan email kamu pada kolom berlangganan di bagian atas posting ini.

AddThis Social Bookmark Button | AddThis Feed Button
Ditulis oleh FriensterMod Team @ 2:58 PM.  

Cool Stuff buat reader Friendstermod

Free domain CO.CC

Perhatian, Tim FriendsterMod tidak memiliki hubungan khusus apapun dengan pihak Friendster begitupun sebaliknya. Blog ini sebagai media informasi yang menyampaikan tentang tips trik yang bisa dilakukan untuk merubah tampilan profil friendster dari yang sederhana hingga yang intermediate. Kami juga tidak bertanggung jawab atas kemungkinan apapun yang timbul akibat penggunaan isi artikel dalam blog ini. Gunakan dan praktekkan dengan kesadaran dan tanggung jawab penuh pada diri kamu sendiri.
FriendsterMod new skin beta. Best viewed at 1024x768 pixel.