Loading...
Flash Player 9 (or above) is needed to view slideshows. We have detected that you do not have it on your computer.To install it, go here
 
Post to Twitter Post to Twitter
Myspace Hi5 Friendster Xanga LiveJournal Facebook Blogger Tagged Typepad Freewebs BlackPlanet gigya icons
SlideShare is now available on LinkedIn. Add it to your LinkedIn profile.

Facebookcamp Toronto FBML

From sboodram, 2 years ago Add as contact

A presentation on the Facebook FBML (facebook markup language)

3000 views | 0 comments | 3 favorites | 137 downloads | 1 embeds (Stats)

Categories

Groups/Events

Embed in your blog options close
Embed (wordpress.com) Exclude related slideshows Embed in your blog

More Info

This slideshow is Public
Total Views: 3000 on Slideshare: 2975 from embeds: 25
Most viewed embeds (Top 5): More
All Embeds: Less
Flagged as inappropriate Flag as inappropriate

Flag as inappropriate

Select your reason for flagging this slideshow as inappropriate.

If needed, use the feedback form to let us know more details.

Slideshow Transcript

  1. Slide 1: P a rt of th e F a c e book De ve lope r G a ra g e s e rie s
  2. Slide 2: F a c e b ook (F B ML) by: sunil boodram em: sunil.boodram@gmail.com
  3. Slide 3: Ta b le Of C onte nts • Wh a t is F B ML? • Wh a t is it us e d for? • How doe s it work? • Wh e re c a n I find doc ume nta tion? • F B ML (HTML ta g lis t) • Code S nippe ts • Conc lus ion
  4. Slide 4: Wh a t is F B ML? • F B ML is a n a c ronym for “F a c e book Ma rkup La ng ua g e .” It ope ra te s a lot like HTML a nd it g ive s us th e a bility to do va rious ta s ks with e a s e s uc h a s : – s e nding a us e r e -ma il – c re a ting a two c olumn form – e mbe dding fla s h vide o – c re a ting a da s h boa rd – dis pla ying a h e a de r…e tc • F B ML a ls o a llows th e us e of re g ula r HTML ta g s ; th is a llows us a g re a t a mount of fle xibility wh e n forma tting c onte nt
  5. Slide 5: Wh a t is it us e d for? • F B ML is us e d to ta p in to va rious F a c e book e le me nts wh e n building our a pplic a tions . • E le me nts s uc h a s (s ome of wh ic h I re pe a te d be fore ): – s e n d in g a u s e r e -m a il – p os tin g on a wa ll – d is pla yin g a profile pic tu re – la yin g ou t c o nte n t b a s e d o n th e a p plic a tio n b o x d is p la ye d o n a u s e r’s pro file pa g e , na m e ly wid e or na rro w – c re a ting b utton s – c h e c kin g if a us e r is in a g rou p a n d m u c h m o re
  6. Slide 6: How doe s it work? • As I pre vious ly s ta te d it works a lot like HTML. • We us e s pe c ific ta g s de pe nding on th e ne e ds of our a pplic a tions • One e xa mple is fb:g oog le -a na lytic s , wh ic h g e ne ra te s th e s nippe t of c ode we us e to ins e rt in our pa g e s , if we us e G oog le a na lytic s for s ta tis tic a l pa g e tra c king • F a c e book a ls o a llows th e us e of re g ula r HTML ta g s , s uc h a s <a h re f=”#”></ >, wh ic h is us e d to g e ne ra te a a h ype rlink. F a c e book a ls o a llows th e us e of ma ny more HTML ta g s for building a pplic a tions
  7. Slide 7: Wh e re c a n I find doc um e nta tion? • F a c e book doc ume nta tion: h ttp:/ de ve lope rs .fa c e b ook.c om / um e nta tion.ph p? doc =fb m l / doc • Th e F a c e book Wiki: h ttp:/ wiki.de ve lope rs .fa c e b ook.c om / / inde x.ph p/ B ML_doc um e nta tion F • F a c e book de ve lope r a pplic a tion: h ttp:/ www.fa c e b ook.c om / ve lope rs / / de
  8. Slide 8: F B ML [h tml th a t works with F B ML] • s ub • a • h4 • s up • abbr • h5 • table • acronym • h6 • tbody • addres s • hr td • b • • i textarea • bdo • img • • tfoot • big input • • th • blockquote • ins • thead • br • kbd • tr • captio n • label • tt • center • le gend u • dfn • • li ul • cite • ol • • var • code optgroup • • dd • optio n • del • p • div • pre • dl • q dt • s • em • s amp • • fields et • s ele ct • font • s mall • form • s pan • h1 • s trike h2 • • s trong h3 • s tyle •
  9. Slide 9: C ode S nippe t [two c olumn form] <fb:e dito r ac tion=\"ne w.php\" labe lwidth=\"50\"> <fb:e dito r-te xt labe l=\"Title \" name =\"title \" value =\"\"/> <fb:e dito r-te xt labe l=\"Author\" name =\"author\" value =\"\"/> <fb:e dito r-c us tom labe l=\"Status \"> <s e le c t name =\"s tate \"> <option value =\"0\" s e le c te d>have re ad</option> <option value =\"1\">am re ading</option> <option value =\"2\">want to re ad</option> </s e le c t> </fb:e dito r-c us to m> <fb:e dito r-te xtare a labe l=\"Comme nt\" name =\"c omme nt\"/> <fb:e dito r-butto ns e t> <fb:e ditor-butto n value =\"Add\"/> <fb:e ditor-butto n value =\"Re c omme nd\"/> <fb:e ditor-c anc el /> </fb:e dito r-buttons et> </fb:e dito r>
  10. Slide 10: C ode S nippe t [profile box: wide vs . na rrow] <fb :wide >fb m l inte nde d for th e wide rig h t c olum m </ :wide > fb <fb :na rrow>fb m l inte nde d for th e na rrow le ft c olum m </ :na rrow> fb
  11. Slide 11: C ode S nippe t [building a da s h boa rd] <fb :da s h b oa rd> <fb :a c tion h re f=\"inde x.ph p\">Hom e </ :a c tion> fb <fb :a c tion h re f=\"b uy.ph p\">B uy</ :a c tion> fb <fb :a c tion h re f=\"s e ll.ph p\">S e ll</ :a c tion> fb <fb :a c tion h re f=\"s ta ts .ph p\">S ta ts </ :a c tion> fb <fb :a c tion h re f=\"fly.ph p\">F ly</ :a c tion> fb <fb :a c tion h re f=\"top.ph p\">Top</ :a c tion> fb <fb :a c tion h re f=\"b a nk.ph p\">B a nk</ :a c tion> fb <fb :h e lp h re f=\"h e lp.ph p\">He lp</ :h e lp> fb </ :da s h b oa rd> fb
  12. Slide 12: C ode S nippe t [re nde r a wa llpos t] <fb :wa ll> <fb :wa llpos t uid=\"502501165\" t=\"1180070566\"> I'm jus t a b it of te xt. <fb :wa llpos t-a c tion h re f=\"re ply.ph p\"> R e ply </ :wa llpos t-a c tion> fb </ :wa llpos t> fb </ :wa ll> fb
  13. Slide 13: C ode S nippe t [d is p la y a linke d profile p ic ture ] <fb :profile -pic s iz e =“t” uid=\"502501165\" linke d=\"ye s \" />
  14. Slide 14: Code S nippe t [ifra m e ] <fb :ifra m e s rc =\"h ttp:/ www.a pple .c om \"></ :ifra m e > / fb
  15. Slide 15: F B ML [te s t c ons ole ] h ttp:/ de ve lope rs .fa c e b ook.c om / / tools .ph p? fb m l
  16. Slide 16: Conc lus ion • F B ML pla ys a n importa nt role in building a pplic a tions • Wh e n you de c ide wh a t your a pplic a tion will c ons is ts of, c h e c k th e doc ume nta tion to s e e if a n F B ML ta g e xis ts , wh ic h c a n ma ke your job e a s ie r • F B ML ta g s a re s till be ing produc e d, c h e c k th e de ve lope r a pplic a tion fre que ntly (a dd it if you h a ve n’t a lre a dy) for ne ws a nd re c e nt c h a ng e s • Th e F a c e book AP I is a g re a t wa y to c re a te a pplic a tions a nd th e pos s ibility for a pplic a tions a re e ndle s s …Ha ve fun!