Tampilkan postingan dengan label Facebook. Tampilkan semua postingan
Tampilkan postingan dengan label Facebook. Tampilkan semua postingan

Sabtu, 09 Juni 2012

Generator Text For Facebook Chat

Walau tidak ada sangkut pautnya dengan tutorial blog, namun tema facebook cukup lumayan buat update postingan ;)) Ada satu hal yang membuat Koben menggelitik dari layanan chat facebook. Dalam melakukan chattingan kita dapat mensisipkan emoticon berupa teks dengan ragam bentuk dan gambar-gambar (mungkin seluruh gambar dapat dijadikan emotikon) @-)
Satu web yang memberikan jasa guna melakukan tindakan tersebut yakni Facebook Chat Codes Maker! Sidik punya selidik, trik membuat text pada area facebook chat menjadi gambar ternyata dapat dilakukan dengan jQuery script ;) Koben sudah aplikasikan di sini Generator Text Full Stylish for Facebook Chat. Bagi sobat yg memang berminat mau seperti itu, gue punya beberapa tawaran serupa nih.

Datang dari blogger farixsantips, membuat 3 jenis generator teks facebook-chat.

Struktur Penulisan Kode

<style type="text/css">
.form {background:white; border-radius:5px; border:2px solid #777; box-shadow:0 1px 0 #ccc,0 2px 0 #c9c9c9,0 3px 0 #bbb,0 4px 0 #b9b9b9,0 5px 0 #aaa,0 6px 1px rgba(0,0,0,.1),0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2),0 5px 10px rgba(0,0,0,.25);width:330px;padding:10px}
.input {padding:10px 10px; box-shadow:inset 1px 1px 0 #777; border-radius:5px; border:1px solid #fff}
.input:focus {background:#ffffe0}
.type {width:200px}
.output {width:295px}
.button {color:#fff; padding:9px 18px; background:-moz-linear-gradient(top,#76c1e3 0%,#1e97e8 25%,#2b84f0); background:-webkit-gradient(linear,left top,left bottom,from(#76c1e3),color-stop(0.25,#1e97e8),to(#2b84f0)); border-radius:5px; border:1px solid #555; box-shadow:0px 1px 3px rgba(000,000,000,0.5),inset 0px -1px 0px rgba(255,255,255,0.7); text-shadow:0px -1px 1px rgba(000,000,000,0.2),0px 1px 0px rgba(255,255,255,0.3)}
</style>

<script src="ADD-SCRIPT-HERE.JS" language="javascript"></script>

<form class="form" name="code">
<input class="input type" name="type" size="63" type="text" placeholder="Write here..." />
<input class="button" onclick="change();" type="button" value="Change!" />
<input class="input output" name="output" onclick="select();" size="63" type="text" />
</form>
Gantikan ADD-SCRIPT-HERE.JS dengan salah satu JavaScript berikut ini
  • Rainbow Color
  • <script src="https://sites.google.com/site/farixsantips/scripts/color-rainbow.js" language="javascript"></script>
  • Green Color
  • <script src="https://sites.google.com/site/farixsantips/scripts/color-green.js" language="javascript"></script>
  • Block Color
  • <script src="https://sites.google.com/site/farixsantips/scripts/color-block.js" language="javascript"></script>
Simpan deh mau dijadiin postingan ataupun gadget, or .html :) Point terakhir ekstension html Koben sudah bikinkan juga bagi sobat-sabit ;))

Sikat mas brooo FacebookGeneratorText.zip in Ziddu. Dengan proses yg sedikit ribet dalam berchatting ria, namun lihatlah pada arsip message facebook kalian! Dengan begitu data yg biasanya teks biasa akan berganti dengan kode-kode sleketep :D Sangkin tidak ada kerjaan sampai mosting yg beginian =))
Bonus:
http://designresourcebox.com/jqfloat-js-jquery-plugin-that-creates-floating-animations/
Happy codding \m/

Selasa, 29 November 2011

How To Build Custom Fans Facebook

Artikel info kali ini Koben akan membicarakan mengenai bagaimana cara membuat tampilan fan facebook berbeda alias customized. Secara default hanya terdapat pilihan opsi light & dark saja. Sekarang kita akan buat gimana menerapkan supaya tampilan fan-facebook bisa kita sisipkan background dan beberapa customize lainnya. Temanya saja sudah fans FB, ya kalian harus sudah punya dulu dong. Kalau belum punya silahkan baca cara bikin fans facebook.
Sebenarnya Beben cuma mau memperjelas saja tutorial how to build custom facebook fan box :D Biarin sedikit basi juga yah bro and bri ;)) Siapa tahu penjelasan ane lebih masuk ketimbang penjelasan² yang sudah ada :D Pasti source yg aku tawarkan mumpuni punya deh.

