How to Change the Link of a Header Logo

With the Code Editor available with Access or the Pro Plan, learn to change the link of your Header Logo. 

In this article:

• What is the Header Logo?
• Changing the link with the Website Builder
• Changing the link with Kajabi Pages
• Changing the link with Premier

What is the Header Logo?

The Header Logo is located at the top of your page to display your brand and identify your site. In addition to branding your page, the Header Logo behaves as a clickable link to lead your page visitors back to the homepage of your site:

Natively, the Header Logo is linked to the homepage of your site (i.e., Template Home or Custom Homepage).

However, if you wish to link to a different page when a visitor clicks your Header Logo, use the Code Editor available with the Pro Plan to change the link.

Changing the link with the Website Builder

First, copy the link you want your Header Logo to lead to.

Then, use the Code Editor to change your logo link:

• Open the Code Editor for your desired website page.
• Open the Snippets folder.
• Click open the shared_block_logo.liquid file.
• Locate <a class="logo" href="/"> near or on line 14.

In this code snippet, replace the forward slash (/) with your full URL (e.g., https://help.kajabi.com):

Click image to enlarge

After updating your Header Logo with your desired link:

• Click Save to keep your changes.

After the Save button has transitioned from blue to white:

• Click Preview to test your new Header Logo link.

Changing the link with Kajabi Pages

First, copy the link you want your Header Logo to lead to.

Then, use the Code Editor to change your logo link for a page:

• Open the Code Editor for your desired page.
• Open the Snippets folder.
• Click open the shared_block_logo.liquid file.
• Locate <a class="logo" href="/"> near or on line 14.

In this code snippet, replace the forward slash (/) with your full URL (e.g., https://help.kajabi.com):

Click image to enlarge

After updating your Header Logo with your desired link:

• Click Save to keep your changes.

After the Save button has transitioned from blue to white:

• Click Preview to test your new Header Logo link.

Changing the link with Premier

First, copy the link you want your Header Logo to lead to.

Then, use the Code Editor to change your logo link for a page built with Premier:

• Open the Code Editor for your desired landing page built with Premier.
• Open the Sections folder.
• Click open the header.liquid file.
• Locate <a href="/" kjb-settings-id="{{ kjb-H-LogoText }}"> near or on line 9.
• Similarly, locate <a href="/" class="logo logo--image"> near or on line 14.

For both snippets of code, replace the forward slash (/) with your full URL (e.g., https://kajabi.com):

Click image to enlarge

After updating your Header Logo with your desired link:

• Click Save to keep your changes.

After the Save button has transitioned from blue to white:

• Click Preview to test your new Header Logo link.

And that's how to change the link of a Header Logo! Please vote below and let us know if you found this article helpful. We value your feedback. Thanks for being the best part of Kajabi!