Build a Push Notification Inbox With Aimtell's New JavaScript SDK Functions

One of the most-requested features from Aimtell developers is finally here: a complete push notification inbox API baked right into our JavaScript SDK. With four new functions added to trackpush.js, you can now read, mark, and delete a subscriber's push notification history directly from the browser — no backend integration required. In this post, we'll walk through the new Aimtell JavaScript API functions, show working code examples for each, and demonstrate how to combine them into a fully functional in-page notification inbox.

What's New in the Aimtell JavaScript SDK

Aimtell's trackpush.js SDK has long offered helpers for working with the current subscriber — getting their info, updating their attributes, segmenting them, and more. We've extended that toolkit with four new functions focused on the subscriber's stored web push notifications:

• _aimtellGetNotifications() — returns the subscriber's full notification history
• _aimtellMarkNotificationsRead(timestamp) — marks one or all notifications as read
• _aimtellMarkNotificationsUnread(timestamp) — marks one or all notifications as unread
• _aimtellDeleteNotifications(timestamp) — deletes one or all notifications

All four functions return native Promises, follow the same XHR pattern as Aimtell's existing _aimtellGetSubscriber* helpers, and require zero new dependencies. They hit the new https://notifications.aimtell.com service and are automatically scoped to the current site (_at.idSite) and subscriber (_at.subscriber) — the same identifiers Aimtell already manages for you during init.

Why Build a Push Notification Inbox?

