Step by Step Guide for Creating Fancy Facebook Fan Pages by Olaf Nitz | olafnitz.net
About this Facebook Guide <ul><li>Since the social networking site Facebook is about to become one of the largest and most...
Agenda <ul><li>5 Login, Create & Publish Page </li></ul><ul><li>13 Profile Picture & Page Description </li></ul><ul><li>17...
GET STARTED <ul><li>Login, Creating & Publishing a Page </li></ul>
Login <ul><li>http://www.facebook.com   </li></ul><ul><li>GETTING STARTED </li></ul>Username
Create Page <ul><li>http://www.facebook.com/home.php ?  </li></ul><ul><li>GETTING STARTED </li></ul>
Select „Pages“ <ul><li>http://www.facebook.com/advertising/   </li></ul><ul><li>GETTING STARTED </li></ul>
Create Page <ul><li>http://www.facebook.com/advertising/?pages   </li></ul><ul><li>GETTING STARTED </li></ul>
Choose Category & Create Page <ul><li>http://www.facebook.com/pages/create.php   </li></ul><ul><li>GETTING STARTED </li></...
Result: New Fan Page <ul><li>GETTING STARTED </li></ul>
Publish Page: Option 1 <ul><li>GETTING STARTED </li></ul>
Publish Page: Option 2 <ul><li>GETTING STARTED </li></ul>
FIRST ADAPTATIONS <ul><li>Profile Picture & Description </li></ul>
Profile Picture <ul><li>GETTING STARTED </li></ul>
Advanced Profile Picture <ul><li>GETTING STARTED </li></ul>Canvas size:  200 px width;  Background: Blue: Color #ECEFF4; 5...
Page Description <ul><li>GETTING STARTED </li></ul>Text and Links possible
ADD PHOTOS <ul><li>Creating Albums, Uploading, Publishing </li></ul>
Create a Photo Album <ul><li>ADD PHOTOS </li></ul>
Album Details <ul><li>ADD PHOTOS </li></ul>
Loading Java <ul><li>ADD PHOTOS </li></ul>
Select Photos <ul><li>ADD PHOTOS </li></ul>Non-Java / Simple HTML-Upload also available
Upload Photos <ul><li>ADD PHOTOS </li></ul>
Upload Successful <ul><li>ADD PHOTOS </li></ul>
Publish Photos <ul><li>ADD PHOTOS </li></ul>
PAGE FAVOURITES <ul><li>Linking other Pages from your Fan Page,  Creating a Network of Fan Pages </li></ul>
Go to Fan Page & Add to Favourites <ul><li>PAGE FAVOURITES </li></ul>
Select Page <ul><li>PAGE FAVOURITES </li></ul>
Result: Favourite Pages <ul><li>PAGE FAVOURITES </li></ul>
VANITY URLS <ul><li>Creating Custom Short-URLs </li></ul>
Select Username for your Page <ul><li>http://www.facebook.com/username/ </li></ul><ul><li>VANITY URLS </li></ul>It is poss...
Choose Page <ul><li>http://www.facebook.com/username/ </li></ul><ul><li>VANITY URLS </li></ul>
Choose Username <ul><li>http://www.facebook.com/username/ </li></ul><ul><li>VANITY URLS </li></ul>
Result: Vanity URL <ul><li>VANITY URLS </li></ul>
CUSTOM TABS <ul><li>Adding your own Text & Graphics  </li></ul>
Search App <ul><li>CUSTOM TABS </li></ul>
Search FBML App <ul><li>http://www.facebook.com/apps/directory.php  </li></ul><ul><li>CUSTOM TABS </li></ul>
Select „Static FBML“ <ul><li>CUSTOM TABS </li></ul>
Add App to Page <ul><li>http://www.facebook.com/apps/application.php?id=4949752878&ref=appd  </li></ul><ul><li>CUSTOM TABS...
Choose Page <ul><li>CUSTOM TABS </li></ul>
Edit App <ul><li>Edit Page </li></ul><ul><li>CUSTOM TABS </li></ul>
Insert HTML / FBML <ul><li>CUSTOM TABS </li></ul><ul><li>Dos: </li></ul><ul><li>HTML </li></ul><ul><li>HTML forms </li></u...
Option: Add another FBML Box <ul><li>CUSTOM TABS </li></ul>
Edit App Settings <ul><li>CUSTOM TABS </li></ul>
Add App to Tabs / Boxes <ul><li>CUSTOM TABS </li></ul>
Arrange Tabs: Drag & Drop <ul><li>CUSTOM TABS </li></ul>
Move App from Boxes to Wall Tab <ul><li>CUSTOM TABS </li></ul>
Wall Tab: Result <ul><li>CUSTOM TABS </li></ul>Image width: 200 Pixel
VIDEO APP <ul><li>Uploading Videos, </li></ul><ul><li>Recording with your Webcam </li></ul>
App: Video    Add to Page <ul><li>http://www.facebook.com/apps/application.php?id=2392950137   </li></ul><ul><li>VIDEO AP...
Choose Page    Add to Page <ul><li>VIDEO APP </li></ul>
Edit Page Settings    Video Edit <ul><li>VIDEO APP </li></ul>
Add Videos <ul><li>VIDEO APP </li></ul>
Select file on your Computer <ul><li>VIDEO APP </li></ul>
Agree to Terms of Service <ul><li>VIDEO APP </li></ul>
Upload Video & Enter Info <ul><li>VIDEO APP </li></ul>
Save Info <ul><li>VIDEO APP </li></ul>
Video Processing <ul><li>VIDEO APP </li></ul>
Result: Video <ul><li>VIDEO APP </li></ul>
Result: Video <ul><li>VIDEO APP </li></ul>
Result: Video <ul><li>VIDEO APP </li></ul>
Record Video from Webcam <ul><li>VIDEO APP: WEBCAM </li></ul>
Settings Adobe Flash Player <ul><li>VIDEO APP: WEBCAM </li></ul>
Close <ul><li>VIDEO APP: WEBCAM </li></ul>
Record Video <ul><li>VIDEO APP: WEBCAM </li></ul>
Record Video & Stop <ul><li>VIDEO APP: WEBCAM </li></ul>
Save Video <ul><li>VIDEO APP: WEBCAM </li></ul>
Save Video <ul><li>VIDEO APP: WEBCAM </li></ul>
Enter Info & Save <ul><li>VIDEO APP: WEBCAM </li></ul>
Result: Webcam Video <ul><li>VIDEO APP: WEBCAM </li></ul>
YOUTUBE PLAYER <ul><li>Adding a Video Playlist of Youtube Videos </li></ul>
App: Youtube Player <ul><li>http://www.facebook.com/apps/application.php?id=6916954478   </li></ul><ul><li>YOUTUBE PLAYER ...
Add App to your Page <ul><li>YOUTUBE PLAYER </li></ul>
Edit Page    Edit <ul><li>YOUTUBE PLAYER </li></ul>
Allow Access <ul><li>YOUTUBE PLAYER </li></ul>
Add Videos <ul><li>YOUTUBE PLAYER </li></ul>
Enter Videos & Save <ul><li>YOUTUBE PLAYER </li></ul>
Edit Page    Application Settings <ul><li>YOUTUBE PLAYER </li></ul>
Add Videos to Tabs <ul><li>YOUTUBE PLAYER </li></ul>
Result    Arrange Tab <ul><li>YOUTUBE PLAYER </li></ul>
Result: Youtube Player <ul><li>YOUTUBE PLAYER </li></ul>
YOUTUBE VIDEO BOX <ul><li>Adding Youtube Videos </li></ul>
Add App to Page <ul><li>http://www.facebook.com/apps/application.php?id=3801015922   </li></ul><ul><li>YOUTUBE VIDEO BOX <...
Select Page <ul><li>YOUTUBE VIDEO BOX </li></ul>
Edit Page    Edit Settings <ul><li>YOUTUBE VIDEO BOX </li></ul>
Add Videos from Youtube <ul><li>YOUTUBE VIDEO BOX </li></ul>
Add Youtube URL <ul><li>YOUTUBE VIDEO BOX </li></ul>
Edit Details & Save Video <ul><li>YOUTUBE VIDEO BOX </li></ul>
Back to Page Videos <ul><li>YOUTUBE VIDEO BOX </li></ul>
Add another Video <ul><li>YOUTUBE VIDEO BOX </li></ul>
Save URL <ul><li>YOUTUBE VIDEO BOX </li></ul>
Edit Details & Save <ul><li>YOUTUBE VIDEO BOX </li></ul>
Back to Page Videos <ul><li>YOUTUBE VIDEO BOX </li></ul>
Page Videos <ul><li>YOUTUBE VIDEO BOX </li></ul>
Edit Application Settings <ul><li>YOUTUBE VIDEO BOX </li></ul>
Add App to Tab <ul><li>YOUTUBE VIDEO BOX </li></ul>
Save Settings <ul><li>YOUTUBE VIDEO BOX </li></ul>
Arrange Tabs <ul><li>YOUTUBE VIDEO BOX </li></ul>
Result Youtube Video Box <ul><li>YOUTUBE VIDEO BOX </li></ul>
TWITTER FOR PAGES <ul><li>Integrating your Tweets </li></ul>
Choose Page <ul><li>http://www.facebook.com/add.php?api_key=6f77619e603ca9b71b45f5cd105be888&pages   </li></ul><ul><li>TWI...
Add App Twitter for Pages <ul><li>TWITTER FOR PAGES </li></ul>
Enter Details & Select User <ul><li>TWITTER FOR PAGES </li></ul>
Continue <ul><li>TWITTER FOR PAGES </li></ul>
Edit Page    App. Settings <ul><li>TWITTER FOR PAGES </li></ul>
Add Tab <ul><li>TWITTER FOR PAGES </li></ul>
Add Tab & Save <ul><li>TWITTER FOR PAGES </li></ul>
Arrange Tabs    Drag & Drop <ul><li>TWITTER FOR PAGES </li></ul>
Result: Twitter for Pages <ul><li>TWITTER FOR PAGES </li></ul>
RSS / BLOG <ul><li>Integrating a Blog </li></ul>
App Social RSS: Add to my Page <ul><li>http://www.facebook.com/apps/application.php?id=23798139265   </li></ul><ul><li>RSS...
Add App to Page <ul><li>RSS / BLOG </li></ul>
Edit Page    Edit Social RSS <ul><li>RSS / BLOG </li></ul>
Add RSS Feed <ul><li>RSS / BLOG </li></ul>
Updating… <ul><li>RSS / BLOG </li></ul>
Feeds Updated <ul><li>RSS / BLOG </li></ul>
Add Tab: Application Settings <ul><li>RSS / BLOG </li></ul>
Add Tab <ul><li>RSS / BLOG </li></ul>
Add Tab & Save <ul><li>RSS / BLOG </li></ul>
Result: Blogpostings in Tab <ul><li>RSS / BLOG </li></ul>
CREATING A SIMPLE APP <ul><li>Content from a Website on Facebook </li></ul>
Creating Content: PHP Code <ul><li>Example: Including Twitter via RSS </li></ul><ul><li>Upload PHP-File to a Server </li><...
PHP File in Browser <ul><li>CREATING A SIMPLE APP </li></ul>
Set Up New Application <ul><li>http://www.facebook.com/developers/   </li></ul><ul><li>CREATING A SIMPLE APP </li></ul>
Choose Application Name <ul><li>http://www.facebook.com/developers/createapp.php   </li></ul><ul><li>CREATING A SIMPLE APP...
Basic Settings <ul><li>CREATING A SIMPLE APP </li></ul>
Authentication: Enable Installable Facebook Pages <ul><li>CREATING A SIMPLE APP </li></ul>
Canvas: Add Canvas Page URL <ul><li>CREATING A SIMPLE APP </li></ul>
Result & Edit Settings <ul><li>CREATING A SIMPLE APP </li></ul>
Add Tab Information <ul><li>CREATING A SIMPLE APP </li></ul>Tab URL is required for adding app as a tab. Tab URL is relati...
Go to App Profile <ul><li>CREATING A SIMPLE APP </li></ul>
Add App to Page <ul><li>CREATING A SIMPLE APP </li></ul>
Add App to Page <ul><li>CREATING A SIMPLE APP </li></ul>
Edit Page: Application Settings <ul><li>CREATING A SIMPLE APP </li></ul>
Add App to Tab (1) <ul><li>CREATING A SIMPLE APP </li></ul>
Add App to Tab (2) <ul><li>CREATING A SIMPLE APP </li></ul>
Result: External Content <ul><li>CREATING A SIMPLE APP </li></ul>
POLLS
Application Poll <ul><li>http://www.facebook.com/apps/application.php?id=20678178440   </li></ul>
Add App to Page
Create Poll
Enter Questions & Options
Publish Poll
Result: Poll on the Wall
Poll in „Boxes“
Poll in the Wall Tab
Result: Poll
LANDINGTAB <ul><li>Seding the user to a specific tab </li></ul>
Edit Page    Wall Settings <ul><li>LANDINGTAB </li></ul>
Select Default Tab for Non-Fans <ul><li>LANDINGTAB </li></ul>Fans  will be sent to the wall by default. This setting only ...
Select Tab <ul><li>LANDINGTAB </li></ul>
ABOUT & CONTACT <ul><li>Final Things </li></ul>
About this Document <ul><li>This document was created by Olaf Nitz and is published under a Creative Commons License.  </l...
Any Questions? <ul><li>Olaf Nitz </li></ul><ul><li>Web & Blog:  http://olafnitz.net   </li></ul><ul><li>Email: mail (at) o...
Upcoming SlideShare
Loading in...5
×

