Share buttons that stay out of the way.no account required
AddToSite

Customize

Customize share buttons: every setting, with a demo you can press.

Each one is a class on the kit or a key in ats_config. Open any of them for the code, what to watch for, and working buttons.

54settings

54 customization guides

The buttons

10 settings
Default share buttonsThe standard row, ready to paste into any website.ShapeRounded, circular or square. One class on the kit.SizeAny pixel size you like, set by a number in the class name.LabelsText beside the icon, for when an icon alone is not obvious.Your own coloursOverride a brand colour with a rule of your own.How many showCap the row; everything past the cap moves into the More menu.Which servicesOffer only the services you name, or every service except a few.Your own serviceAdd a destination the catalog has never heard of.Center the rowWhere the row sits is your stylesheet’s decision, not an option of ours.Your own artworkPut your own image on a button, in place of the glyph we draw.

One service at a time

5 settings
A button per serviceOne anchor, one service, with no kit wrapper anywhere above it.FacebookThe sharer dialog in a popup. No SDK, no iframe, no pixel.PinterestThe pin dialog. It is the one service in the catalogue that wants a picture.LinkedInThe share-offsite endpoint, not the LinkedIn widget.XThe compose window, with your title as the text and the link after it.

The menu

10 settings
Native device sharingOpen the device share sheet with a menu fallback.Email provider menuLet readers choose their mail app or a webmail provider.Saved service preferencesRemember a reader’s preferred service order on your site.Menu styleRepaint the share sheet: its ground, its ink, its corners.The filter fieldThe sheet opens with its filter focused. One rule takes it away.Order the menuFloat the services your readers actually use to the top of the sheet.Leave services outDrop a handful and keep everything else, including whatever ships later.Click or hoverThe More button can open the sheet on hover, after a delay you choose.Menu icon colourFlatten every tile in the share sheet to one ink of your own.Square the menuCorners come from one variable, and the whole ladder goes flat together.

The quick menu

6 settings
Hover delayWait before opening the compact menu, and cancel when the pointer leaves.Open on a pressA short strip of the next few services, opened from the More button.Open on hoverThe pointer opens the strip after a delay. Touch gets a tap instead.How many it showsSix by default. Past a dozen the sheet is the better answer.Menu orientationChoose a row or column and whether the menu opens above or below.Always openNo trigger at all: a second row of services, there from the start.

What gets shared

9 settings
Share another URLPoint a kit at a link other than the page it sits on.Count recoveryKeep the share counts after a page changes address.Campaign linksTag every shared link so your analytics can tell the buttons apart.Change an endpointReplace where one service sends the reader, template and all.URL and titleWhere the address and the title come from when you set neither.Email subject and bodyThe email button composes a mailto: link. Write your own.The messageOn the services that carry text, the title is the message. Set it and you are writing the post.Short linksRun the link through a shortener of yours before the share window lands on it.Say thanksA hook that fires once the share is away, for a note or a log of your own.

One kit or many

3 settings
One button on its ownA kit of one service, with no More button beside it.Many kits, one pagePaste as many as the page needs; one scan wires all of them.Buttons added after loadFor a single-page app: insert the markup, then ask for another scan.

Behind the scenes

6 settings
AnalyticsShares arrive in Google Analytics with no tag of ours.Your own backendPoint the counting endpoints at a server you run.Self-host the scriptServe the widget from your own origin when policy requires it.Event handlingA hook before the share: edit the URL or the title, or call the whole thing off.TranslationTranslate the widget’s interface labels, one key at a time.Load it your wayThe tag is async, and the widget is content to arrive late.

Every option

Set window.ats_config before the widget script runs. Every key is optional.

