Skip to main content

Nextdoor Social Icon in Header

You can use the following scripts to replace either the YouTube or LinkedIn buttons to a NextDoor logo. Place in the Scripts tab, not an embed. Should be used in conjunction with the social color style page so that they are all black or white.

YouTube - Black Icon 

// Replacing the Youtube Icon for a black NextDoor Icon
document.addEventListener('DOMContentLoaded', function() {
  var youtubeAnchor = document.querySelector('a[aria-label="youtube"]');
  if (youtubeAnchor) {
    var img = document.createElement('img');
    img.src = 'https://4515944.fs1.hubspotusercontent-na1.net/hubfs/4515944/IM%20Background%20Images/Nextdoor%20Icon.png';
   img.alt = "Nextdoor Icon";
   img.width = 25;
    img.height = 25;
    img.style.display = 'inline'; // Ensures the image flows with the text/icons
    img.style.verticalAlign = 'top'; // Aligns the top of the image with the top of the line-box
    while (youtubeAnchor.firstChild) {
      youtubeAnchor.removeChild(youtubeAnchor.firstChild);
    }
    youtubeAnchor.appendChild(img);
  }
});

YouTube - White Icon 

// Replacing the Youtube Icon for a black NextDoor Icon
document.addEventListener('DOMContentLoaded', function() {
  var youtubeAnchor = document.querySelector('a[aria-label="youtube"]');
  if (youtubeAnchor) {
    var img = document.createElement('img');
    img.src = 'https://4515944.fs1.hubspotusercontent-na1.net/hubfs/4515944/IM%20Background%20Images/Nextdoor%20Icon%20White.png';
    img.alt = "Nextdoor Icon";
    img.width = 25;
    img.height = 25;
    img.style.display = 'inline'; // Ensures the image flows with the text/icons
    img.style.verticalAlign = 'top'; // Aligns the top of the image with the top of the line-box
    while (youtubeAnchor.firstChild) {
      youtubeAnchor.removeChild(youtubeAnchor.firstChild);
    }
    youtubeAnchor.appendChild(img);
  }
});

LinkedIn - Black Icon 

// Replacing the LinkedIn Icon for a black NextDoor Icon
document.addEventListener('DOMContentLoaded', function() {
  var linkedinAnchor = document.querySelector('a[aria-label="linkedin"]');
  if (linkedinAnchor) {
    var img = document.createElement('img');
    img.src = 'https://4515944.fs1.hubspotusercontent-na1.net/hubfs/4515944/IM%20Background%20Images/Nextdoor%20Icon.png';
    img.alt = "Nextdoor Icon";
    img.width = 25;
    img.height = 25;
    img.style.display = 'inline'; // Ensures the image flows with the text/icons
    img.style.verticalAlign = 'top'; // Aligns the top of the image with the top of the line-box
    while (linkedinAnchor.firstChild) {
      linkedinAnchor.removeChild(linkedinAnchor.firstChild);
    }
    linkedinAnchor.appendChild(img);
  }
});

LinkedIn - White Icon 

// Replacing the LinkedIn Icon for a black NextDoor Icon
document.addEventListener('DOMContentLoaded', function() {
  var linkedinAnchor = document.querySelector('a[aria-label="linkedin"]');
  if (linkedinAnchor) {
    var img = document.createElement('img');
    img.src = 'https://4515944.fs1.hubspotusercontent-na1.net/hubfs/4515944/IM%20Background%20Images/Nextdoor%20Icon%20White.png';
    img.alt = "Nextdoor Icon";
    img.width = 25;
    img.height = 25;
    img.style.display = 'inline'; // Ensures the image flows with the text/icons
    img.style.verticalAlign = 'top'; // Aligns the top of the image with the top of the line-box
    while (linkedinAnchor.firstChild) {
      linkedinAnchor.removeChild(linkedinAnchor.firstChild);
    }
    linkedinAnchor.appendChild(img);
  }
});