facebook-social_plugins 0.1.0
Sign up to get free protection for your applications and to get access to all the features.
- data/.document +5 -0
- data/.rspec +1 -0
- data/AddToTimeline.txt +49 -0
- data/Gemfile +15 -0
- data/Gemfile.lock +121 -0
- data/LICENSE.txt +20 -0
- data/README.rdoc +277 -0
- data/Rakefile +49 -0
- data/VERSION +1 -0
- data/facebook-social_plugins.gemspec +93 -0
- data/lib/facebook-social_plugins.rb +22 -0
- data/lib/facebook-social_plugins/activity_feed.rb +35 -0
- data/lib/facebook-social_plugins/add_to_timeline.rb +18 -0
- data/lib/facebook-social_plugins/button.rb +18 -0
- data/lib/facebook-social_plugins/comments.rb +20 -0
- data/lib/facebook-social_plugins/facepile.rb +37 -0
- data/lib/facebook-social_plugins/like_box.rb +28 -0
- data/lib/facebook-social_plugins/like_button.rb +51 -0
- data/lib/facebook-social_plugins/live_stream.rb +21 -0
- data/lib/facebook-social_plugins/login_button.rb +26 -0
- data/lib/facebook-social_plugins/rails/engine.rb +10 -0
- data/lib/facebook-social_plugins/recommendations_box.rb +41 -0
- data/lib/facebook-social_plugins/registration.rb +52 -0
- data/lib/facebook-social_plugins/script_helper.rb +48 -0
- data/lib/facebook-social_plugins/send_button.rb +24 -0
- data/lib/facebook-social_plugins/social_plugin.rb +84 -0
- data/lib/facebook-social_plugins/subscribe_button.rb +27 -0
- data/lib/facebook-social_plugins/ui_helper.rb +10 -0
- data/lib/facebook-social_plugins/view_helper.rb +56 -0
- data/spec/facebook-social_plugins/script_helper_spec.rb +55 -0
- data/spec/facebook-social_plugins/view_helper_spec.rb +113 -0
- data/spec/spec_helper.rb +47 -0
- data/vendor/assets/html/facebook_channel.html +1 -0
- metadata +211 -0
data/.document
ADDED
data/.rspec
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
--color
|
data/AddToTimeline.txt
ADDED
@@ -0,0 +1,49 @@
|
|
1
|
+
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">
|
2
|
+
|
3
|
+
<head prefix="og: http://ogp.me/ns# og_recipebox: http://ogp.me/ns/apps/YOUR_NAMESPACEx#">
|
4
|
+
<meta property="fb:app_id" content="YOUR_APP_ID" />
|
5
|
+
<meta property="og:type" content="YOUR_NAMESPACE:recipe" />
|
6
|
+
<meta property="og:title" content="Oreo Stuffed Cookies" />
|
7
|
+
<meta property="og:image" content="http://YOUR_URL/cookie.jpg" />
|
8
|
+
<meta property="og:description" content="The Turducken of Cookies" />
|
9
|
+
<meta property="og:url" content="http://YOUR_URL/cookie.html">
|
10
|
+
|
11
|
+
<script type="text/javascript">
|
12
|
+
function postCook()
|
13
|
+
{
|
14
|
+
FB.api('/me/YOUR_NAMESPACE:cook&recipe=http://YOUR_URL/cookie.html','post', function(response) {
|
15
|
+
if (!response || response.error) {
|
16
|
+
alert('Error occured');
|
17
|
+
} else {
|
18
|
+
alert('Post was successful! Action ID: ' + response.id);
|
19
|
+
}
|
20
|
+
});
|
21
|
+
}
|
22
|
+
</script>
|
23
|
+
</head>
|
24
|
+
|
25
|
+
<body>
|
26
|
+
<div id="fb-root"></div>
|
27
|
+
<script src="http://connect.facebook.net/en_US/all.js"></script>
|
28
|
+
<script>
|
29
|
+
FB.init({
|
30
|
+
appId:'YOUR_APP_ID', cookie:true,
|
31
|
+
status:true, xfbml:true, oauth:true
|
32
|
+
});
|
33
|
+
</script>
|
34
|
+
<fb:add-to-timeline></fb:add-to-timeline>>
|
35
|
+
<h3>
|
36
|
+
<font size="30" face="verdana" color="grey">Stuffed Cookies
|
37
|
+
</font>
|
38
|
+
</h3>
|
39
|
+
<p>
|
40
|
+
<img title="Oreo Stuffed Cookies" src="http://YOUR_URL/cookie.jpg" width="550"/><br />
|
41
|
+
</p>
|
42
|
+
|
43
|
+
<form>
|
44
|
+
<input type="button" value="Cook" onclick="postCook()" />
|
45
|
+
</form>
|
46
|
+
|
47
|
+
<fb:activity actions="YOUR_NAMESPACE:cook"></fb:activity>
|
48
|
+
</body>
|
49
|
+
</html>
|
data/Gemfile
ADDED
@@ -0,0 +1,15 @@
|
|
1
|
+
source :rubygems
|
2
|
+
|
3
|
+
# Add dependencies to develop your gem here.
|
4
|
+
# Include everything needed to run rake, tests, features, etc.
|
5
|
+
group :development do
|
6
|
+
gem "rails", ">= 3"
|
7
|
+
gem "rspec", ">= 2"
|
8
|
+
gem "rspec-rails", ">= 2.5"
|
9
|
+
gem "shoulda", ">= 0"
|
10
|
+
|
11
|
+
gem "rdoc", ">= 3.12"
|
12
|
+
gem "bundler", ">= 1.1.0"
|
13
|
+
gem "jeweler", ">= 1.8.3"
|
14
|
+
gem "simplecov", ">= 0"
|
15
|
+
end
|
data/Gemfile.lock
ADDED
@@ -0,0 +1,121 @@
|
|
1
|
+
GEM
|
2
|
+
remote: http://rubygems.org/
|
3
|
+
specs:
|
4
|
+
actionmailer (3.2.3)
|
5
|
+
actionpack (= 3.2.3)
|
6
|
+
mail (~> 2.4.4)
|
7
|
+
actionpack (3.2.3)
|
8
|
+
activemodel (= 3.2.3)
|
9
|
+
activesupport (= 3.2.3)
|
10
|
+
builder (~> 3.0.0)
|
11
|
+
erubis (~> 2.7.0)
|
12
|
+
journey (~> 1.0.1)
|
13
|
+
rack (~> 1.4.0)
|
14
|
+
rack-cache (~> 1.2)
|
15
|
+
rack-test (~> 0.6.1)
|
16
|
+
sprockets (~> 2.1.2)
|
17
|
+
activemodel (3.2.3)
|
18
|
+
activesupport (= 3.2.3)
|
19
|
+
builder (~> 3.0.0)
|
20
|
+
activerecord (3.2.3)
|
21
|
+
activemodel (= 3.2.3)
|
22
|
+
activesupport (= 3.2.3)
|
23
|
+
arel (~> 3.0.2)
|
24
|
+
tzinfo (~> 0.3.29)
|
25
|
+
activeresource (3.2.3)
|
26
|
+
activemodel (= 3.2.3)
|
27
|
+
activesupport (= 3.2.3)
|
28
|
+
activesupport (3.2.3)
|
29
|
+
i18n (~> 0.6)
|
30
|
+
multi_json (~> 1.0)
|
31
|
+
arel (3.0.2)
|
32
|
+
builder (3.0.0)
|
33
|
+
diff-lcs (1.1.3)
|
34
|
+
erubis (2.7.0)
|
35
|
+
git (1.2.5)
|
36
|
+
hike (1.2.1)
|
37
|
+
i18n (0.6.0)
|
38
|
+
jeweler (1.8.3)
|
39
|
+
bundler (~> 1.0)
|
40
|
+
git (>= 1.2.5)
|
41
|
+
rake
|
42
|
+
rdoc
|
43
|
+
journey (1.0.3)
|
44
|
+
json (1.6.6)
|
45
|
+
mail (2.4.4)
|
46
|
+
i18n (>= 0.4.0)
|
47
|
+
mime-types (~> 1.16)
|
48
|
+
treetop (~> 1.4.8)
|
49
|
+
mime-types (1.18)
|
50
|
+
multi_json (1.2.0)
|
51
|
+
polyglot (0.3.3)
|
52
|
+
rack (1.4.1)
|
53
|
+
rack-cache (1.2)
|
54
|
+
rack (>= 0.4)
|
55
|
+
rack-ssl (1.3.2)
|
56
|
+
rack
|
57
|
+
rack-test (0.6.1)
|
58
|
+
rack (>= 1.0)
|
59
|
+
rails (3.2.3)
|
60
|
+
actionmailer (= 3.2.3)
|
61
|
+
actionpack (= 3.2.3)
|
62
|
+
activerecord (= 3.2.3)
|
63
|
+
activeresource (= 3.2.3)
|
64
|
+
activesupport (= 3.2.3)
|
65
|
+
bundler (~> 1.0)
|
66
|
+
railties (= 3.2.3)
|
67
|
+
railties (3.2.3)
|
68
|
+
actionpack (= 3.2.3)
|
69
|
+
activesupport (= 3.2.3)
|
70
|
+
rack-ssl (~> 1.3.2)
|
71
|
+
rake (>= 0.8.7)
|
72
|
+
rdoc (~> 3.4)
|
73
|
+
thor (~> 0.14.6)
|
74
|
+
rake (0.9.2.2)
|
75
|
+
rdoc (3.12)
|
76
|
+
json (~> 1.4)
|
77
|
+
rspec (2.9.0)
|
78
|
+
rspec-core (~> 2.9.0)
|
79
|
+
rspec-expectations (~> 2.9.0)
|
80
|
+
rspec-mocks (~> 2.9.0)
|
81
|
+
rspec-core (2.9.0)
|
82
|
+
rspec-expectations (2.9.0)
|
83
|
+
diff-lcs (~> 1.1.3)
|
84
|
+
rspec-mocks (2.9.0)
|
85
|
+
rspec-rails (2.9.0)
|
86
|
+
actionpack (>= 3.0)
|
87
|
+
activesupport (>= 3.0)
|
88
|
+
railties (>= 3.0)
|
89
|
+
rspec (~> 2.9.0)
|
90
|
+
shoulda (3.0.1)
|
91
|
+
shoulda-context (~> 1.0.0)
|
92
|
+
shoulda-matchers (~> 1.0.0)
|
93
|
+
shoulda-context (1.0.0)
|
94
|
+
shoulda-matchers (1.0.0)
|
95
|
+
simplecov (0.6.1)
|
96
|
+
multi_json (~> 1.0)
|
97
|
+
simplecov-html (~> 0.5.3)
|
98
|
+
simplecov-html (0.5.3)
|
99
|
+
sprockets (2.1.2)
|
100
|
+
hike (~> 1.2)
|
101
|
+
rack (~> 1.0)
|
102
|
+
tilt (~> 1.1, != 1.3.0)
|
103
|
+
thor (0.14.6)
|
104
|
+
tilt (1.3.3)
|
105
|
+
treetop (1.4.10)
|
106
|
+
polyglot
|
107
|
+
polyglot (>= 0.3.1)
|
108
|
+
tzinfo (0.3.32)
|
109
|
+
|
110
|
+
PLATFORMS
|
111
|
+
ruby
|
112
|
+
|
113
|
+
DEPENDENCIES
|
114
|
+
bundler (>= 1.1.0)
|
115
|
+
jeweler (>= 1.8.3)
|
116
|
+
rails (>= 3)
|
117
|
+
rdoc (>= 3.12)
|
118
|
+
rspec (>= 2)
|
119
|
+
rspec-rails (>= 2.5)
|
120
|
+
shoulda
|
121
|
+
simplecov
|
data/LICENSE.txt
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
Copyright (c) 2012 Kristian Mandrup
|
2
|
+
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
4
|
+
a copy of this software and associated documentation files (the
|
5
|
+
"Software"), to deal in the Software without restriction, including
|
6
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
7
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
8
|
+
permit persons to whom the Software is furnished to do so, subject to
|
9
|
+
the following conditions:
|
10
|
+
|
11
|
+
The above copyright notice and this permission notice shall be
|
12
|
+
included in all copies or substantial portions of the Software.
|
13
|
+
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
15
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
16
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
17
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
18
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
19
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
20
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.rdoc
ADDED
@@ -0,0 +1,277 @@
|
|
1
|
+
= Facebook Social plugins
|
2
|
+
|
3
|
+
The Facebook Social plugins for Rails 3 consist of:
|
4
|
+
|
5
|
+
* ViewHelper
|
6
|
+
* ScriptHelper
|
7
|
+
|
8
|
+
The `ViewHelper` contains methods for inserting the HTML5 <div> elements for Facebook social plugins
|
9
|
+
|
10
|
+
The `ScriptHelper` contains methods for inserting <script> snippets for Facebook integration, such as displaying the Social plugins with the Facebook layout/styling applied etc.
|
11
|
+
|
12
|
+
== Script Helpers
|
13
|
+
|
14
|
+
* async_init_script(app_id, domain, options = {})
|
15
|
+
* facebook_script(locale = :en)
|
16
|
+
|
17
|
+
The async_init_script requires the Facebook app_id, fx '753632322' and the domain name of the app, fx 'www.example.com'. You can also specify the channel file (will default to channel file in vendor/assets of this gem)
|
18
|
+
|
19
|
+
=== Channel File
|
20
|
+
|
21
|
+
The channel file addresses some issues with cross domain communication in certain browsers. The contents of the channel.html file can be just a single line:
|
22
|
+
|
23
|
+
<script src="//connect.facebook.net/en_US/all.js"></script>
|
24
|
+
|
25
|
+
=== JavaScript SDK
|
26
|
+
|
27
|
+
The JavaScript SDK provides a rich set of client-side functionality for accessing Facebook's server-side API calls. These include all of the features of the REST API, Graph API, and Dialogs. Further, it provides a mechanism for rendering of the XFBML versions of our Social Plugins, and a way for Canvas pages to communicate with Facebook.
|
28
|
+
|
29
|
+
You will need an app ID to initialize the SDK, which you can obtain from the Developer App.
|
30
|
+
|
31
|
+
For example usage, check out Facebook for Websites and the Authentication guide. We also have a JavaScript Test Console which allows you to test and debug common JavaScript SDK methods.
|
32
|
+
|
33
|
+
The JavaScript SDK supports OAuth 2.0.
|
34
|
+
|
35
|
+
*Loading*
|
36
|
+
|
37
|
+
The following code will load and initialize the JavaScript SDK with all common options. Replace YOUR_APP_ID and WWW.YOUR_DOMAIN.COM with the appropriate values. The best place to put this code is right after the opening <body> tag.
|
38
|
+
|
39
|
+
<div id="fb-root"></div>
|
40
|
+
<script>
|
41
|
+
window.fbAsyncInit = function() {
|
42
|
+
FB.init({
|
43
|
+
appId : 'YOUR_APP_ID', // App ID
|
44
|
+
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
|
45
|
+
status : true, // check login status
|
46
|
+
cookie : true, // enable cookies to allow the server to access the session
|
47
|
+
xfbml : true // parse XFBML
|
48
|
+
});
|
49
|
+
|
50
|
+
// Additional initialization code here
|
51
|
+
};
|
52
|
+
|
53
|
+
// Load the SDK Asynchronously
|
54
|
+
(function(d){
|
55
|
+
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
|
56
|
+
if (d.getElementById(id)) {return;}
|
57
|
+
js = d.createElement('script'); js.id = id; js.async = true;
|
58
|
+
js.src = "//connect.facebook.net/en_US/all.js";
|
59
|
+
ref.parentNode.insertBefore(js, ref);
|
60
|
+
}(document));
|
61
|
+
</script>
|
62
|
+
This code loads the SDK asynchronously so it does not block loading other elements of your page.
|
63
|
+
|
64
|
+
*Localization*
|
65
|
+
|
66
|
+
The JavaScript SDK is available in all locales that are supported by Facebook. This list of supported locales is available as an XML file. To change the locale of the SDK to match the locale of your site, change en_US to a supported locale code when loading the SDK. For example, if your site is in Spanish, using the following code to load the SDK will cause all Social Plugins to be rendered in Spanish.
|
67
|
+
|
68
|
+
<script>
|
69
|
+
(function(d){
|
70
|
+
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
|
71
|
+
js = d.createElement('script'); js.id = id; js.async = true;
|
72
|
+
js.src = "//connect.facebook.net/es_LA/all.js";
|
73
|
+
d.getElementsByTagName('head')[0].appendChild(js);
|
74
|
+
}(document));
|
75
|
+
</script>
|
76
|
+
|
77
|
+
== Social plugins
|
78
|
+
|
79
|
+
Currently the following Social plugins are included in this gem
|
80
|
+
|
81
|
+
* Activity Feed
|
82
|
+
* Comments
|
83
|
+
* Facepile
|
84
|
+
* Like Box
|
85
|
+
* Like Button
|
86
|
+
* Live Stream
|
87
|
+
* Login Button
|
88
|
+
* Recommendations Box
|
89
|
+
* Registration
|
90
|
+
* Send Button
|
91
|
+
* Subscribe Button
|
92
|
+
|
93
|
+
View methods exposed:
|
94
|
+
|
95
|
+
* fb_root
|
96
|
+
* fb_activity options = {}
|
97
|
+
* fb_add_to_timeline options = {}
|
98
|
+
* fb_comments options = {}
|
99
|
+
* fb_facepile options = {}
|
100
|
+
* fb_like_box options = {}
|
101
|
+
* fb_like_button options = {}
|
102
|
+
* fb_live_stream options = {}
|
103
|
+
* fb_login_button options = {}
|
104
|
+
* fb_recommendations_box options = {}
|
105
|
+
* fb_registration options = {}
|
106
|
+
* fb_send_button options = {}
|
107
|
+
* fb_subscribe_button options = {}
|
108
|
+
|
109
|
+
=== Activity feed
|
110
|
+
|
111
|
+
<div class="fb-activity" data-width="300" data-height="300" data-header="true" data-recommendations="false"></div>
|
112
|
+
|
113
|
+
* site - the domain for which to show activity; include just the full domain name, without http:// or a path. The XFBML version defaults to the current domain.
|
114
|
+
* action - a comma separated list of actions to show activities for.
|
115
|
+
* app_id - will display all actions, custom and global, associated with this app_id.
|
116
|
+
* width - the width of the plugin in pixels. Default width: 300px.
|
117
|
+
* height - the height of the plugin in pixels. Default height: 300px.
|
118
|
+
* header - specifies whether to show the Facebook header.
|
119
|
+
* colorscheme - the color scheme for the plugin. Options: 'light', 'dark'
|
120
|
+
* font - the font to display in the plugin. Options: 'arial', 'lucida grande', 'segoe ui', 'tahoma', 'trebuchet ms', 'verdana'
|
121
|
+
* border_color - the border color of the plugin.
|
122
|
+
* recommendations - specifies whether to always show recommendations in the plugin.
|
123
|
+
* linktarget - This specifies the context in which content links are opened.
|
124
|
+
* ref - a label for tracking referrals; must be less than 50 characters
|
125
|
+
* max_age - a limit on recommendation and creation time of articles that are surfaced in the plugins, the default is 0 (days)
|
126
|
+
|
127
|
+
=== Comments
|
128
|
+
|
129
|
+
<div class="fb-comments" data-href="http://example.com" data-num-posts="2" data-width="470"></div>
|
130
|
+
|
131
|
+
href - the URL for this Comments plugin. News feed stories on Facebook will link to this URL.
|
132
|
+
width - the width of the plugin in pixels. Minimum recommended width: 400px.
|
133
|
+
colorscheme - the color scheme for the plugin. Options: 'light', 'dark'
|
134
|
+
num_posts - the number of comments to show by default. Default: 10. Minimum: 1
|
135
|
+
mobile - whether to show the mobile-optimized version. Default: auto-detect.
|
136
|
+
|
137
|
+
=== Like box
|
138
|
+
|
139
|
+
<div class="fb-like" data-send="true" data-width="450" data-show-faces="true"></div>
|
140
|
+
|
141
|
+
* href - the URL to like. The XFBML version defaults to the current page.
|
142
|
+
* send - specifies whether to include a Send button with the Like button.
|
143
|
+
* layout - there are three options (standard, button_count, box_count)
|
144
|
+
* show_faces - specifies whether to display profile photos below the button (standard layout only)
|
145
|
+
* width - the width of the Like button.
|
146
|
+
* action - the verb to display on the button. Options: 'like', 'recommend'
|
147
|
+
* font - the font to display in the button. Options: 'arial', 'lucida grande', 'segoe ui', 'tahoma', 'trebuchet ms', 'verdana'
|
148
|
+
* colorscheme - the color scheme for the like button. Options: 'light', 'dark'
|
149
|
+
* ref - a label for tracking referrals; must be less than 50 characters and can contain alphanumeric characters
|
150
|
+
fb_ref - the ref parameter
|
151
|
+
fb_source - the stream type ('home', 'profile', 'search', 'ticker', 'tickerdialog' or 'other') in which the click occurred and the story type ('oneline' or 'multiline'), concatenated with an underscore.
|
152
|
+
|
153
|
+
=== Live stream
|
154
|
+
|
155
|
+
<div class="fb-live-stream" data-event-app-id="285193711555371" data-width="400" data-height="500" data-always-post-to-friends="true"></div>
|
156
|
+
|
157
|
+
=== Login
|
158
|
+
|
159
|
+
<div class="fb-login-button" data-show-faces="true" data-width="200" data-max-rows="1"></div>
|
160
|
+
|
161
|
+
* show-faces - specifies whether to show faces underneath the Login button.
|
162
|
+
* width - the width of the plugin in pixels. Default width: 200px.
|
163
|
+
* max-rows - the maximum number of rows of profile pictures to display. Default value: 1.
|
164
|
+
* scope - a comma separated list of extended permissions.
|
165
|
+
|
166
|
+
=== Registration
|
167
|
+
|
168
|
+
Async Validation
|
169
|
+
|
170
|
+
If you have to check something on your server (e.g. if a username is taken) then you don't have to reply from the validation function right away. You can return null (which is the default return in javascript) and then use the second parameter to reply with any errors. You have 20 seconds before the form submits anyways.
|
171
|
+
|
172
|
+
<fb:registration redirect-uri="https://developers.facebook.com/tools/echo"
|
173
|
+
fields='[{"name":"name"},
|
174
|
+
{"name":"username","description":"Username","type":"text"}]'
|
175
|
+
onvalidate="validate_async"></fb:registration>
|
176
|
+
|
177
|
+
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
|
178
|
+
<script>
|
179
|
+
function validate_async(form, cb) {
|
180
|
+
$.getJSON('https://graph.facebook.com/' + form.username + '?callback=?',
|
181
|
+
function(response) {
|
182
|
+
if (response.error) {
|
183
|
+
// Username isn't taken, let the form submit
|
184
|
+
cb();
|
185
|
+
}
|
186
|
+
cb({username: 'That username is taken'});
|
187
|
+
});
|
188
|
+
}
|
189
|
+
</script>
|
190
|
+
|
191
|
+
=== Add to Timeline
|
192
|
+
|
193
|
+
<div class="fb-add-to-timeline"></div>
|
194
|
+
|
195
|
+
Add to Timeline lets users create a lasting connection between your app and their Timeline on Facebook. When a user clicks Add to Timeline, your app can publish app specific actions to the user's Timeline. As users engage with your app over time, their actions become more prominently displayed on their Timeline. This can become an important part of how people express themselves on Facebook. The experience for users is seamless and fun and requires little effort for them to personalize their identity.
|
196
|
+
|
197
|
+
Add to Timeline plugin is available through the Javascript SDK via the <fb:add-to-timeline> XFBML tag.
|
198
|
+
|
199
|
+
There are two different display modes for the Add to Timeline: box (default) and button. You can also configure additional extended permissions for the plugin by adding the perms parameter.
|
200
|
+
|
201
|
+
* mode - the display mode - box (default) and button
|
202
|
+
* show_faces - whether to show faces
|
203
|
+
|
204
|
+
|
205
|
+
=== Facepile
|
206
|
+
|
207
|
+
<div class="fb-facepile" data-href="http://developers.facebook.com"
|
208
|
+
data-action="join" data-size="large" data-max-rows="1" data-width="300"
|
209
|
+
data-colorscheme="dark">
|
210
|
+
</div>
|
211
|
+
|
212
|
+
The Facepile plugin displays the Facebook profile pictures of users who have connected with your page via a global or custom action, or can also be configured to display users that have signed up for your site.
|
213
|
+
|
214
|
+
If you want to display users who have connected to your page via an action, specify with the action parameter
|
215
|
+
|
216
|
+
To display users who have liked your page, specify the URL of your page as the href parameter. To display users who have signed up for your site, specify your application id as the app_id parameter.
|
217
|
+
|
218
|
+
* event-app-id - the app id for the event
|
219
|
+
* action - the action to perform, fx 'og_recipebox:planning_to_make'
|
220
|
+
* width - the width of the plugin in pixels. Minimum recommended width: 400px.
|
221
|
+
* href - the referenced page
|
222
|
+
* max_rows - max rows to display, 1-10 normally
|
223
|
+
|
224
|
+
=== Recommendations
|
225
|
+
|
226
|
+
<div class="fb-recommendations" data-width="300" data-height="300" data-header="true"></div>
|
227
|
+
|
228
|
+
* site - the domain to show recommendations for. The XFBML version defaults to the current domain.
|
229
|
+
* action - a comma separated list of actions to show recommendations for.
|
230
|
+
* app_id - will display recommendations for all types of actions, custom and global, associated with this app_id.
|
231
|
+
* width - the width of the plugin in pixels. Default width: 300px.
|
232
|
+
* height - the height of the plugin in pixels. Default height: 300px.
|
233
|
+
* header - specifies whether to show the Facebook header.
|
234
|
+
* colorscheme - the color scheme for the plugin. Options: 'light', 'dark'
|
235
|
+
* font - the font to display in the plugin. Options: 'arial', 'lucida grande', 'segoe ui', 'tahoma', 'trebuchet ms', 'verdana'
|
236
|
+
* border_color - the border color of the plugin.
|
237
|
+
* linktarget - This specifies the context in which content links are opened. By default all links within the plugin will open a new window. se to _top or _parent.
|
238
|
+
* ref - a label for tracking referrals; must be less than 50 characters and can contain alphanumeric characters
|
239
|
+
* max_age - a limit on recommendation and creation time of articles that are surfaced in the plugins, the default is 0 (days)
|
240
|
+
|
241
|
+
=== Send button
|
242
|
+
|
243
|
+
<div class="fb-send" data-href="http://example.com"></div>
|
244
|
+
|
245
|
+
* href - the URL to send.
|
246
|
+
* font - the font to display in the button. Options: 'arial', 'lucida grande', 'segoe ui', 'tahoma', 'trebuchet ms', 'verdana'
|
247
|
+
* colorscheme - the color scheme for the button. Options: 'light', 'dark'
|
248
|
+
* ref - a label for tracking referrals; must be less than 50 characters and can contain alphanumeric characters
|
249
|
+
* fb_ref - the ref parameter
|
250
|
+
* fb_source - the story type ('message', 'group', 'email') in which the click occurred.
|
251
|
+
|
252
|
+
=== Subscribe button
|
253
|
+
|
254
|
+
<div class="fb-subscribe" data-href="https://www.facebook.com/zuck" data-show-faces="true" data-width="450"></div>
|
255
|
+
|
256
|
+
* href - profile URL of the user to subscribe to. This must be a facebook.com profile URL.
|
257
|
+
* layout - there are three options (standard, button_count, box_count).
|
258
|
+
* show_faces - specifies whether to display profile photos below the button (standard layout only)
|
259
|
+
* colorscheme - the color scheme for the plugin. Options: 'light' (default) and 'dark'
|
260
|
+
* font - the font to display in the plugin. Options: 'arial', 'lucida grande', 'segoe ui', 'tahoma', 'trebuchet ms', 'verdana'
|
261
|
+
* width - the width of the plugin.
|
262
|
+
|
263
|
+
== Contributing to facebook-social_plugins
|
264
|
+
|
265
|
+
* Check out the latest master to make sure the feature hasn't been implemented or the bug hasn't been fixed yet.
|
266
|
+
* Check out the issue tracker to make sure someone already hasn't requested it and/or contributed it.
|
267
|
+
* Fork the project.
|
268
|
+
* Start a feature/bugfix branch.
|
269
|
+
* Commit and push until you are happy with your contribution.
|
270
|
+
* Make sure to add tests for it. This is important so I don't break it in a future version unintentionally.
|
271
|
+
* Please try not to mess with the Rakefile, version, or history. If you want to have your own version, or is otherwise necessary, that is fine, but please isolate to its own commit so I can cherry-pick around it.
|
272
|
+
|
273
|
+
== Copyright
|
274
|
+
|
275
|
+
Copyright (c) 2012 Kristian Mandrup. See LICENSE.txt for
|
276
|
+
further details.
|
277
|
+
|