SNIPER
LINK

Increase email confirmation rates by showing a button that directly opens the user's email client

Why?

Using double opt-in for your email newsletter or app can be vital for ensuring that your subscribers are real people. But because of the extra friction in a second step, it can also be a huge source of missed activation.

What?

Sniper Link is a widget that you can add to your sign-up forms that links subscribers directly to their email inbox — filtered down to your sender, bypassing spam filters. You can fully customize the way it looks and behaves, so it blends in to your website.

How?

Using our pre-built web component:

<sniper-link
  recipient="you@example.com"
  from="justin@buttondown.email"
/>
<script src="https://sniperl.ink/v1/sniper-link.js" defer></script>

Or by calling our API directly:

fetch(`https://sniperl.ink/v1/render?recipient=${
    recipient
  }&sender=justin@buttondown.email`)

Custom Styling

The Sniper Link button can be customized using CSS. There are four parts to the button:

container: A wrapper that holds the entire button.
button: The clickable element.
image: A logo representing the email provider.
text: A label, by default showing "Open in "provider.

You can use the ::part CSS selector to override the default styles:

sniper-link::part(button) {
  background-color: darkorange;
  justify-content: center;
  border-radius: 99px;
}

sniper-link::part(text) {
  color: white;
  text-shadow: 0 0 4px hsla(0, 0%, 0%, 0.2);
}

Custom Label Text

The default text on the Sniper Link button is "Open in "provider" ", but you can change it using the template attribute:

<sniper-link
  recipient="me@gmail.com"
  sender="justin@buttondown.email"
  template="Confirm email using {provider}"
></sniper-link>

API Usage

If you want to create your own custom button, you can directly depend on our API:

GET https://sniperl.ink/v1/render?recipient={recipient}&sender={sender}

The response will look like this:

{
  "url": "https://...",
  "image": "https://sniperl.ink/logos/gmail.png",
  "provider_pretty": "Gmail"
}

FAQ?

What email providers do you support?

Gmail, Yahoo, Proton, iCloud, Outlook, HEY, AOL, and Mail.ru, to start. We're also monitoring for new providers and will add them as they come up. Let us know if there's a provider you'd like us to add!

What platforms do you support?

The redirects are based on the device being used: desktop, iOS, and Android are supported!

What happens with unrecognized providers?

When the email provider cannot be determined, the sniper-link element will have a hidden attribute. This attribute can be used for styling the button or the adjacent elements.

Are you doing anything nefarious with my subscribers?

Nope. Don't want 'em.

I still do not trust you. Can I just supply a domain instead of the full email address?

Yup.

Behind the Scenes

Here's how Sniper Link works:

• First we check whether the domain of the email address is obvious (i.e. it ends in @gmail.com or similar).
• If the domain is not obvious, we do a DNS lookup to try to determine what email provider is being used for the domain.
• Then, we determine the user's platform (desktop, iOS, or Android) in order to provide the best possible URL for their provider and platform.
• Finally, we serve the detected provider and URL to the user via the <sniper-link> component or API response.

Who built this?

Your friends at Buttondown, and they even made it open source. Thanks to Dan & Louis-Xavier for the idea.

For support, email support@buttondown.com.

SNIPERLINK