The main purpose of this addon to provide possibility to share links with images, title, descriptions etc without meta properties and without server rendering.
WARNING: Facebook has stoped supporting custom share parameters so this addon is pretty useless for FB at this moment. More details here.
ember install ember-social-share
There are two ways to embed share buttons to page. First, you can add share buttons one by one. Example:
{{#fb-share-button}}Share{{/fb-share-button}}
{{#vk-share-button}}Share{{/vk-share-button}}
{{#twitter-share-button}}Tweet{{/twitter-share-button}}
{{#linkedin-share-button}}Share{{/linkedin-share-button}}
{{#gplus-share-button}}Share{{/gplus-share-button}}
Or you can add share buttons like one share panel:
{{share-panel buttons="fb,vk,twitter,linkedin,gplus" labels="Share,Share,Tweet,Share,Share"}}
There are some properties for any of share buttons:
- adaptive - boolean flag for adaptive design (default: true)
There are some properties for share-panel
:
- buttons - comma-separated list of social networks
- labels - comma-separated list of buttons labels
- adaptive - boolean flag for adaptive design (default: true)
At section below you can find share options that can be set for each button or panel.
Option | Description | VKontakte | Google+ | |||
---|---|---|---|---|---|---|
url | page url (by default - current page url) | ✓ | ✓ | ✓ | ✓ | ✓ |
title | share title (tweet message for twitter) | ✓ | ✓ | ✓ | ✓ | ✕ |
text | description | ✓ | ✓ | ✕ | ✓ | ✕ |
image | image url | ✓ | ✓ | ✕ | ✕ | ✕ |
hashtags | comma-separated list of hashtags | ✕ | ✕ | ✓ | ✕ | ✕ |
via | link to twitter account or source | ✕ | ✕ | ✓ | ✓ | ✕ |
{{#fb-share-button url="http://example.com" title="Here is example!" text="Some description..."}}Share{{/fb-share-button}}
{{#vk-share-button title="Some russion title!" text="Another description" image="some image url"}}Share it!{{/vk-share-button}}
{{twitter-share-button title="Look at this!" url="http://example.com" hashtags="example" via="example.com"}}Tweet{{/twitter-share-button}}
{{#linkedin-share-button title="Great artile!" text="Another description" image="some image url"}}Share it!{{/linkedin-share-button}}
{{#gplus-share-button url="http://example.com"}}Share{{/gplus-share-button}}
{{share-panel adaptive=false title="Example title" text="Example text!" image="sorry didnt find any image" hashtags="example"}}