Demo Custom Fan Facebook


Perhatikan struktur berikut
<div style="padding:5px;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhanSJw-7Egchc7aIArbrjTq0dil3Cz2EGePtZ6mdaoOD_IL-A2_YglVnqksWsYdQYvx1K0Vo0dTriPRhmIPXrvMGD-YBHafFDMa6_JGXyYGwGdLtTsiw8peCGjJT5yuJNbVikg1i0FnuKD/) repeat;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;-moz-box-shadow:inset 0 0 0px #333;-webkit-box-shadow:inset 0 0 3px #333;box-shadow:inset 0 0 3px #333;width:290px;height:205px">

<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US" type="text/javascript">
</script>

<script type="text/javascript">
FB.init("ISIKAN DENGAN KODE
App Secret KALIAN");
</script>

<fb:fan connections="10" css="https://sites.google.com/site/misstemplate88/fanboxstyle.css" height="205" logobar="0" profile_id="ISIKAN DENGAN ID PROFILE KALIAN" stream="0" width="290" class=" FB_fan FB_ElementReady">
</fb:fan>

</div>
Fokuskan perhatian pada tulisan kode berwarna. Kode External Style Sheet itulah code ramuan ajaib agar dapat melakukan hal ini :P Daleman isi coded CSS tersebut bisa kalian rubah lagi apabila warna link kurang sesuai. Ingat hanya warna dan jenis font yg boleh dirubah ya!!!

Coded CSS Facebook Fans Box

/* 
Created by: Miss Rinda
URI: http://rindastemplates.com/
Developer by: Mr Beben
URI: http://beben-koben.blogspot.com/
DO NOT REMOVE MY LINK. YOU JUST ALLOWED TO CHANGE FONT & COLOR.
*/

.fan_box a:hover {
text-decoration: none;
}
.fan_box .full_widget {
height: 200px;
padding-left: 5px;
border: 0 !important;
background: none !important;
position: relative;
}
.fan_box .connect_top {
background: none !important;
padding: 0 !important;
}
.fan_box .profileimage {float: left;width: 40px;height: 40px;padding: 0 5px 0 0;margin: 0 0 1px 0}
.fan_box .connect_action {padding: 0 0 0 8px}
.fan_box .connect_action .name {line-height: 15px;font-size: 12px;font-style: normal;color: #000;font-family: Arial,Serif,Tahoma}
.fan_box .connect_action {padding: 0 !important;}
.fan_box .connections {
padding: 0 !important;
border: 0 !important;
font-family: Tahoma;
font-size: 11px;
font-weight: normal;
color: #000;
}
span.total {color: #000;font-weight: normal;}
.fan_box .connections .connections_grid {padding-top: 5px !important;}
.fan_box .connections_grid .grid_item {padding: 0 7px 0px 0 !important;}
.fan_box .connections_grid .grid_item .name {
font-family: Arial,Serif,Tahoma;font-size: 9px;
color: #000 !important;
padding-top: 1px !important;
}
.fan_box .connect_widget .connect_widget_text {padding: 0}
.fan_box .connect_widget td.connect_widget_vertical_center {height: 20px}
.fan_box .connect_widget td.connect_widget_vertical_center a.connect_widget_like_button {margin-right: 7px}
.fan_box .connect_widget .connect_widget_interactive_area {margin: 5px 0 0}
.button_count a.connect_widget_like_button {padding: 2px 4px}
.button_count a.connect_widget_like_button span {line-height: 14px}
a.connect_widget_like_button:hover {text-decoration: none}
.connect_widget_number_cloud {background: #666;border: 1px solid #000;height: 24px;padding-top: 5px;text-align: center}
.connect_widget_like_button .corner {background-image: url(http://static.ak.fbcdn.net/rsrc.php/v1/zb/r/L6P2fymQtet.png);height: 6px;width: 6px;display: block}
.connect_widget_like_button .topleft {top: -6px;left: -3px}
.connect_widget_like_button .topleft .corner {margin: 0}
.connect_widget_like_button .topright {top: -6px;right: 0}
.connect_widget_like_button .topright .corner {margin: 0 0 0 -3px}
.connect_widget_like_button .bottomright {bottom: 0;right: 0}
.connect_widget_like_button .bottomright .corner {margin: -3px 0 0 -3px}
.connect_widget_like_button .bottomleft {bottom: 0;left: -3px}
.connect_widget_like_button .bottomleft .corner {margin: -3px 0 0 0}
.connect_widget_like_button .liketext {color:#000;display:block;padding-left: 17px;background: url(http://static.ak.fbcdn.net/rsrc.php/v1/zb/r/L6P2fymQtet.png) -1px -33px no-repeat;white-space: nowrap}
.connect_widget_like_button .fbLikeButtonTrackingPixel {display: inline;height: 0;width: 0}
Hostingkan seluruh CSS diatas. Gantikan link CSS https://sites.google.com/site/misstemplate88/fanboxstyle.css dengan hasil karya kalian masing² :)
Resource by: http://www.rindastemplates.com/2011/06/stylish-facebook-fan-page.html
Bila sobat ingin tahu lebih banyak mengenai custome sekitaran facebook, silahkan mampir disini Daddy Design.

Ekstra explanation:
ISIKAN DENGAN KODE App Secret KALIAN
Go to Facebook Developers and look App Secret

ISIKAN DENGAN ID PROFILE KALIAN
Dibawah App Secret dua jajar, ambil saja deretan angka yg paling dibelakang :D
Semoga bermanfaat :)
Happy FB Fanz \m/

Sabtu, 29 Oktober 2011

Comment Facebook Without Javascript for Blogger

Jangan mudah kecantol ingin ini itu tapi tidak mempelajari secara seksama. Mengapa, karena banyak kemauan tanpa modal yang sesuai, akan membuat kita stress. Kalau sudah stress kepala jadi mumeut, nyut...nyut...nyut. Trik kali ini kita akan bermain dengan syntax link URL. Bila sobat pelajari, apa yang dapat kita lakukan dengan atribut sebuah URL maka kalian akan dapat berkreasi seperti Beben Koben si bloglang anu ganteng kalem tea :D Kenal dengan blog Ben Tools kan!!! contoh saya sering bermain dengan syntax URL ;) Dengan begitu kita bisa bermain-main dengan iframe, web address, form action, image, etc.
Simpel ketika Koben membuat syntax Link mobile ditanamkan kedalam template. Bagaimana sekarang kalau komentar facebook dibikinkan dengan hanya pemakaian syntax!

Tanpa menggunakan script facebook, tanpa embel² API_ID ataupun pemakaian tagging <fb:comments> Tahu web penyedia jasa buat share/bookmark seperti AddThis.com, website macam itulah yg sering bermain dengan syntax URL ;)) Address link yaitu alamat tujuan sob, jadi jika alamatnya benar maka tujuannya juga tidak akan salah.
Contoh Koben membuat form action guna melihat coded fb:admins, fb:app_id memakai syntax link.


Canggih kan sob ;))
Dari tadi ngalor ngidul, inti tricknya belom tersampaikan nih ;)) Cara membuat komentar facebook buat blogger ke dalam template termudah :)) Tanpa script dan tanpa sihir, this is pure used link syntax.

