How to change logo URL in Colours theme?

Store Design
, , , , , , , ,
1

Hi there!

We want to link our logo to a different URL.

To provide some context, we have actually turned shopify’s default homepage template into a landing page, and created a new page as the homepage.

We managed to figure out the coding to remove what we need from the default homepage template such as the header and footer, but we’re stuck with figuring out how to link the logo to a different url since pressing it will lead us back to the landing page (which is essentially the default homepage).

We want to link the logo to our NEW homepage. Since the Colours template seems to not have the same coding lines as most tutorials provide, we are struggling to find a solution to what we want to achieve. Any help would be greatly appreciated.

website url: luckyhand.world

1 Like
2

This can be done using custom coding just a small change can be made to you header file to ensure this. The following steps are best suited for Shopify Dawn Theme if you are using some other theme the steps might change according to theme.

  • First go to online store >>>
  • Find your Theme on the list >>>
  • Click the three dots (…) and then click edit code >>>
  • Search header.liquid or header-group.liquid >>>
  • In that liquid file search {{ routes.root_url }} and replace this with /pages/new-home-pag
  • After this your header logo should redirect you to /pages/new-home-page page.
3

Hi @luckyhandworld There are 2 ways to do that, you can do it.

  1. You can do it with editing the logo code in the theme and you will find the href which is connected to the route URL, you just need to update that and then it will link it to the new home page.
  2. You can do it with the help of javascript code, if you don’t want to edit the default code of the theme then you can achieve it with the help of javascript code, you can target the logo element and then change the url, and add that code in the theme.liquid file.

If you will unable to implement the same then I’m happy to do this for you, let me know. I can implement the code changes so that this will work well for you.

Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!

Best Regards

Sahil

4

hi there,

Thank you for your reply!
is the href located in header.liquid or theme.liquid? ive tried working with all the h ref within header.liquid and it still didnt work

5

Hi,

Thank you for your reply, i’ve tried that but as mentioned above, my theme template does not have {{ routes.root_url }}
any way i can solve this?

6

Hi @luckyhandworld Yes correct it is in the header.liquid, have you tried to change it? if yes and still it is not working then this code should also be presented in some other file in your theme. You need to find that. Can you please specify which theme you are using?

Best Regards

Sahil

7

another way would be to create script tag in theme.lqiuid file and add this code it would work properly.

document.addEventListener('DOMContentLoaded', (event) => {
    document.querySelector('a.logo[href="/"]').addEventListener("click", (e) => {
        e.preventDefault();
        window.location.href = '/pages/new-home-page'
    })
});
8

im using the theme called Colours. Ive tried working with ALL of the a href codes in header.liquid but it only worked for the hamburger side menu. i cant seem to find where the logo route link is located at.

9

thank you, do i add it at the bottom of the file? or is there a specific place i should place the code at?

10

Hi @luckyhandworld ok if it is not working then you can try adding this code.

Please follow the steps:

  1. Login in shopify admin.
  2. Click on the Online Store.
  3. Then click on the button next to Customize in live Theme.
  4. Click Edit Code.
  5. Search theme.liquid in the code in left hand side in your theme.
  6. Add the following code in the bottom of the file above tag

Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!

Best Regards

Sahil

1 Like
11

Thank you so so much! it worked :slightly_smiling_face: