Add Donate Button to top-right, and Social Media Icons

[ryanleesipes]

We should add a donate button to the top right corner and social media buttons to replace the current text list of Mozilla and Thunderbird's in the bottom right. In fact, I don't see why we don't just remove the Mozilla ones for now, it makes it difficult to separate the brand from Mozilla proper, which is a problem currently.

[benbucksch]

+1 for adding "Donate" button on top right +1 for replacing the social media links on bottom with a Thunderbird account, e.g. replacing https://twitter.com/mozilla with https://twitter.com/thunderbird But please do not make them JS buttons, as that will create a ping to the company for every page view.

[Sancus]

I think the donate button suggestion is fine. Will do this week.

I'm also not a fan of the JS social media buttons that automatically associate with and ping your logged in accounts, but simple images I can do. Note that the site already has text links to TB Twitter/FB and we don't have an instagram(afaik).

With respect to removing Mozilla links, we unfortunately still depend on Mozilla legally and organizationally. I'm fine with removing these specific social media links, but CC @kewisch for confirmation that this is okay.

In my opinion, meaningfully separating our brand requires us to have our own organizational and legal apparatus. Separation is limited when we (have to) link directly to the Mozilla site for legal/privacy policies since we do not have our own nor do we even have a legal entity to be responsible for such things.

[kewisch]

I‘ll check with Josh which need to be kept, thanks!

[joshualwolf]

I'll connect with Philipp today.

FYI -- the twitter handle for thunderbird is https://twitter.com/mozthunderbird not /thunderbird

[Sancus]

Yes the existing page https://www.thunderbird.net/ already has the correct Thunderbird Twitter and FB links.

Moz actually being in the twitter name though does make removing Mozilla branding all the more difficult, lol.

[ryanleesipes]

@Sancus unfortunately, it was setup that was beforehand (the Twitter handle). Once my process is a little more mature, I will look at what can be done to rectify that.

[ryanleesipes]

Any movement on this? Need anything from me?

[kewisch]

Sorry for the delay. I discussed this with Josh on Thursday. We are welcome to make changes to the website, but any substantial changes like removing/changing the “about” or “contact us” links, or anything where we as Thunderbird are taking a stance on something that could impact the brand, e.g “Thunderbird is taking on examplemail inc”, needs a quick legal review. Similarly, if we go through the hassle of defining our own privacy policy we should check in with legal, since Thunderbird is still a Mozilla brand and there may be legal implications.

This is not saying we are not allowed to make substantial changes, but we should get sign-off before we do

@joshualwolf does that summarize the outcome correctly?

If you are unsure about any future changes feel free to get in touch with me.

Removing the moz social links and adding the donate button is fine. For the donate button we should make sure to use the utm parameters so we can see how successfull donations from the website were.

[joshualwolf]

This is correct. Thanks, all!

On Sun, Feb 11, 2018 at 7:54 AM, Philipp Kewisch notifications@github.com wrote:

Sorry for the delay. I discussed this with Josh on Thursday. We are welcome to make changes to the website, but any substantial changes like removing/changing the “about” or “contact us” links, or anything where we as Thunderbird are taking a stance on something that could impact the brand, e.g “Thunderbird is taking on examplemail inc”, needs a quick legal review. Similarly, if we go through the hassle of defining our own privacy policy we should check in with legal, since Thunderbird is still a Mozilla brand and there may be legal implications.

This is not saying we are not allowed to make substantial changes, but we should get sign-off before we do

@joshualwolf https://github.com/joshualwolf does that summarize the outcome correctly?

If you are unsure about any future changes feel free to get in touch with me.

Removing the moz social links is fine,

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/thundernest/thunderbird-website/issues/16#issuecomment-364749653, or mute the thread https://github.com/notifications/unsubscribe-auth/AfUn_5mK6IhYMUuL5kbmGcgGBIfFp1Cqks5tTuMdgaJpZM4R0udo .

[Sancus]

@ryanleesipes https://www-stage.thunderbird.net/en-US/

I've removed the mozilla social links, built buttons for Facebook and Twitter(that was kind of pain lol) and pulled the Donate button out of the Thunderbird menu and put it in the top right, bolded.

Let me know if you have any comments.

[kewisch]