DEMO

Comment via Facebook

1. Biasa
<a expr:href='&quot;http://www.facebook.com/plugins/comments.php?href=&quot; + data:_post.url + &quot;&amp;title=&quot; + data:_post.title' style='background:#5F78AB;color:#fff;padding:3px;border:1px solid #29447E;font-weight:bold' target='_blank'>Comment via Facebook</a>
2. Luar Biasa
<a expr:href='&quot;http://www.facebook.com/plugins/comments.php?href=&quot; + data:_post.url + &quot;&amp;title=&quot; + data:_post.title' style='background:#5F78AB;color:#fff;padding:3px;border:1px solid #29447E;font-weight:bold' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=500,height=135&quot; ); return false;' rel='nofollow'>Comment via Facebook</a>
Karena cuman masukin bagian komentarnya saja, maka kalau mau lihat siapa² yang komentarnya rada ribet juga yak :D Namanya juga cuma berbagi, kepakai syukur enggak kepake juga tidak apa-apa :))
Ternyata kodenya bentrok ama emotikon lagi :( got it Kode Komentar Facebook tanpa Script :D
Debugger for link post blogger<a expr:href='&quot;http://developers.facebook.com/tools/lint?url=&quot; + data:_post.url + &quot;&amp;title=&quot; + data:_post.title' target='_blank'>Debug</a>
Happy blogging \m/

Rabu, 19 Oktober 2011

Add Google+ Stream Tab to Facebook Page

Memberi variasi akan menambah warna tersendiri. Begitu juga dengan fitur teranyar paman google yakni social web google plus.
Sebelumnya Koben sudah berbagi cara bagaimana memasukan link share (berbagi) postingan blog ke google+ Sekarang saatnya cara bagaimana menambahkan streamingan google+plus kedalam facebook page. Jadi syarat utama dari trik ini, sobat harus sudah memiliki facebook page. Silahkan bikin disini bagi yang belum punya Create a Page on facebook. Untuk sobat yg sudah punya, tinggal ikutin langkah² berikut ini...

Install aplikasi

1. Buka halaman berikut Google Plus Tab for Pages.
2. Klik tombol Go to App

Lakukan settingan disana, diikuti dengan mengklik Allow untuk mengijinkan Google+ access.
3. Add Google+ to your page. Pilih page (halaman) facebook yang akan dipasangkan aplikasi tersebut. Ikuti terus langkah selanjutnya disana...
4. Setelah beres, pergi ke facebook page kalian.

Klik google+
5. Final result

Resource by: Adding Google Plus stream tab to Facebook page by Blogger Sentral.
Didalam fan page facebook kalian sekarang sudah terpasang streamingan google+
Semoga bermanfaat, thanks for @BloggerSentral

Rabu, 18 Mei 2011

APP ID for Social Plugins Facebook

Salam bloglang semangat membara plugins. Sobat mungkin sudah mengetahui manfaat dari fitur plugins! Mungkin diblog ini postingan mengenai si pug-in jQuery sudah banyak ;)) Diawali dari mencoba live stream kepunyaan si facebook, lalu masuk ke wall dan ada sobat blogger yang kepincut :D Dipikir-pikir dari pada satu-satu neranginnya, mendingan langsung jebret ajah nih Beben share mengenai Social Plugins Facebook Developers. Ketika sobat membuka link facebook developers, maka akan terpampang disana 9 jenis plugins yang sudah ready stock buat kita sikat b-) (wc kaleee main sikat)

