Social Buttons

Open Graph Data

When using these social sharing icons, don't forget to add open graph data to your page. This way if you share on social channels that scrape that content, you will get the benefit of pre-set descriptions, titles, images, etc.

%meta{property: "og:title", content: "Lonely Planet"}
%meta{property: "og:description", content: "The ultimate online destination..."}
%meta{property: "og:image", content: "#{asset_path('header.jpg')}"}

Also, remember you can hide items from the list of buttons by using the hide array.


Twitter looks for a custom tweet property, as it's the only service that limits your characters. Remember, if you're tweeting a link, that twitter will auto-convert any URL to 22 or 23 characters (for http or https). If you add in a space, then you have 117 characters to work with for the message.