Native browser push notifications are ephemeral. They appear, the user clicks (or doesn't), and they vanish. That's a problem if a subscriber misses a notification while their browser is closed, on do-not-disturb, or simply scrolling past too fast. A persistent in-page notification inbox solves this by giving subscribers a way to see, revisit, and act on every push you've sent them.

With Aimtell's new SDK functions, you can now ship features like:

• A bell icon in your site header showing an unread notification count
• A dropdown listing recent notifications with click-through links
• A dedicated “My Notifications” page where users manage their notification history
• “Mark all as read” and “Clear all” controls that work with a single SDK call

Prerequisites

Before using the new functions, make sure you have Aimtell's standard installation in place. Specifically, both _at.idSite and _at.subscriber must be set on the page — this is handled automatically by the standard Aimtell init script. The four functions will reject if the subscriber hasn't yet opted in to push.

1. Get the Subscriber's Notification History

The starting point for any notification inbox is reading the history. _aimtellGetNotifications() returns a Promise that resolves to an array of notifications, sorted most-recent first.

_aimtellGetNotifications().then(function(notifications) {
  console.log(notifications);
  // [{ title, body, icon, link, read: true|false, timestamp }, ...]
});

Each item in the response array contains the following fields:

• title — the notification's title
• body — the notification's body text
• icon — the icon URL displayed with the push
• link — the destination URL the notification points to
• read — true if read, false if unread
• timestamp — the unique key used to target a single notification in the functions below

The timestamp field is important: it's the identifier you'll pass to the mark-as-read, mark-as-unread, and delete functions when you want to act on a single notification. Pass it through unchanged — don't reformat or convert it.

Example: Show an Unread Count Badge

A common UI pattern is a bell icon in your site header with an unread count badge. Here's how you'd populate it:

_aimtellGetNotifications().then(function(notifications) {
  var unread = notifications.filter(function(n) {
    return !n.read;
  }).length;
  document.getElementById("notif-count").innerText = unread;
});

2. Mark Notifications as Read

_aimtellMarkNotificationsRead() updates the read flag on the subscriber's stored notifications. Pass a timestamp from the response above to mark one notification, or call with no arguments to mark every notification as read at once — perfect for a “Mark all as read” button.

// mark all as read
_aimtellMarkNotificationsRead().then(function(res) {
  // { updated: <count> }
  console.log("Marked " + res.updated + " notifications as read");
});

// mark one as read
_aimtellMarkNotificationsRead(1711900000).then(function(res) {
  // { updated: 1 }
});

Both forms resolve to an object containing an updated count, so you know exactly how many records were touched. Use it to update your UI optimistically or to confirm the mutation succeeded.

3. Mark Notifications as Unread

Sometimes a user wants to mark a notification back to unread — a “come back to this later” signal. _aimtellMarkNotificationsUnread() mirrors the read function exactly: pass a timestamp for one, or omit the argument to flip every notification back to unread.

// mark all as unread
_aimtellMarkNotificationsUnread().then(function(res) {
  // { updated: <count> }
});

// mark one as unread
_aimtellMarkNotificationsUnread(1711900000).then(function(res) {
  // { updated: 1 }
});

4. Delete Notifications

When a subscriber wants to clear out their inbox, use _aimtellDeleteNotifications(). As with the other functions, pass a timestamp to remove one notification or omit it entirely to wipe every notification from the subscriber's history.

// delete all
_aimtellDeleteNotifications().then(function(res) {
  // { deleted: <count> }
});

// delete one
_aimtellDeleteNotifications(1711900000).then(function(res) {
  // { deleted: 1 }
});

Deletes are permanent. Once a notification is removed from the subscriber's history, it cannot be recovered — if you want a “trash” pattern, prefer marking-as-read over deleting.

Putting It All Together: A Mini Notification Inbox

Here's a complete, dependency-free example that wires up a basic inbox. It renders the subscriber's notifications, marks each as read on click, and exposes a “Clear all” button. Drop it on any page that has Aimtell's standard install code.

<div id="inbox"></div>
<button id="clear-all">Clear all</button>

<script>
  function renderInbox() {
    _aimtellGetNotifications().then(function(notifications) {
      var html = notifications.map(function(n) {
        var weight = n.read ? "normal" : "bold";
        return '<a href="' + n.link + '" data-ts="' + n.timestamp +
          '" style="font-weight:' + weight + '">' + n.title + '</a>';
      }).join("<br>");
      document.getElementById("inbox").innerHTML = html;
    });
  }

  document.getElementById("inbox").addEventListener("click", function(e) {
    var ts = e.target.dataset.ts;
    if (ts) _aimtellMarkNotificationsRead(Number(ts));
  });

  document.getElementById("clear-all").addEventListener("click", function() {
    _aimtellDeleteNotifications().then(renderInbox);
  });

  renderInbox();
</script>

That's a fully functional push notification inbox in roughly 25 lines of JavaScript. From here, you can layer in your own styles, pagination, filtering by read status, or chain the Promises with the existing _aimtellGetSubscriber* helpers to enrich the UI with subscriber-specific data.

Best Practices for Building Your Inbox

1. Re-render after every mutation. Whenever you call mark-as-read, mark-as-unread, or delete, refresh the list with _aimtellGetNotifications() so the UI matches the server state.
2. Handle the unsubscribed state. Wrap calls in a guard that checks the subscriber is opted in — otherwise the Promise will reject because _at.subscriber isn't set.
3. Treat the timestamp as opaque. Pass the value back exactly as you received it from _aimtellGetNotifications(). Don't parse, format, or compare it — it's an identifier, not a display value.
4. Confirm destructive actions. Deletes are permanent. Add a quick confirmation dialog before calling _aimtellDeleteNotifications() with no argument.
5. Combine with click tracking. Pair your inbox with Aimtell's conversion tracking so on-site re-engagement clicks roll up alongside your push performance reports.

API Reference Quick Card

Start Building Your Notification Inbox Today

The new notification-management functions in trackpush.js turn Aimtell's JavaScript SDK into a complete push notification platform — not just for sending pushes, but for letting subscribers engage with their history long after the original push has come and gone. That's a powerful re-engagement surface, and it's now just a few lines of code away.

For full method signatures and additional details, head to the JavaScript Functions section of developers.aimtell.com. Or jump straight into your Aimtell dashboard to start using these functions on your live site.

Not yet using Aimtell? Start your free 14-day trial and ship a fully featured web push notifications inbox for your subscribers in an afternoon.

GET STARTED FREE