Untuk kemulusan rencana ini, diharapkan sobat agan harus sudah memiliki yg namanya App ID. Jika belum punya silahkan membuat dulu Create an App lalu ikutin langkah²nya :D Kalau yg sudah punya tinggal langsung menuju ke My Apps on Facebook, and that will look like this [..]

Facebook APP_IDPerhatikan gambar yg tulisannya dibedakan warna, nah warna merah itu yg sering dibutuhkan dalam pemakaian social plugins facebook. Itulah sobat pakai yah, jika mau membuat salah satu social plug-ins. Coba agan agin buka halaman berikut contoh dari sobat kita yg sudah membuatkan tools add like or recommend every to blogger post.

Contoh profile update dalam cara menterkenalkan blog kita Facebook Profile Update. Balik lagi ke acara social-plugins, jika sudah ini itunya sobat mah tinggal pencet ajah tombol guna mendapatkan kode/script yg nantinya dimasukkan ke template ;)

Get Code

Penempatan kode bisa melalui Add a Gadget ► HTML/Javascript atau juga langsung didalam template asal awas!!! jangan sampai bentrok dengan tag yg lainnya ;) Halaman berikut guna memperjelas penempatan secara default Facebook for Websites.
Segitu ajah deh kayaknya, kurang jelas ini-itunya bisa kita diskusikan bersama :)
Happy social plugins facebook \m/

Senin, 18 April 2011

Facebook Comments Box Plugin for Blogger

Hihihi, Beben Koben si bloglang anu ganteng kalem tea selaku raja bloglang in the house kembali membawa kabar hangat...hangat yaitu mengenai facebook comments plugin for blogger or facebook comments box :D Dari katanya saja sudah ada facebook and comments berarti kotak komentarnya si jejaring sosial FB bisa menclok di blog ;))
Perlu sobat ketahui bahwa terdapat dua versi kotak komentar FB yang bisa diapliasikan kedalam blogger ini.
  1. Pertama facebook comments for develop.
  2. Untuk membuat kotak komentar ini diperlukan yg namanya APP_ID (aplikasi ID)
  3. Kedua facebook comments not develop.
  4. Kalau ini tidak membutuhkan APP_ID tapi berfungsi sama.
Sebenarnya sama-sama saja sih kode script yg digunakannya. Hanya saja ada perbedaan sedikit (secuil) dalam pemanggilan syntax link post :D Kalo mau menggunakan APP_ID ya harus buat dulu di Create an App!
Sekarang sesi script guna mendapatkan kotak komentar buku wajah untuk blogspot.

Script facebook comments for develop

<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=YOUR_APP_ID&xfbml=1"></script><fb:comments expr:xid="data:post.id" numposts="10" width="425" publish_feed="true"></fb:comments>Ganti deh itu YOUR_APP_ID.
Resource by: 9lessons.

Script facebook comments for non develop

<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=APP_ID&xfbml=1"></script><fb:comments expr:href="data:post.url" num_posts="10" width="500"></fb:comments>Ini tidak memerlukan APP_ID.
Resource by: ETBlue
Perbedaannya terdapat pada pemanggilan syntax link expr:xid="data:post.id" and expr:href="data:post.url"

