Shopify themes, liquid, logos, and UX
If some one could please help me Change the colour of the collection heading for Collection pages in prestige theme.
Here is a link to my two collection pages at the moment what i would like to do is make the header on this page black. https://danieljameslondon.com/collections/daniel-heart
and the header on this page white
https://danieljameslondon.com/collections/for-lions-for-life
if possible
Many Thanks DJ
Solved! Go to the solution
This is an accepted solution.
Hey @DJLondon1959@DJLondon1959,
I hope you're doing well! Certainly possible.
1. From your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:
<script>
function headerColorChange(){
const url = window.location.href;
const colorDanielHeart = `#000`;
const colorLions = `#808080`
const $header = document.querySelector(`x-header`);
if (url.includes(`collections/daniel-heart`)){
$header.style.backgroundColor = `${colorDanielHeart}`;
}
if (url.includes(`collections/for-lions-for-life`)){
$header.style.backgroundColor = `${colorLions}`
}
}
headerColorChange();
</script>
You can change the hex color as per your wish.
If it helps you please click on the "like" button and mark this answer as a solution.
Thank you.
Kind regards,
Diego
This is an accepted solution.
Hi Diego
Thank you so much for helping me out with this problem
You’ve done a fantastic job.
All the best,
Regards Daniel
This is an accepted solution.
Hi Diego
i am not sure if this is the way to contact you but hopefully it is.
Thank you for the last script you sent me it was perfect.
I was wondering if you could please advise me once more is it possible to do the same again.
But this with the footer.
Any help would be amazing
all the best Daniel
This is an accepted solution.
Hey @DJLondon1959@DJLondon1959,
I hope you're doing well! Certainly possible.
1. From your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:
<script>
function headerColorChange(){
const url = window.location.href;
const colorDanielHeart = `#000`;
const colorLions = `#808080`
const $header = document.querySelector(`x-header`);
if (url.includes(`collections/daniel-heart`)){
$header.style.backgroundColor = `${colorDanielHeart}`;
}
if (url.includes(`collections/for-lions-for-life`)){
$header.style.backgroundColor = `${colorLions}`
}
}
headerColorChange();
</script>
You can change the hex color as per your wish.
If it helps you please click on the "like" button and mark this answer as a solution.
Thank you.
Kind regards,
Diego
This is an accepted solution.
Hi Diego
Thank you so much for helping me out with this problem
You’ve done a fantastic job.
All the best,
Regards Daniel
This is an accepted solution.
Hi Diego
i am not sure if this is the way to contact you but hopefully it is.
Thank you for the last script you sent me it was perfect.
I was wondering if you could please advise me once more is it possible to do the same again.
But this with the footer.
Any help would be amazing
all the best Daniel
As 2024 wraps up, the dropshipping landscape is already shifting towards 2025's trends....
By JasonH Nov 27, 2024Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024In today’s interview, we sat down with @BSS-Commerce to discuss practical strategies f...
By JasonH Nov 13, 2024