I’m not sure where EOYFR2015 comes from but I’m thinking we should change the tag to something else. I would think utm_campaign would either be empty and the other parameters are adapted to make clear it is a website source, or utm_campaign is something generic describing the website landing page. I have no idea what ref does or why we include any of the other parameters. Maybe they are leftovers from some past a-b test?

Also, on mobile, the donate button is hidden in the hamburger menu. Would it make sense to place it prominently on the top right?

[benbucksch]

built buttons for Facebook and Twitter(that was kind of pain lol)

Oh, sorry... There's a good lib that's intended to do just that, doing privacy-conscious twitter and facebook buttons, used by a big German tech site: https://github.com/heiseonline/shariff

[kewisch]

Oh another thing (and Ben’s lib may fix this), can you make sure to check the twitter/facebook brand guidelines to make sure the logo use is correct? I seem to recall that you must not invert the twitter logo color like that

[mkmelin]

Is it just me or is the DONATE not in line with the other items? Maybe it's just because it's bolded... Personally I wouldn't have made it bold :)

[Sancus]

@benbucksch

https://github.com/heiseonline/shariff

Looks interesting but it has a lot of dependencies and now that I've done the CSS I think I'll just stick with them. For twitter it's using intent links as well, so, pretty much the same functionality. If we end up adding a ton more buttons somewhere though that's really good to know about, thanks!

@kewisch

I’m not sure where EOYFR2015 comes from

Pretty sure this was just in the donate link I pasted from mozilla.org at some point. I can change these tags to whatever you want, but I honestly have no idea what any of them refer to or do on the donate site, so you'll have to tell me what values you want.

Also, on mobile, the donate button is hidden in the hamburger menu. Would it make sense to place it prominently on the top right?

Possibly, but lets leave that for another bug, this one is already a bunch of different things.

Oh another thing (and Ben’s lib may fix this), can you make sure to check the twitter/facebook brand guidelines to make sure the logo use is correct? I seem to recall that you must not invert the twitter logo color like that

That was the first thing I checked, part of why it took a while. Inverting the color is fine, that's exactly what the official follow buttons look like. The only difference is they include the word 'Follow' which I left out because we don't have l10n for the word in isolation. I'll add it after we get onto Pontoon, probably, but the logo is within their guidelines.

Same thing with FB, the FB logo comes with the text(in the image.. ugh) "Find us on" and I'll add that when we can l10n and just take "Thunderbird" out.

@mkmelin

Is it just me or is the DONATE not in line with the other items? Maybe it's just because it's bolded... Personally I wouldn't have made it bold :)

It is in line, that font just renders differently when bolded. I can unbold it, but Ryan's original mockup had it in a different color. We don't really have buttons(and I don't want to change the whole menu) so I figured bolding was good for emphasis. If people dislike that, I can easily remove the bold, but we can go back and forth on minor stuff like this a lot with no clear answer.

[mkmelin]

I’m not sure where EOYFR2015 comes from

The meaning is end of the year fund raising 2015. So copied from somewhere, but obviously we should use something else.

[ryanleesipes]

Perhaps we could just use something like TBWebsiteButton or something like that for utm?

[Sancus]

OK so the current utm tags are: &ref=EOYFR2015 &utm_campaign=EOYFR2015 &utm_source=thunderbird.net &utm_medium=referral &utm_content=header

I'm just going to remove the EOYFR2015 stuff, which will leave: &utm_source=thunderbird.net &utm_medium=referral &utm_content=header

I don't know how these utm tags are used on the donate site stats side so I don't want to just change the generic ones arbitrarily... utm_source tells you that it's from the website domain. We aren't running any specific campaign so it makes sense to remove the utm_campaign one, and 'ref' is the same.

So the new link will be https://donate.mozilla.org/en-US/thunderbird/?presets=100,50,25,15&amount=50&utm_source=thunderbird.net&utm_medium=referral&utm_content=header&currency=usd

[ryanleesipes]

Looks good to me, everything good to go live?

[Sancus]

This is live as of ~6 hours ago in https://github.com/thundernest/tb-website-builds/commit/3a4566781588c5e545d70b9c2bbf0df50fadc1d3

The cloudflare cache has expired and it is visible on https://www.thunderbird.net.