KeyTypeWhat it does
urlstringDefault link to share. A kit’s data-url takes priority. Default: Page canonical URL, then location.href.
titlestringDefault message/title. A kit’s data-title takes priority. Default: og:title, then document.title.
imagestringImage URL for endpoints such as Pinterest. A kit’s data-image takes priority. Default: og:image, then empty.
num_servicesnumberMaximum inline service buttons. An empty kit uses the default catalog set; More offers the remaining allowed services. Default: No limit.
nativebooleanUse the device share sheet when available. true also enables it on desktop; false always uses the widget menu. Default: Automatic on mobile/touch.
langstringExplicit locale wins. Supported base codes: en, vi, de, fr, es, pt, ja, zh. Regional codes use their base language; unsupported explicit/page languages fall back to English. Default: Page language, then browser language.
stringsobjectOverride individual labels: share, more, search, close, copied, shareTo, noResults, followOn, shareCount, shareFailed. Empty or invalid values fall back to the selected language. Default: {}.
themestringlight or dark pins widget surfaces to your site theme. Call addtosite.theme() to update surfaces already rendered. Default: Operating-system preference.
servicesstring[] or stringAllowlist of service keys, also accepted as comma-separated text. An empty list leaves all services available. Default: All available services.
exclude_servicesstring[] or stringExclude these services when no nonempty allowlist is set. A nonempty services list takes priority. Default: [].
prioritystring[] or stringOrder these services first, followed by saved preferences and then catalog order. Filtering and platform restrictions still apply. Default: [].
custom_servicesobject[]Register services before loading: key, name, color, and url and/or follow. Optional fg and HTTP(S) icon URL. URL templates use {url}, {title}, {image}; follow uses {handle}. Default: [].
share_urlobjectReplace service endpoint templates by key. Supports {url}, {title}, {image}; accepted schemes are HTTP(S), mailto and sms. Default: {}.
mastodon_instancestringMastodon server used for share and follow URLs. Default: mastodon.social.
menu_typestringmail restricts universal and quick menus to supported email providers; it also bypasses automatic native sharing. Default: All share services.
menu_searchbooleanShow the search field in the full menu. Default: true.
menu_triggerstringhover opens the full menu after hover_delay. Click and keyboard activation remain available; touch uses click. Default: click.
hover_delaynumberHover delay in milliseconds, bounded to 0–2000. Leaving the trigger cancels the pending open. Default: 200.
quick_menuboolean or stringtrue or click opens a compact menu on click; hover opens on hover; static keeps it visible. quick_count, quick_orientation or quick_position also enable it. Default: Off.
quick_countnumberCompact-menu service count, from 1 to 24. More remains available. Default: 6.
quick_orientationstringhorizontal or vertical button arrangement in the compact menu. Default: horizontal.
quick_positionstringauto opens below and flips upward when needed; up or down forces the opening direction. This does not change the row/column arrangement or a static menu. Default: auto.
trackbooleanSend anonymous widget-action pings. false stops these pings; it does not disable count reads or your page’s analytics integration. Default: true.
analyticsbooleanReport share events to an existing gtag or dataLayer. No analytics library is loaded. false disables this independently of track. Default: true.
countersbooleanFetch and show this widget’s recorded action counts on service buttons. These are not network-wide popularity or confirmed published posts. Default: false.
apistringCounting API base URL for a self-hosted backend. Sharing never waits for this service. Default: //data.addtosite.com/v1.
link_campaignstringAdd utm_source=<service>, utm_medium=social and utm_campaign=<value> to shared URLs. Existing values for these parameters are replaced. Default: Unset.
shortenfunctionReceives the campaign URL and returns an HTTP(S) URL or Promise. Popup shares fall back after an error or 3-second timeout. Native sharing and local actions do not wait for this hook. Default: Unset.
readyfunction or function[]Receives the API once after the initial document scan. Use it for code that requires the asynchronously loaded widget. Default: Unset.
onBeforeSharefunction or function[]Receives {service, url, title, image}. Modify the payload, or return false to cancel. Default: Unset.
onSharefunction or function[]Runs after a popup opens, a local action succeeds or the native share Promise resolves. It does not confirm publication on a network. Default: Unset.
dock_afternumberFor floating bars, scroll distance in pixels before showing the bar. Zero disables scroll-based hiding. Default: 0.
dock_until_footnumberWith dock_after enabled, hide the floating bar this many pixels before the document bottom. Default: 0.
overlaysbooleanEnable image share overlays; loads overlays.js beside widget.js. Default: false.
overlay_min_sizenumberBoth rendered image dimensions must meet this size in pixels. Default: 200.
overlay_targetstringCSS selector restricting images. Header/footer/widget images, hidden images and data-ats-no-overlay ancestors are excluded. Default: All eligible images.
overlay_showstringvisible keeps buttons displayed, including on touch screens. hover reveals them on hover or tap. Default: hover.
overlay_servicesstring[]Service keys in overlay order; dd means More. The basic uncustomized overlay uses one universal button. Default: ["pinterest", "dd"] when customized.
overlay_sizenumberImage button size, bounded to 16–64 pixels. Default: 32.
overlay_orientationstringhorizontal or vertical layout for customized image buttons. Default: vertical.
overlay_positionstringVertical position top/center/bottom plus horizontal left/center/right, for example bottom-center. Default: top-left.
overlay_use_imagebooleanShare the image file URL. Otherwise share longdesc, the canonical page URL or location.href; the image itself still fills {image}. Default: false.
overlay_htmlstringTrusted HTML containing one ats_kit root. Replaces overlay services/size/orientation markup while keeping position and image context. Default: Unset.

Class names you can style

ClassApplies to
.ats_kitThe container holding a row of buttons
.ats_btnEvery button, whichever service
.ats_btn_<service>One specific service
.ats_ddThe More button
.ats_labelThe text beside an icon
.ats_menuThe share sheet panel
.ats_overlayThe scrim behind the sheet, and where its colour variables live
data-ats-keepOn a button: leave what is inside it alone, and style it yourself