Skip to main content

Connect with Follow Button

Embedding a follow button on your website is a quick and easy way to enable following/unfollowing in the given namespace. Let's begin!

The CyberConnect Follow Button SDK for JavaScript doesn't have any standalone files that need to be downloaded or installed. You simply need to add a short piece of regular JavaScript into your HTML that will asynchronously load the SDK into your pages. Async loading means that it does not block loading other elements of your page.

The source code for the Follow Button can be found on Github.

Create a follow button

First you need to include the cyberconnect-follow-button.min.js script and call follow.init after the script is loaded.

<script>
async function initCyberConnect() {
await capi.follow.init({
ethProvider: ethProvider, // ethProvider is an Ethereum provider
namespace: 'CyberConnect',
env: 'PRODUCTION' // env decides the endpoints: STAGING or PRODUCTION (default)
});
</script>
<script src="https://connect.cybertino.io/js/cyberconnect-follow-button.min.js" defer onload="initCyberConnect"></script>

Then, to create a follow button, add an div element to contain a button id and call follow.render with the button id and the target wallet address:

<body>
<div id="follow-button"></div>
<script>
capi.follow.render("follow-button", {
toAddr: 'xxx',
onSuccess: (event) => {
console.log(event);
},
onFailure: (event) => {
console.log(event);
},
});
</script>
</body>

When the button is triggered, the callbacks will be called with the following event object:

onSuccess:
{
code: EVENT_NAME,
toAddr: "xxx"
}

onFailure:
{
code: ERROR_CODE,
message: "error message"
}

Sandbox

You can test the button for yourself in the sandbox. Make sure you've connected with the wallet first: