---
tags: nc-programs
title: NEAR Login and your Website
---

# NEAR Login and your Website

This document will help you to enable a login button on the NEAR platform on your website.

## Why this is Important

NEAR EDU tracks the performance of partner activities on chain using smart contracts.

## Technical Details

Note the following:
- the imported script loads `near-api-js` into your web page
- the `signIn()` and `signOut()` functions can be called from any page event
- the `config()` function can be customized for MainNet (current) or Testnet

You should set the value of `PARTNER_ACCOUNT` to the account we provided you during the onboarding process. It will match the pattern `YOUR_COMPANY.edu-partner.near`

<script src="https://cdn.jsdelivr.net/gh/nearprotocol/near-api-js/dist/near-api-js.js"></script>

<script>
  (async () => {

   const PARTNER_ACCOUNT = 'YOUR_COMPANY.edu-partner.near'
   const PARTNER_WEBSITE = 'Your Site Name'
    
   const { connect, keyStores, WalletConnection } = nearApi;

   const loginBtn = document.querySelector('#near-login')
   const logoutBtn = document.querySelector('#near-logout')

   loginBtn.addEventListener('click', signIn)
   logoutBtn.addEventListener('click', signOut)

   const near = await connect(config());
   const wallet = new WalletConnection(near);

   if(wallet.isSignedIn()) {
     const accountId = wallet.getAccountId();
     logoutBtn.innerHTML = `Logout ${accountId}`;
     hide(loginBtn);
     show(logoutBtn);
   }

   /*
   Helper functions
   */
   function signIn(){
     wallet.requestSignIn(
       PARTNER_ACCOUNT,
       PARTNER_WEBSITE
     );
   }

   function signOut(){
     wallet.signOut();
     logoutBtn.innerHTML = ``;
     hide(logoutBtn);
     show(loginBtn);
   }

   function config() {
     return ({
       networkId: 'mainnet',
       keyStore: new keyStores.BrowserLocalStorageKeyStore(),
       nodeUrl: 'https://rpc.mainnet.near.org',
       walletUrl: 'https://wallet.mainnet.near.org',
       helperUrl: 'https://helper.mainnet.near.org',
       explorerUrl: 'https://explorer.mainnet.near.org',
     });
   }

   function show(btn) {
     btn.classList.remove('hidden-button');
     btn.classList.add('visibile-button');
   }

   function hide(btn) {
     btn.classList.remove('visible-button');
     btn.classList.add('hidden-button');
   }
 })()
</script>