The menu
Share through the device
On supported mobile and touch devices, the universal button can open the operating system share sheet. Readers choose from their installed apps. A browser without native sharing can still use the full service menu.
The code
<div class="ats_kit ats_kit_size_32"> <a class="ats_btn_facebook"></a> <a class="ats_btn_whatsapp"></a> <a class="ats_dd"></a> </div> <button type="button" id="ats-native-demo" class="btn btn-primary mt-4">Try device sharing</button><p id="ats-native-status" class="mt-3 text-sm" role="status"></p>
Choose the default
Leave native unset for automatic sharing on supported mobile/touch devices. Set true to allow it on desktop too, or false to always use the widget menu. The demo sets false and calls nativeShare directly, so it does not change how the other buttons behave.
window.ats_config = window.ats_config || {};
window.ats_config.native = true;Call it from a user action
nativeShare accepts an optional object with url and title and returns a Promise. Call it directly from a click or keyboard handler; waiting for a request first can lose browser permission. Most browsers require HTTPS. Cancellation is quiet; unsupported sharing or other failures open the widget menu.
button.addEventListener("click", function () {
addtosite.nativeShare({ url: location.href, title: document.title });
});Payload and completion
The before-share hook can edit the link and title. Campaign parameters apply, but native sharing does not wait for the shortener or upload an image file. A resolved Promise means the browser completed its sharing operation; the destination app and publication status are not exposed.
What the device sheet buys, and what it costs
On a phone the sheet lists the apps the reader actually has — the messaging app half the country uses, AirDrop, contacts — which no menu of ours can open, and it is the control they already know. That is why it is the default there. The price is in the numbers: the browser never says which app was chosen, so a native share counts as one share, not as a Facebook or a WhatsApp share, and a reader who closes the sheet is indistinguishable from one who posted. A site that wants per-service counts, a fixed list, or the search box on every device sets native: false and takes the menu everywhere; a site that wants the sheet on desktop too, where browsers offer a thinner one, sets native: true.
Live demo
Try device sharing from a secure HTTPS page. The separate More button keeps the widget menu available for comparison. This demo sends no tracking or analytics events.
Services (2 selected)
No service matches “”.
Button size
Shape
Circle is available when service names are off.
Behaviour
<script>
window.ats_config = window.ats_config || {};
window.ats_config.native = false;
window.ats_config.track = false;
window.ats_config.analytics = false;
</script>
<div class="ats_kit ats_kit_size_32">
<a class="ats_btn_facebook"></a>
<a class="ats_btn_whatsapp"></a>
<a class="ats_dd"></a>
</div>
<button type="button" id="ats-native-demo" class="btn btn-primary mt-4">Try device sharing</button><p id="ats-native-status" class="mt-3 text-sm" role="status"></p>
<script>
window.ats_config = window.ats_config || {};
document.addEventListener('click', function (event) {
if (!event.target.closest('#ats-native-demo')) return;
if (!window.addtosite) return;
window.addtosite.nativeShare().then(function (shared) {
var status = document.getElementById('ats-native-status');
if (status) status.textContent = shared ? 'Device sharing completed.' : 'No native share completed. Unsupported browsers show the service menu.';
});
});
</script>
<script async src="//static.addtosite.com/widget.js"></script>Related
More in The menu