Jadi mudeung kan sob, kalo begini perbedaan dari komentar buat develop or non develop :) Jika sudah begini tinggal kreasi sobat dalam penerapannya. Beben Koben mah diaduin saja itu si ke-2 script diatas :-"

Script facebook comments develop/non develop + Like FB

<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=APP_ID&xfbml=1"/><fb:like expr:href="data:post.url" font="tahoma" show_faces="false" width="450"/><fb:comments expr:href="data:post.url" num_posts="10" width="500"/>Kalao pakai yg ini plus ada tombol likes ;)) Sok lah kreasikan sendiri...
Happy facebook comments on blogger \m/

Rabu, 19 Januari 2011

Facebook Skins FBskins.com

Setelah mengumpulkan artikel mengenai facebook baik itu tut atau hanya info saja, mungkin web dan blog berikut ini yang dapat mewakili dalam menghiasi facebook sobat-sobat :) FBSkins adalah bagian dari network saja dari situs skin agar terlihat berbeda, memberikan kita akses ke lebih dari 50.000 skin facebook!
Ribuan skins gratis.
FBSkins menawarkan gaya yang berbeda, warna, dan tema. Gunakan profil kita untuk memamerkan berbagai kulit dengan tema Musik, Selebriti, Film, TV, Cute, Cinta, dan begitu banyak lagi. Tidak ada harus menyalin dan menyisipkan kode apapun. Setelah plug-in diinstal, pilih kulit dan plug-in akan memuat karya seni kita. Proses instalasi memakan waktu kurang dari satu menit dan bekerja dengan semua browser.
*Update: Skin sekarang kompatibel dengan browser SEMUA termasuk Firefox, Internet Explorer, Google Chrome dan Safari!
Skins buatan Sendiri (customize)
Apakah kita dapat membuat pernyataan tentang siapa kita, dan apa yang kita suka, merancang tata letak kita sendiri! Mengapa tidak membuat skin untuk grup kita atau organisasi. Builder FBSkins memungkinkan kita untuk meng-upload gambar atau foto pilihan kita. Gambar ini sekarang akan menjadi bagian dari profil Facebook kita. Kita sekarang seorang desainer dan dapat menyesuaikan FBSkin kita sesuai dengan keinginan.
*Update: Kita kini dapat membuat edit sendiri agar skin, warna, tabel dll tampak edan punya dan full stylish!

More Features for your Facebook...

FBskins

Semakin dikembangkan dengan hadirnya dislike button for FB b-)

FB layouts

fbskins
You must first install the plugin. Click here to get yours today!
Silahkan kunjungi dan acak-acak web dan blognya guna mendapatkan cara dan tutorialnya yak \m/

Selasa, 21 Desember 2010

Creativity Photo Facebook Profile Page

Rehat sejenak dari artikel tutorial blogspot ah sob. Kali ini mau ngebahas cara ganti photo profile dengan metode tag, yang nantinya akan menjadi kreatif ;;) Sedikit potong memotong dari photoshop, lalu lakukan upload potongan photo tersebut dan lakukan tag jadi deh photo profile kreatif :D Seperti screenshot berikut, yg telah beben si bloglang anu ganteng kalem tea praktekan :D Click Here for Popup Here original article http://www.labnol.org/internet/customize-facebook-profile/18357/ Nanti sobat akan dikasih gambar berformat psd http://img.labnol.org/files/facebook_layout.psd Buka lalu perhatikan apa-apa yg harus diedit dan dipilih ;)

Untuk mengganti gambar, sobat buat/cari gambar dengan resolusi 700px X 500px lalu timpakan! Secara manipulasi gambar yg akan terpakai dan diupload itu sbb

barrack obama

Lakukan upload photo dari belakang (nomor 6), kalau photo (nomor 1) bisa didahulukan. Selamat berkreasi :-h expand for look via video

Jumat, 10 Desember 2010

Facebook Profile Update

Main-main ke jejaring sosial facebook, eh ternyata ada beberapa bagian diupdate b-) Paling menonjol pada bagian profile account facebook kita :-bd Setelah Beben si bloglang anu ganteng kalem tea jelajah dari sini ke sananya, kita dipermudah dalam membuat Like Badge, Your Badge Profile, Your Badge Tag Photos, and Promote for Web ;) Caranya cukup mudah sob, kalau yg memang pertama login perhatikan sisi atas :D
  1. Login to Facebook at http://www.facebook.com/about/profile/.
  2. Click the Get the New Profile button at the top right of the screen.
  3. Start the tour to update your Facebook profile page.