Fancy Facebook Fan Pages - A Step By Step Guide

99,077

Published on

Step by Step Guide for Creating Facebook Fan Pages including Polls, Twitter, Photos, Youtube, RSS / Blogs, Landingtab, Vanity URLs

Published in: Business, Technology
39 Comments
448 Likes
Statistics
Notes
No Downloads
Views
Total Views
99,077
On Slideshare
0
From Embeds
0
Number of Embeds
74
Actions
Shares
0
Downloads
0
Comments
39
Likes
448
Embeds 0
No embeds

No notes for slide

Fancy Facebook Fan Pages - A Step By Step Guide

  1. 1. Step by Step Guide for Creating Fancy Facebook Fan Pages by Olaf Nitz | olafnitz.net
  2. 2. About this Facebook Guide <ul><li>Since the social networking site Facebook is about to become one of the largest and most visited websites globally, you should think about expanding your online presence to Facebook. </li></ul><ul><li>That’s what everybody tells you these days – but no one tells you how to create an outstanding Facebook Fan Page. As a corporation you can engage in Facebook in different ways, and creating a fan page is the most powerful one. Although it is easy to set up the page, creating a fancy fan page is a little tricky. </li></ul><ul><li>There are tons of applications on Facebook from which I selected a few which proved to be useful. </li></ul><ul><li>This guide is not exhaustive, but it can help you to create and enhance your Facebook presence. </li></ul>
  3. 3. Agenda <ul><li>5 Login, Create & Publish Page </li></ul><ul><li>13 Profile Picture & Page Description </li></ul><ul><li>17 Add Photos </li></ul><ul><li>25 Page Favourites </li></ul><ul><li>29 Vanity URLs </li></ul><ul><li>34 Custom Tabs with Text & Images </li></ul><ul><li>48 Video App </li></ul><ul><li>70 Youtube Player </li></ul><ul><li>81 Youtube Video Box </li></ul><ul><li>99 Twitter for Pages </li></ul><ul><li>109 Integration RSS / Blog </li></ul><ul><li>120 Create a simple App </li></ul><ul><li>137 Polls </li></ul><ul><li>147 Landingtab </li></ul><ul><li>151 About the Guide & the Author </li></ul>
  4. 4. GET STARTED <ul><li>Login, Creating & Publishing a Page </li></ul>
  5. 5. Login <ul><li>http://www.facebook.com </li></ul><ul><li>GETTING STARTED </li></ul>Username
  6. 6. Create Page <ul><li>http://www.facebook.com/home.php ? </li></ul><ul><li>GETTING STARTED </li></ul>
  7. 7. Select „Pages“ <ul><li>http://www.facebook.com/advertising/ </li></ul><ul><li>GETTING STARTED </li></ul>
  8. 8. Create Page <ul><li>http://www.facebook.com/advertising/?pages </li></ul><ul><li>GETTING STARTED </li></ul>
  9. 9. Choose Category & Create Page <ul><li>http://www.facebook.com/pages/create.php </li></ul><ul><li>GETTING STARTED </li></ul>Features in the Info-Section depend on category
  10. 10. Result: New Fan Page <ul><li>GETTING STARTED </li></ul>
  11. 11. Publish Page: Option 1 <ul><li>GETTING STARTED </li></ul>
  12. 12. Publish Page: Option 2 <ul><li>GETTING STARTED </li></ul>
  13. 13. FIRST ADAPTATIONS <ul><li>Profile Picture & Description </li></ul>
  14. 14. Profile Picture <ul><li>GETTING STARTED </li></ul>
  15. 15. Advanced Profile Picture <ul><li>GETTING STARTED </li></ul>Canvas size: 200 px width; Background: Blue: Color #ECEFF4; 51px height; 200px width; Grey Line: Color #E0E0E8;
  16. 16. Page Description <ul><li>GETTING STARTED </li></ul>Text and Links possible
  17. 17. ADD PHOTOS <ul><li>Creating Albums, Uploading, Publishing </li></ul>
  18. 18. Create a Photo Album <ul><li>ADD PHOTOS </li></ul>
  19. 19. Album Details <ul><li>ADD PHOTOS </li></ul>
  20. 20. Loading Java <ul><li>ADD PHOTOS </li></ul>
  21. 21. Select Photos <ul><li>ADD PHOTOS </li></ul>Non-Java / Simple HTML-Upload also available
  22. 22. Upload Photos <ul><li>ADD PHOTOS </li></ul>
  23. 23. Upload Successful <ul><li>ADD PHOTOS </li></ul>
  24. 24. Publish Photos <ul><li>ADD PHOTOS </li></ul>
  25. 25. PAGE FAVOURITES <ul><li>Linking other Pages from your Fan Page, Creating a Network of Fan Pages </li></ul>
  26. 26. Go to Fan Page & Add to Favourites <ul><li>PAGE FAVOURITES </li></ul>
  27. 27. Select Page <ul><li>PAGE FAVOURITES </li></ul>
  28. 28. Result: Favourite Pages <ul><li>PAGE FAVOURITES </li></ul>
  29. 29. VANITY URLS <ul><li>Creating Custom Short-URLs </li></ul>
  30. 30. Select Username for your Page <ul><li>http://www.facebook.com/username/ </li></ul><ul><li>VANITY URLS </li></ul>It is possible to create Vanity URLs for Fan Pages with more than 50 fans.
  31. 31. Choose Page <ul><li>http://www.facebook.com/username/ </li></ul><ul><li>VANITY URLS </li></ul>
  32. 32. Choose Username <ul><li>http://www.facebook.com/username/ </li></ul><ul><li>VANITY URLS </li></ul>
  33. 33. Result: Vanity URL <ul><li>VANITY URLS </li></ul>
  34. 34. CUSTOM TABS <ul><li>Adding your own Text & Graphics </li></ul>
  35. 35. Search App <ul><li>CUSTOM TABS </li></ul>
  36. 36. Search FBML App <ul><li>http://www.facebook.com/apps/directory.php </li></ul><ul><li>CUSTOM TABS </li></ul>
  37. 37. Select „Static FBML“ <ul><li>CUSTOM TABS </li></ul>
  38. 38. Add App to Page <ul><li>http://www.facebook.com/apps/application.php?id=4949752878&ref=appd </li></ul><ul><li>CUSTOM TABS </li></ul>
  39. 39. Choose Page <ul><li>CUSTOM TABS </li></ul>
  40. 40. Edit App <ul><li>Edit Page </li></ul><ul><li>CUSTOM TABS </li></ul>
  41. 41. Insert HTML / FBML <ul><li>CUSTOM TABS </li></ul><ul><li>Dos: </li></ul><ul><li>HTML </li></ul><ul><li>HTML forms </li></ul><ul><li>Internal CSS </li></ul><ul><li>outgoing links </li></ul><ul><li>external images </li></ul><ul><li>Don‘ts: </li></ul><ul><li>external Javascript </li></ul><ul><li>external CSS </li></ul>
  42. 42. Option: Add another FBML Box <ul><li>CUSTOM TABS </li></ul>
  43. 43. Edit App Settings <ul><li>CUSTOM TABS </li></ul>
  44. 44. Add App to Tabs / Boxes <ul><li>CUSTOM TABS </li></ul>
  45. 45. Arrange Tabs: Drag & Drop <ul><li>CUSTOM TABS </li></ul>
  46. 46. Move App from Boxes to Wall Tab <ul><li>CUSTOM TABS </li></ul>
  47. 47. Wall Tab: Result <ul><li>CUSTOM TABS </li></ul>Image width: 200 Pixel
  48. 48. VIDEO APP <ul><li>Uploading Videos, </li></ul><ul><li>Recording with your Webcam </li></ul>
  49. 49. App: Video  Add to Page <ul><li>http://www.facebook.com/apps/application.php?id=2392950137 </li></ul><ul><li>VIDEO APP </li></ul>
  50. 50. Choose Page  Add to Page <ul><li>VIDEO APP </li></ul>
  51. 51. Edit Page Settings  Video Edit <ul><li>VIDEO APP </li></ul>
  52. 52. Add Videos <ul><li>VIDEO APP </li></ul>
  53. 53. Select file on your Computer <ul><li>VIDEO APP </li></ul>
  54. 54. Agree to Terms of Service <ul><li>VIDEO APP </li></ul>
  55. 55. Upload Video & Enter Info <ul><li>VIDEO APP </li></ul>
  56. 56. Save Info <ul><li>VIDEO APP </li></ul>
  57. 57. Video Processing <ul><li>VIDEO APP </li></ul>
  58. 58. Result: Video <ul><li>VIDEO APP </li></ul>
  59. 59. Result: Video <ul><li>VIDEO APP </li></ul>
  60. 60. Result: Video <ul><li>VIDEO APP </li></ul>
  61. 61. Record Video from Webcam <ul><li>VIDEO APP: WEBCAM </li></ul>
  62. 62. Settings Adobe Flash Player <ul><li>VIDEO APP: WEBCAM </li></ul>
  63. 63. Close <ul><li>VIDEO APP: WEBCAM </li></ul>
  64. 64. Record Video <ul><li>VIDEO APP: WEBCAM </li></ul>
  65. 65. Record Video & Stop <ul><li>VIDEO APP: WEBCAM </li></ul>
  66. 66. Save Video <ul><li>VIDEO APP: WEBCAM </li></ul>
  67. 67. Save Video <ul><li>VIDEO APP: WEBCAM </li></ul>
  68. 68. Enter Info & Save <ul><li>VIDEO APP: WEBCAM </li></ul>
  69. 69. Result: Webcam Video <ul><li>VIDEO APP: WEBCAM </li></ul>
  70. 70. YOUTUBE PLAYER <ul><li>Adding a Video Playlist of Youtube Videos </li></ul>
  71. 71. App: Youtube Player <ul><li>http://www.facebook.com/apps/application.php?id=6916954478 </li></ul><ul><li>YOUTUBE PLAYER </li></ul>
  72. 72. Add App to your Page <ul><li>YOUTUBE PLAYER </li></ul>
  73. 73. Edit Page  Edit <ul><li>YOUTUBE PLAYER </li></ul>
  74. 74. Allow Access <ul><li>YOUTUBE PLAYER </li></ul>
  75. 75. Add Videos <ul><li>YOUTUBE PLAYER </li></ul>
  76. 76. Enter Videos & Save <ul><li>YOUTUBE PLAYER </li></ul>
  77. 77. Edit Page  Application Settings <ul><li>YOUTUBE PLAYER </li></ul>
  78. 78. Add Videos to Tabs <ul><li>YOUTUBE PLAYER </li></ul>
  79. 79. Result  Arrange Tab <ul><li>YOUTUBE PLAYER </li></ul>
  80. 80. Result: Youtube Player <ul><li>YOUTUBE PLAYER </li></ul>
  81. 81. YOUTUBE VIDEO BOX <ul><li>Adding Youtube Videos </li></ul>
  82. 82. Add App to Page <ul><li>http://www.facebook.com/apps/application.php?id=3801015922 </li></ul><ul><li>YOUTUBE VIDEO BOX </li></ul>
  83. 83. Select Page <ul><li>YOUTUBE VIDEO BOX </li></ul>
  84. 84. Edit Page  Edit Settings <ul><li>YOUTUBE VIDEO BOX </li></ul>
  85. 85. Add Videos from Youtube <ul><li>YOUTUBE VIDEO BOX </li></ul>
  86. 86. Add Youtube URL <ul><li>YOUTUBE VIDEO BOX </li></ul>
  87. 87. Edit Details & Save Video <ul><li>YOUTUBE VIDEO BOX </li></ul>
  88. 88. Back to Page Videos <ul><li>YOUTUBE VIDEO BOX </li></ul>
  89. 89. Add another Video <ul><li>YOUTUBE VIDEO BOX </li></ul>
  90. 90. Save URL <ul><li>YOUTUBE VIDEO BOX </li></ul>
  91. 91. Edit Details & Save <ul><li>YOUTUBE VIDEO BOX </li></ul>
  92. 92. Back to Page Videos <ul><li>YOUTUBE VIDEO BOX </li></ul>
  93. 93. Page Videos <ul><li>YOUTUBE VIDEO BOX </li></ul>
  94. 94. Edit Application Settings <ul><li>YOUTUBE VIDEO BOX </li></ul>
  95. 95. Add App to Tab <ul><li>YOUTUBE VIDEO BOX </li></ul>
  96. 96. Save Settings <ul><li>YOUTUBE VIDEO BOX </li></ul>
  97. 97. Arrange Tabs <ul><li>YOUTUBE VIDEO BOX </li></ul>
  98. 98. Result Youtube Video Box <ul><li>YOUTUBE VIDEO BOX </li></ul>
  99. 99. TWITTER FOR PAGES <ul><li>Integrating your Tweets </li></ul>
  100. 100. Choose Page <ul><li>http://www.facebook.com/add.php?api_key=6f77619e603ca9b71b45f5cd105be888&pages </li></ul><ul><li>TWITTER FOR PAGES </li></ul>
  101. 101. Add App Twitter for Pages <ul><li>TWITTER FOR PAGES </li></ul>
  102. 102. Enter Details & Select User <ul><li>TWITTER FOR PAGES </li></ul>
  103. 103. Continue <ul><li>TWITTER FOR PAGES </li></ul>
  104. 104. Edit Page  App. Settings <ul><li>TWITTER FOR PAGES </li></ul>
  105. 105. Add Tab <ul><li>TWITTER FOR PAGES </li></ul>
  106. 106. Add Tab & Save <ul><li>TWITTER FOR PAGES </li></ul>
  107. 107. Arrange Tabs  Drag & Drop <ul><li>TWITTER FOR PAGES </li></ul>
  108. 108. Result: Twitter for Pages <ul><li>TWITTER FOR PAGES </li></ul>
  109. 109. RSS / BLOG <ul><li>Integrating a Blog </li></ul>
  110. 110. App Social RSS: Add to my Page <ul><li>http://www.facebook.com/apps/application.php?id=23798139265 </li></ul><ul><li>RSS / BLOG </li></ul>
  111. 111. Add App to Page <ul><li>RSS / BLOG </li></ul>
  112. 112. Edit Page  Edit Social RSS <ul><li>RSS / BLOG </li></ul>
  113. 113. Add RSS Feed <ul><li>RSS / BLOG </li></ul>
  114. 114. Updating… <ul><li>RSS / BLOG </li></ul>
  115. 115. Feeds Updated <ul><li>RSS / BLOG </li></ul>
  116. 116. Add Tab: Application Settings <ul><li>RSS / BLOG </li></ul>
  117. 117. Add Tab <ul><li>RSS / BLOG </li></ul>
  118. 118. Add Tab & Save <ul><li>RSS / BLOG </li></ul>
  119. 119. Result: Blogpostings in Tab <ul><li>RSS / BLOG </li></ul>
  120. 120. CREATING A SIMPLE APP <ul><li>Content from a Website on Facebook </li></ul>
  121. 121. Creating Content: PHP Code <ul><li>Example: Including Twitter via RSS </li></ul><ul><li>Upload PHP-File to a Server </li></ul><ul><li>CREATING A SIMPLE APP </li></ul><style type=&quot;text/css&quot;> p { font-family: Arial, Helvetica, sans-serif; font-size:10px; } a { color:#990000; } </style> <?php # Script: XML-Reader # Copyright: y0y.de, erweitert: bueltge.de $url = &quot;http://twitter.com/statuses/user_timeline/957101.rss&quot;; $number = 7; $file_content = @file_get_contents($url); $items = preg_match_all(&quot;/<item[ ]?.*>(.*)</item>/Uis&quot;, $file_content, $array_items); $array_items = $array_items[1]; if(!empty($array_items)) { if ($number>sizeof($array_items)) $number=sizeof($array_items); echo &quot;<p>&quot;; for($n=0;$n<$number;$n++) { preg_match(&quot;/<link>(.*)</link>/Uis&quot;, $array_items[$n], $array_link); preg_match(&quot;/<title>(.*)</title>/Uis&quot;, $array_items[$n], $array_title); preg_match(&quot;/<pubDate>(.*)</pubDate>/Uis&quot;, $array_items[$n], $array_pubdate); $suchmuster = &quot;/<description><![CDATA[(.*)]]gt;</description>/Uis&quot;; preg_match($suchmuster, $array_items[$n], $array_description); echo &quot;<b>$array_title[1]</b><br>&quot;; echo &quot;$array_description[1] &quot;; echo &quot;<a href=&quot;$array_link[1]&quot; target=&quot;_blank&quot;>more</a>&quot;; echo &quot;<br><br>&quot;; } echo &quot;</ul></p>&quot;; } ?>
  122. 122. PHP File in Browser <ul><li>CREATING A SIMPLE APP </li></ul>
  123. 123. Set Up New Application <ul><li>http://www.facebook.com/developers/ </li></ul><ul><li>CREATING A SIMPLE APP </li></ul>
  124. 124. Choose Application Name <ul><li>http://www.facebook.com/developers/createapp.php </li></ul><ul><li>CREATING A SIMPLE APP </li></ul>
  125. 125. Basic Settings <ul><li>CREATING A SIMPLE APP </li></ul>
  126. 126. Authentication: Enable Installable Facebook Pages <ul><li>CREATING A SIMPLE APP </li></ul>
  127. 127. Canvas: Add Canvas Page URL <ul><li>CREATING A SIMPLE APP </li></ul>
  128. 128. Result & Edit Settings <ul><li>CREATING A SIMPLE APP </li></ul>
  129. 129. Add Tab Information <ul><li>CREATING A SIMPLE APP </li></ul>Tab URL is required for adding app as a tab. Tab URL is relative to Canvas Callback URL Canvas Callback URL + Tab URL http://olafnitz.net + twitter = http://olafnitz.net/twitter
  130. 130. Go to App Profile <ul><li>CREATING A SIMPLE APP </li></ul>
  131. 131. Add App to Page <ul><li>CREATING A SIMPLE APP </li></ul>
  132. 132. Add App to Page <ul><li>CREATING A SIMPLE APP </li></ul>
  133. 133. Edit Page: Application Settings <ul><li>CREATING A SIMPLE APP </li></ul>
  134. 134. Add App to Tab (1) <ul><li>CREATING A SIMPLE APP </li></ul>
  135. 135. Add App to Tab (2) <ul><li>CREATING A SIMPLE APP </li></ul>
  136. 136. Result: External Content <ul><li>CREATING A SIMPLE APP </li></ul>
  137. 137. POLLS
  138. 138. Application Poll <ul><li>http://www.facebook.com/apps/application.php?id=20678178440 </li></ul>
  139. 139. Add App to Page
  140. 140. Create Poll
  141. 141. Enter Questions & Options
  142. 142. Publish Poll
  143. 143. Result: Poll on the Wall
  144. 144. Poll in „Boxes“
  145. 145. Poll in the Wall Tab
  146. 146. Result: Poll
  147. 147. LANDINGTAB <ul><li>Seding the user to a specific tab </li></ul>
  148. 148. Edit Page  Wall Settings <ul><li>LANDINGTAB </li></ul>
  149. 149. Select Default Tab for Non-Fans <ul><li>LANDINGTAB </li></ul>Fans will be sent to the wall by default. This setting only applies to non-fans.
  150. 150. Select Tab <ul><li>LANDINGTAB </li></ul>
  151. 151. ABOUT & CONTACT <ul><li>Final Things </li></ul>
  152. 152. About this Document <ul><li>This document was created by Olaf Nitz and is published under a Creative Commons License. </li></ul><ul><li>You are free to copy, distribute, display, and perform this guide and to make derivative works under the following conditions: Attribution - you must give the original author credit and link to http://olafnitz.net. If you alter, transform, or build upon this work, you may distribute the resulting work only under a licence identical to this one. </li></ul><ul><li>About the author: Olaf Nitz has been working in the field of e-business since 2000 as Developer, Online-Marketer, PR-Consultant, Internet Strategist, Blogger & Lecturer. Currently he is working as an Internet Strategist for the Austrian National Tourist Office in Vienna and as a Lecturer on Online-PR at the University of Applied Sciences in St.Pölten in Austria. </li></ul><ul><li>Facebook Bookmarks: http://delicious.com/onitz/facebook </li></ul>
  153. 153. Any Questions? <ul><li>Olaf Nitz </li></ul><ul><li>Web & Blog: http://olafnitz.net </li></ul><ul><li>Email: mail (at) olafnitz.net </li></ul><ul><li>Skype: onitz1605 </li></ul><ul><li>Facebook: http://www.facebook.com/onitz </li></ul><ul><li>LinkedIn: http://www.linkedin.com/in/onitz </li></ul><ul><li>Twitter: http://twitter.com/onitz </li></ul><ul><li>Delicious: http://delicious.com/onitz </li></ul><ul><li>If you want to have a PDF version of this guide, send me an email! </li></ul>

×