904601 - Add social sharing links to event detail pages

Status: VERIFIED FIXED

(Mozilla Reps Graveyard :: reps.mozilla.org, task)

Description

[Justin Crawford [:hoosteeno] [:jcrawford]]

Attachment: remo_share_suggested_implementation.jpg

To make events easier to share, let's add sharing buttons to the event detail page (ex: https://reps.mozilla.org/e/basej-js-introduction-to-firefox-os/).

Let's use direct links to external networks, rather than embedded js/iframes:

    Facebook: https://www.facebook.com/sharer/sharer.php?u=REMO_URL

    Twitter: http://twitter.com/share?url=REMO_URL&via=mozillareps&text=PAGE_TITLE

    Google+: https://plus.google.com/share?url=REMO_URL&hl=en-US

A rough proposed UI is attached. Please suggest alternatives if this is not the right UI. Please modify as needed to satisfy implementation constraints.

Comment 1

[Alex Gibson [:agibson]]

For privacy reasons, should we be using Mozilla's SocialShare widget for this feature?

https://github.com/mozilla/socialshare

Comment 2

[Justin Crawford [:hoosteeno] [:jcrawford]]

The socialshare widget prevents leaking personal details from Mozilla web properties without user consent. So do the links suggested above -- they're just URLs on the page.

Comment 3

[Alex Gibson [:agibson]]

Ah sorry, my eyes missed the part that mentioned using direct links the first time I read it :)

Comment 4

[Justin Crawford [:hoosteeno] [:jcrawford]]

Note about implementation: I didn't intend the attached mockup to be replicated in pixel perfection. The icons could be better, for example. I believe we can use any FOSS social icon set that we like. I think the ones on Flicks look pretty good; if there are no objections, I suggest we just use these: 

https://firefoxflicks.mozilla.org/static/img/social-icons.png

:agibson, is this enough to get started, or would you like a mockup that includes all of these elements?

Comment 5

[William Reynolds [:williamr]]

(In reply to Justin Crawford [:hoosteeno] from comment #4)
> Note about implementation: I didn't intend the attached mockup to be
> replicated in pixel perfection. The icons could be better, for example. I
> believe we can use any FOSS social icon set that we like. I think the ones
> on Flicks look pretty good; if there are no objections, I suggest we just
> use these: 
> 
> https://firefoxflicks.mozilla.org/static/img/social-icons.png

I also like these icons for Facebook and Twitter, though we also need a Google+ icon. I'm also happy using the logo icons mocked up in comment 0. I don't have a strong preference between the two styles.

Comment 6

[Alex Gibson [:agibson]]

(In reply to Justin Crawford [:hoosteeno] from comment #4)
> :agibson, is this enough to get started, or would you like a mockup that
> includes all of these elements?

Thanks Justin, 

This should be enough to get started. I'll see if I can source where these icons came from originally. If they're from an open source set, there may well already be a Google+ icon. If not, I'll look to make one that matches.

Comment 7

[Alex Gibson [:agibson]]

PR here:

https://github.com/mozilla/remo/pull/456

Comment 8

[[github robot]]

Commits pushed to master at https://github.com/mozilla/remo

https://github.com/mozilla/remo/commit/34016d32e24b263f1d0d97a78acdc9ac17db2e80
[fix bug 904601] Add social sharing links to event detail pages

https://github.com/mozilla/remo/commit/e008d4e8d4a34c264c162b4edffdf701c42c6ed3
Merge pull request #456 from alexgibson/bug-904601-add-social-sharing-links-event-detail-pages

[fix bug 904601] Add social sharing links to event detail pages

Comment 9

[Rebecca Billings [:rbillings]]

Verified on dev able to share events on Google+ & Twitter. Unable to share on Facebook, filed bug 907231

Comment 11

[Giorgos Logiotatidis [:giorgos]]

Closing as 'Verified fixed' as per comment 9. Facebook to be verified in bug 907231.

Thanks Rebecca!