Dan inilah contoh hasilnya sob...

My BadgePhoto BadgePromote Web

Create Your Badge

Promote Your Page Too

Create Your Badge

Cepat edit sana, jangan melongo ajah ah ah ah :P See you and salam si bloglang \m/

Selasa, 30 November 2010

Sharecount Button for Facebook

Jika sobat sudah punya tombol berbagi facebook, atau share button yg seperti ini share button facebook, tidak ada yg salah dengan itu. Disini Beben si bloglang ganteng kalem tea cuman mau share yg lebih gaya. Namanya yaitu sharecount button! Terinspirasi dari retweet button memiliki fungsi yg mirip untuk menampilkan berapa blog/web kita sudah dishare via FB :) Tapi nanti dulu sob, ada fitur lainnya juga nich (inggrisan ah) ;))...

Features:

  • Displays the number of shares and on hover the total number of clicks for those shares (displays Facebook logo when 0 shares)
  • Large or small button.
  • Track the shares from the button using your awe.sm API Key or fbshare.me links.
  • Add Google Analytics parameters to fbshare.me links.
  • Configure the colors of the badge in the large button.
Intinya tombol ini terhubung dg google analytics. Contohnya nanti akan terlihat seperti ini:
<script type='text/javascript'>
var fbShare = {
url: 'http://YOUR-NAME.blogspot.com/',
size: 'large',
badge_text: 'C0C0C0',
badge_color: 'CC00FF',
google_analytics: 'true'
}
</script>
<script src="http://widgets.fbshare.me/files/fbshare.js"></script>

Rabu, 28 April 2010

FACEBOOK FOR WEBSITES

Facebook for Websites. Facebook jejaring sosial yang lagi booming ini makin membeberkan aplikasinya b-) Mark Zuckerberg1 founder dari web ini di tahun 2006 membangunnya. Ada informasi gembira dimana pengembang facebook mau memberikan beberapa platformnya untuk dipakai di blog kita ;))

Contents :

  • Social plugins
  • Single sign-on
  • Account registration data
  • Server-side personalization
  • Analytics
  • What's next?

Contoh satu yaitu tombol like dislike keluarannya sob :-bd

Ada recommendations, recent activity, comments, log-in button dll. Bagaimana cara mendapatkan platform ini? Tentu kita harus memiliki account FB tentunya ;)) Kalau sudah ada silahkan meluncur kemari deh Facebook for Websites. Login Facebook. Ciawww :-h

Selasa, 17 November 2009

Lite.Facebook (Chat cepat di Facebook)

Ben2PicBawa berita lagiii tentang facebook mania nih akuuu...hohohoho ^.^. Nah hayooo apa beritanya sekarang...hihihihi. BeBeN membawa berita yang mungkin sebagian kawan's sudah pada mengetahuinya juga sih. Tapi yaaa gak apa-apa lah, itung² berbagi...sapa tau aja kawan's belom ada yang membacanya gitoooH. Oh iya, kalau dari kawan's belom membaca artikel-artikel mengenai sekelumit tentang Facebook yang ada di blog BeBeN ini, silahkan kawan's ubek-ubek dibagian arsip kalendar yang ada disisi kanan blog ini. Hehehehe...^.^ Laaahhh...malah basa-basi ginih jadinya. Sampai lupa BeBeN mau memosting tentang Lite.Facebook. Nah loh apaan tuh !!! Yesss...itu adalah feature dari Facebook bagi kawan's yang memiliki koneksi rada lambat Lemot dalam ber-chat dihalaman Facebook. Katanya sih dan dengar-dengarnya, si-Facebook mengeluarkan feature ini dalam menyaingi adanya Twitter loh. Yaaa gak tahu benar gak tahu salah juga sih...xixixixi. Pokoknya yang pasti feature ini lumayan lebih ringan dari halaman Facebook itu sendiri (Khususnya buat chatingan gitoooH kawan's...!).
Nah untuk memulai menggunakan feature ini sangatlah mudah kok kawan's. Kawan's hanya tinggal buka ajah webnyah...wekekekekek. Nih linknyah : Lite.Facebook. Setelah kawan's membuka web tersebut, maka kawan's akan menemui tampilan depan dari si Lite.Facebook itu.

Be2nPic
Nah setelah kawan's melihat tampilan depan dari si Lite.Facebook, kawan's coba klik ajah tulisan Chat yang ada dibagian Menu.

