Authenticating a user – Notific.io tutorial 3

Authenticating a user in Notific.io

This tutorial explains the process of authenticating a user for private notifications in Notific.io. Notific.io is an extremely simple to integrate and use notification delivery and presentation service. Regardless of its simplicity it also provides functionalities for even the most sophisticated use cases via it’s API.

We have added all the example codes of the video below for your convenience. Feel free to copy – paste them as you see fit.

HTML example codes

<li class="notific">
    <a href="#">
        <i class="fa fa-bell notific-bell"></i>
        <span class="notific-count"></span>
    </a>
</li>

CSS example codes

.notific {
  position: relative;
}

.notific-bell {
  font-size: 1.5em;
}

.notific-count {
  display: none;
  font-size: 0.8em;
  line-height: 0.8em;
  color: white;
  background: red;
  padding: 3px;
  right: 0;
  bottom: 0;
  position: absolute;
  border-radius: 3px;
}

JavaScript example codes

<script src="https://cdn.notific.io/[APP_ID].js"></script>
<script>
Notific.destroyButton();

// Do something when count of unread notifications changes
Notific.on('unread', function(count) {
    var el = document.querySelector('.notific-count');

    el.innerHTML = count;
    el.style.display = count ? 'block' : 'none';
});

// Toggle notification panel by clicking your custom button element
document.querySelector('.notific').addEventListener('click', function(e) {
    Notific.toggle(e);
}, false);

<?php
$secretKey = '[SECRET_KEY]';

// This data would normally come from your app's database
$data = [
    'id' => '[USERS_ID_IN_YOUR_APP]',
    'name' => '[USERS_NAME_IN_YOUR_APP]',
    'email' => '[USERS_EMAIL_IN_YOUR_APP]'
];

ksort($data);

$hmac = hash_hmac(
    'sha256',
    json_encode($data),
    $secretKey
);

$data['hmac'] = $hmac;
?>

Notific.setUser(<?=json_encode($data)?>);
</script>

Thank you for checking this tutorial about authenticating users in Notific.io. Next tutorial is: Zapier mailchimp integration. It explains how to integrate Zapier mailchimp to your Notific.io configuration.