Social Buttons
This gem is a Rails 3+ engine (but can be used without the engine).
Currently there is support for the following social buttons:
- Twitter tweet button
- Facebook like button
- Pinterest pinit button
- Google+ +1 button
Installation
Add the gem to your Gemfile and use Bundler to install the gem.
gem "social-buttons", '~> 0.3'
Usage
This gem is a Rails 3+ compatible engine and now automatically includes all the view helper modules into ActionView::Base
This gem includes the following view helper modules in social_buttons/view_helpers
:
Tweet
Like
Pinit
GooglePlus
Using SocialButtons is as simple as adding a single method call to your views:
ERB example:
<%= tweet_button %>
<%= like_button(app_id) %>
<%= pinit_button %>
<%= google_plus_button %>
HAML example:
= tweet_button
= like_button(app_id)
= pinit_button
= google_plus_button
Bam. Done. You'll have a sweet lookin' Social Buttons all up in your view.
Of course, you can customize it. Depending on the type of button, there are different options.
Tweet Button
-
:url
- The URL to share; the default is the current URL. -
:text
- The text that will appear in the tweet; the default is "Check this out!" -
:via
- The attribution. Defaults to "tweetbutton", but you should change that. -
:lang
- Set the language for the tweet (no default). -
:related
- Related Twitter accounts (no default). -
:count
- The tweet count box position (values can be "none", "horizontal", or "vertical"; default is "vertical").
More information can be found from Twitter
So, if you wanted to tweet about Hacker News, attribute it to Peter Cooper, and add some custom text, all from a tweet button with a horizontal counter, you'd do this:
<%= tweet_button(via: "peterc", url: "http://news.ycombinator.com", text: "AWESOME.") %>
Like Button
NOTE: Facebook App Id is mandatory
-
:href
- The URL to like, the default is the current URL. -
:send
- Whether to add a send button or not. -
:layout
- Size and amount of social context next to button. Has 3 options:standard
,:button_count
, and:box_count
-
:width
- Width of the button -
"show-faces"
- Show profile photos -
:action
- Action name like 'like' or 'recommend' -
:font
- Font for the button -
:colorscheme
- Current colorscheme
More information can be found from Facebook
So, a simple like button can be added like this:
<%= like_button(app_id) %>
Pinit Button
-
:url
- The URL to share; the default is the current URL. -
:media
- The image to be shared. -
:description
- Description for the link. -
"count-layout"
- Specify pinit count. It can behorizontal
,vertical
ornone
.
More information can be found from Pinterest
So, a simple pinit button can be added like this:
<%= pinit_button(url: request.url, media: @picture.image.url, description: "Amazing Picture") %>
Vkontakte like button
Before using you should include in the head:
<script src="http://vkontakte.ru/js/api/openapi.js" type="text/javascript" charset="windows-1251"></script>
-
:appId
- AppIp of your application or site -
:type
- full, button, mini, vertical, vertical by default -
:width
- only if full. Should be > 200 -
:height
- only 18, 20, 22, 24 -
:verb
- 0 or 1
See Vk like for more info
Google Plus Button
-
:href
- The URL to share; the default is the current URL. -
:size
- Size of button: 'small', 'tall' or 'medium' -
:annotation
- The style of button: 'inline', 'bubble', 'none' -
:lang
- The locale, fx 'es' for Spanish (alias :locale)
See Google+ button for more info.
Setting universal defaults
You can set a new default for any option in your social_buttons.rb
initializer (in config/initializers
.
Set the default_options
on any of the social view helper modules.
For example:
# config/initializers/social_buttons.rb
SocialButtons::Tweet.default_options = {:via => "myself"}
Or even sweeter...
# config/initializers/social_buttons.rb
SocialButtons.config :tweet do |tweet|
tweet.default_options = {:via => "myself"}
end
# or
SocialButtons.config(:tweet).default_options = {:via => "myself"}
Or simply :)
# config/initializers/social_buttons.rb
SocialButtons.config do |social|
social.tweet do |tweet|
tweet.default_options = {:via => "myself"}
end
social.like.default_options = {:via => "myself"}
end
end
This little DSL makes the configuration more extensible for the future ;)
Only the options you specify will be overridden; so if you only specify a new default :via
, then the other defaults will stay intact.
Help
We have started adding suport for help directly in the api:
puts SocialButtons.config(:google_plus).help
Should output some help info on how to use that particular method, options available etc. So far only works for Google+ button.
TODO
- Improve specs
- Add more options to customize buttons (fx localization on all if available)
- Add even more social buttons...
Note on Patches/Pull Requests
- Fork the project.
- Make your feature addition or bug fix.
- Add tests for it. This is important so I don't break it in a future version unintentionally.
- Commit, do not mess with rakefile, version, or history. (if you want to have your own version, that is fine but bump version in a commit by itself I can ignore when I pull)
- Send me a pull request. Bonus points for topic branches.
Copyright
Copyright (c) 2012 Kristian Mandrup & Yuva Kumar Copyright (c) 2010 Jeremy McAnally.
See LICENSE for details.