Replace Site Title on a Specific Page

Free

Feb 6

Replace your site title on a specific page to highlight a different brand or membership area.

Steps

Step 1: Add the javascript

Navigate to the Website area in the Squarespace Editor and click on the settings (gear icon) of the page you want to replace your logo. In the Page Settings » Advanced » Page Header Code Injection area, paste the below code.

<!-- Replace Site Title - from Will-Myers.com -->
<script>
  window.addEventListener('DOMContentLoaded', () => {
    const newDesktopTitle = "Woof Woof"; // New Site Title
    const newMobileTitle = ""; //  
    const newHref = "/";

    const desktopSiteTitle = document.querySelector('.header-display-desktop #site-title');
    const mobileSiteTitle = document.querySelector('.header-display-mobile #site-title')

    //desktop
    desktopSiteTitle.href = newHref
    desktopSiteTitle.innerHTML = newDesktopTitle

    //mobile
    mobileSiteTitle.href = newHref
    mobileSiteTitle.innerHTML = newMobileTitle
  })
</script>

Step 3: Add your new logo

Replace the newDesktopTitle and newMobileTitle variables with the urls of your new logo. They can be the same if you want.

Adjust the newHref variable if you’d like it to be different, otherwise, leave it as is.

FAQs

Apply this to all Blog Pages NOT including Blog Collection page

Follow the same steps above, but paste the javascript in your Blog Settings » Advanced » Blog Post Item Code Injection area

Apply this to all Blog Pages including Blog Collection page

Follow the same steps above, but paste the javascript in your Blog Settings » Advanced » Page Header Code Injection area

Et voila! We now have have replaced Site Logos.

Site Nav Replacer Plugin

Site Nav Replacer

$25.00

View Demo

Replace the your site nav on specific pages of your website. Great for use with Member Areas, multi-lingual sites, and additional brands under the same URL.

Purchase