(Squarespace) Adding Facebook Messenger icon next to Site Title

[tuanphan]

To add Facebook Messenger icon next to Site Title, like this.

You can use this code to Code Injection > Footer. Remember to change FB url.
If code doesn’t work, you can comment below, message or email me.

<script>
window.instagramUrl = 'https://facebook.com/';
window.instagramIcon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M256.6 8C116.5 8 8 110.3 8 248.6c0 72.3 29.7 134.8 78.1 177.9 8.4 7.5 6.6 11.9 8.1 58.2A19.9 19.9 0 0 0 122 502.3c52.9-23.3 53.6-25.1 62.6-22.7C337.9 521.8 504 423.7 504 248.6 504 110.3 396.6 8 256.6 8zm149.2 185.1l-73 115.6a37.4 37.4 0 0 1 -53.9 9.9l-58.1-43.5a15 15 0 0 0 -18 0l-78.4 59.4c-10.5 7.9-24.2-4.6-17.1-15.7l73-115.6a37.4 37.4 0 0 1 53.9-9.9l58.1 43.5a15 15 0 0 0 18 0l78.4-59.4c10.4-8 24.1 4.5 17.1 15.6z"/></svg>';
function createSocialIcon() {
  let siteTitles = document.querySelectorAll('#site-title');
  
  siteTitles.forEach(function(siteTitle) {
    let link = document.createElement('a');
    link.href = window.instagramUrl;
    link.className = 'second-button';
    link.innerHTML = window.instagramIcon;
    
    siteTitle.parentNode.insertBefore(link, siteTitle.nextSibling);
  });
}
document.addEventListener('DOMContentLoaded', function() {
  createSocialIcon();
});
</script>

and this to Custom CSS box.

div.header-title-text {
    display: flex;
    align-items: center;
}
a.second-button {
    width: 30px;
    margin-left: 20px;
}