Be2nPic
Nah gimana...keren kan, itu kolom chat akan membuka dalam bentuk pop up (new windows). Sehingga benar-benar itu kolom dikhususkan untuk chat dengan teman-teman kita di Facebook. Ahhh...pokoknya coba-cobain ajah deh tombol² yang ada di si-Lite.Facebook oleh kawan's sendiri. Nah ini salah satu gambar tampilan depan sewaktu kawan's sudah melakukan Log in di si-Lite.Facebook.

Be2nPic
Bagaimana...bagaimana...!!! NS : ShaleHolic.
Happy bloging...WassaLam ^_^.

Rabu, 04 November 2009

Widget Facebook untuk Blog

blog-beben Dapat lagi artikel/postingan yang menurut BeBeN good good...ihihihihi. Apaan yaaa...yang good good itu. Hmmm...inget enggak kawan's postingan BeBeN yang ini Tombol Berbagi dari Facebook. Terus postingan BeBeN yang ini Membuat Fan Facebook ke Blog. Nah sekarang BeBeN dapat bagaimana caranya memasukkan Facebook kedalam Blog kawan's. Mungkin belon kebayang gimana itu si Facebook bisa ada di blog yaaa...ixixixi ^.^. Tenang kawan's, trik ini sudah dalam bentuk widget dari pembikinnyah. Jadi kawan's tinggal add gadget ajah...kekekekek.
Oh ia...nama widget ini yaitu Tiny Facebook Widget. Yang artinya kata yang bikinnya sih...ihihihi widget untuk memunculkan Facebook didalam Blog. Yang uniknya lagi...kalo ada sesama kawan's sudah memasang widget ini, kita bisa langsung melihat isi dari facebook kita di blog yang sedang kita kunjungi. Nah bagaimana caranya untuk bisa mendapatkan si Tiny Facebook Widget.
  1. Silahkan kawan's klik Layout > Add Gadget > pilih yang HTML/JavaScript
  2. Lalu kopikan script berikut ini :
    <script src=http://script.eksperimen.com/tinyfacebook.php></script>
  3. Save deh...^,^
Gambar yang sudah jadi :


Spesifikasi dari scriptnya :
  • Default panjang/tinggi dari panjang/tinggi kolom facebook di widget "350px"
  • Default lebar dari lebar facebook di widget "255px"
Nah kalau kawan's mau mengatur panjang/tinggi dan lebar dari facebook di widget ini caranya juga gampang kok ^_+. Kawan's tinggal menambahkan tulisan tinggi=xxx&lebar=xxx dibelakang si scriptnyah. Jika kawan's menginginkan tinggi 150 dan lebar 200 maka dalam menuliskan scritpnya menjadi :
<script src=http://script.eksperimen.com/tinyfacebook.php?tinggi=150&lebar=200></script>
Cukup mudah kan kawan's...qiqiqiqiqi ^.^'

NS : Eksperimen <--| Yang punya ide.
NB : Kalau sudah joint ke Facebook, cobalah kawan's scroll kebagian bawah si-Tiny Facebook Widget. Cari tulisan Full page...maka kalau diklik tulisan tersebut akan tampak tampilan Facebook aslinya tapi didalam blog kita. Xixixixi...lutu jadi kecil dan imyut² ^.^

Kamis, 29 Oktober 2009

Tombol berbagi Facebook untuk Blogger

Sebenarnya postingan ini maunya disatuin ama postingan Membuat Fan Facebook di Blog. Tapi takut kepanjangan, jadi ajah dibikin dua. Ixixixixi...;)). Facebook kini telah secara resmi memperkenalkan tombol berbagi untuk blog atau situs kita. Tombol-tombol ini terlihat lebih mirip dengan tombol Retweet oleh Tweetme. Facebook sendiri memiliki 5 gaya tombol untuk berbagi lewat web kita. Dengan menambahkan tombol berbagi dari Facebook, ini berarti telah berapa kali postingan kita telah tampil di Facebook itu tersendiri...ixixixi ^,^

Facebook Share Button gaya pertama

BebenPic

Kodenya nih kawan's :

<div style="float:right;padding:4px;"><a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='box_count'/>
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/>
</div>

Facebook Share Button gaya kedua

BebenPic

Kodenya nih kawan's :

<div style="float:left;padding:4px;"><a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='box_count'/>
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/>
</div>

Facebook Share Button Compact gaya pertama

BebenPic

Kodenya Compact nih kawan's :

<div style="float:right;padding:4px;"><a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/>  
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/>
</div>

Facebook Share Button Compact gaya kedua

BebenPic

Kodenya Compact yang kedua nih kawan's :

<div style="float:left;padding:4px;"><a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/>
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/>
</div>

