Social Share Component

theme-component
(Daniela) #1

This is a theme component that will allow you to easily add extra social providers to the share button on posts.


Repository Link
https://github.com/discourse/discourse-social-share

Preview: https://theme-creator.discourse.org/theme/Dax/social

Samples

image

Settings:

Some providers & Links:

English Social Media

Tumblr. https://www.tumblr.com/share/link?url=
Pinterest: https://pinterest.com/pin/create/button/?url=
Linkedin: https://www.linkedin.com/shareArticle?mini=true&url=
Reddit: https://reddit.com/submit?url=
AddThis: https://www.addthis.com/bookmark.php?url=
GetPocket: https://getpocket.com/edit?url=
Evernote: https://www.evernote.com/clip.action?url=
HackerNews: https://news.ycombinator.com/submitlink?u=
StumbleUpon https://www.stumbleupon.com/submit?url= Replaced with mix.com
Digg: https://digg.com/submit?url=
FlipBoard: https://share.flipboard.com/bookmarklet/popout?v=2&title=
InstaPaper:https://www.instapaper.com/edit?url= (currently European users can not access because of the GDPR)
Flattr: https://flattr.com/submit/auto?user_id={user_id}&url=
Diaspora: https://share.diasporafoundation.org/?title={title}&url=

Non-English Social Media

QzSahre:http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url= (chinese)
Weibo: http://service.weibo.com/share/share.php?url= (chinese)
Douban: https://www.douban.com/recommend/?url= (chinese)
RenRen: http://widget.renren.com/dialog/share?resourceUrl= (chinese)
Vk: https://vk.com/share.php?url= (russian)
OKru: https://connect.ok.ru/dk?st.cmd=WidgetSharePreview&st.shareUrl= (russian)
Xing: https://www.xing.com/app/user?op=share&url= (german)
SurfingBird: http://surfingbird.ru/share?url=

Phone/Audio-Based Social Media

SMS: sms:{phone_number}?body=
Telegram: https://telegram.me/share/url?url=
LineMe: https://lineit.line.me/share/ui?url=
Skype: https://web.skype.com/share?url=
WhatsApp: https://wa.me/?text=
WhatsApp Web: https://web.whatsapp.com/send?text= (read also Social share component with WhatsApp Web)

This guide is a wiki, if you have other providers, maybe specific for your country, just add them to the list.
You will find the share URL in the documentation for the developers.

44 Likes
How to add whatsapp in the share button list next to facebook
Please adopt my plugins?
Add VK share for topics
How to add buttons will be shared in VK and OK?
LinkedIn Sharing Button Plugin
(Daniela) #2

I added a list of both English and non-English social media and the ability to share a URL via Phone/Audio-Based Social Media

2 Likes
(Brahn) #3

I don’t suppose you can lower the plugin version to 0.8.22 so this can be used with the stable branch of discourse?

(Daniela) #4

Sure, I can do it tomorrow morning (now I’m out) .

PS: Done

2 Likes
#5

Nice, thank you. But only one extra social provider? It would be nice if you can add more than one. :coffee:

(Brahn) #7

Thanks! However, my bad, it looks like addSharingSource was actually the change that bumped the version to 0.8.23 in the first place. You might want to go back to 0.8.23. Looks like I will have to wait until this hits stable. I look forward to trying it out then.

(Brahn) #8

I think you just add the theme component more that once. One for each provider.

1 Like
(Daniela) #9

That’s done
https://github.com/discourse/discourse-social-share/pull/1/commits/caa123ca300f9c7b127762f652f4b12a3bc1ab47

7 Likes
#10

I reinstalled and it seems to be the same. :thinking:

(Frederik) #12

Any live demo site for a preview?

(Daniela) #13

Sorry @elGrande, totally my fault. I thought I had already done the merge before leaving yesterday morning… actually I forgot about it…

Try it now.

Added to the OP :+1:

6 Likes
(Adrianbblk) #14

It’s working. Thanks

1 Like
(Alex) #15

I’m having trouble with the SMS share, it’s not displaying :confused:

(Daniela) #16

Hey @nexo, what icon are you trying to use?
There is no comment-alt icon on Fontawesome 4.7

Fontawesome 5.0 will be implemented in the near future, but until then you will have to use the icons available here Font Awesome Icons, e.g:

image

:wink:

6 Likes
(Martincz Gao) #17

When I installed this component, my website display a blank page.
How to fix it?

_ember_jquery-27e777857b8c0730dacfe09cb11711365d21a5db4f9ee0b85d494e4259cf6cda.js:29446 TypeError: Cannot read property 'toLowerCase' of undefined
    at String.<anonymous> ((index):56)
    at Function.each (_ember_jquery-27e777857b8c0730dacfe09cb11711365d21a5db4f9ee0b85d494e4259cf6cda.js:358)
    at (index):52
    at M (_application-1502287254175e8efd903230435df80a0d47db1a0b2eeee4a0a9a3c6886492ed.js:20014)
    at Object.initialize (_application-1502287254175e8efd903230435df80a0d47db1a0b2eeee4a0a9a3c6886492ed.js:7460)
    at _ember_jquery-27e777857b8c0730dacfe09cb11711365d21a5db4f9ee0b85d494e4259cf6cda.js:16963
    at e.each (_ember_jquery-27e777857b8c0730dacfe09cb11711365d21a5db4f9ee0b85d494e4259cf6cda.js:15063)
    at e.topsort (_ember_jquery-27e777857b8c0730dacfe09cb11711365d21a5db4f9ee0b85d494e4259cf6cda.js:15030)
    at e.topsort (_ember_jquery-27e777857b8c0730dacfe09cb11711365d21a5db4f9ee0b85d494e4259cf6cda.js:14975)
    at s._runInitializer (_ember_jquery-27e777857b8c0730dacfe09cb11711365d21a5db4f9ee0b85d494e4259cf6cda.js:16978)
(Jeff Atwood) #18

Maybe @dax could confim all is good?

(Martincz Gao) #19

I manually deleted the component from the database theme table, website restored now.

2 Likes
(Daniela) #20

I can confirm that this component works correctly at least on latest version of Firefox, Chrome, Edge and IE11 with Win10 and Firefox with Ubuntu 16.04 LTS (it’s a VM so I have only 1 browser)

Not sure if it could be a specific problem related to sites in Chinese.

2 Likes
(Anabel ávila) #21

I tried adding whatsapp but it won’t show the icon. Can anyone share the entire line that needs to be added?

Thanks!

(Daniela) #22

whatsapp,whatsapp,share with whatsapp,https://wa.me/?text=

3 Likes
Social share component with WhatsApp Web