How to install Facebook Share Count Button on your Blogger Blog?

  1. Pilih salah satu tombol yang kawan's inginkan
  2. Login ke Dashboard > Layout > Edit Html > Expand Widget Templates
  3. Cari kode berikut dengan mengetik Ctrl + F
  4. <div class='post-header-line-1'/>
    Setelah ketemu sisipkan script tombol yang tadi telah kawan's pilih setelah kode tersebut. Jika kawan's tidak menemukan kode diatas, coba cari kode dibawah ini :
    <data:post.body/>
    Kalau sudah ketemu sisipkan script tombol yang tadi telah kawan's pilih. Sisipkan script tadi sebelum kode diatas.
  5. Save deh...Ixixixi...^_^.

NB : Blogger Widgets
Link : Facebook Developers

Membuat Fan Facebook di Blog

Tak bisa disangkal lagi kehadiran sosial jaringan bagi penjelajah dunia maya sangatlah berguna. Salah satunya yaitu Facebook, yang saat ini memang sedang digandrungi oleh para penjelajah dunia maya. Memang beraneka ragam macam kegunaan dari jaringan sosial ini. Dari yang hanya sebatas have fun, bisnis, menjaring kawan's², dan banyak lagi. Nah...dengan banyaknya kehadiran sosial jaringan ini, kita sebagai Blogger mengapa tidak menggunakannya sebagai perluasan jaringan kita (Khususnya blog kita kawan's). Hihihihi...^.^. Dicinih BeBeN akan berbagi bagaimana caranya memasukkan tombol berbagi dari Blog kedalam account Facebook kita (Seperti tombol DIGG IT). Dan tombol menjadi fans Facebook kedalam account Blog kita. Yukkk...
Bagi kawan's blogger yang sudah tahu...jangan diketawain yah...hohoho. Ini khusus bagi yang mau ajah, giTOH.
  1. Masuk ke Fan Facebook

  2. BebenPic

    Pilih Brand, Produk, atau Organisasi > Website. Ketik Nama Fan Page yang kawan's mau dan centang tanda setuju untuk membuatnya. Tekan saja tombol bikin halaman Fan kawan's, jadi deh :)

  3. Pada halaman berikutnya pilih Change picture dan Edit Information untuk mengisi dan mengganti gambar dan informasi yang kawan's perlukan.

  4. BebenPic

  5. Setelah itu, kawan's klik tanda plus/add dan pilihlah option Notes

  6. BebenPic

    Setelah menambahkan halaman baru Notes buatlah Write a New Note

    BebenPic

  7. Lihat kekanan atas dari halaman yang telah dibuat oleh kawan's

  8. BebenPic

  9. Pada halaman berikutnya, kawan's pilih Import a blog

  10. BebenPic

  11. Pada langkah selanjutnya, ketik halaman Blog kawan's dan centang tanda persetujuan lalu mulai Start Importing

  12. BebenPic

  13. Setelah itu kawan's konfirmasi deh tadi ngimpor si Blognyah...uekekekek

  14. BebenPic

  15. Setelah melakukan konfirmasi, maka semua postingan kawan's sudah ter-import kehalaman Fan Facebook kawan's. Klik Link Fan facebook kawan's kembali

  16. BebenPic

  17. Beres deh, sekarang kawan's sudah memiliki Fan Facebook di Blog kawan's. Untuk mengedit-ngedit photo, diskusi, box dan yang lain-lainnya yang dianggap tidak perlu, kawan's bisa melakukannya dengan mengklik tombol Tab yang ada pada profile Fan Facebook kawan's.BebenPic Nah sekarang kawan's untuk meng-Add Fan Facebook kawan's, kawan's harus melakukan ritual terlebih dahulu. Ritualnya yaitu klik Promote with a Fan Box kawan's. Setelah itu ter-Add deh Fan Box kawan's ke Blog kawan's. :) ^.^ BebenPic
    Beres deh ah, kawan's sekarang bisa memiliki Fan Box Facebook di Blog kawan's sendiri. URL Link Fan Box kawan's akan terlihat seperti : http://www.facebook.com/pages/beben-kobenblogspotcom/152725955134 Berhati-hatilah dalam memilih nama kecil bagi Fan Box kawan's, soalnya enggak bisa diganti tuch. Beben ulik² enggak ketemu juga gimana gantinyah. Enggak tau tuh kalo digantinya langsung dari scriptnya yang sudah jadi. Wuekekekkk ^,^
  18. Yang paling penting nih dari semuanyah, kawan's mau enggak jadi Fannya BeBeN yang imyut dan cutez inih...xixixixi ^_^
Kalau mau :


Dah ah WassaLam...HAPPY BLOGGING...^.^
NB : Blogger Widgets