Issue with code - HELP!

Highlighted
New Member
2 0 0

Hi,

I've been working on my website and had been trying to centralise the logo in the header. 

Unfortunately while trying to do so I seem to have messed up and if you click on www.themovementlabpreston.co.uk - you will see at the bottom some code coming up. 

Any idea how I can get rid of this?

Theme = Venture 

Thanks,

Rich

0 Likes
Highlighted
Globetrotter
567 81 102

Hello,

The code below will center the logo:

1. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)

2. paste this code right above the </body> tag:

 

<style>

@media (min-width: 750px){
    .site-header .site-header__upper .grid{
    display: flex !important;;
    flex-direction: column-reverse !important;;
    width: 100% !important;;
    max-width: 100% !important;;
}

.site-header .site-header__upper .grid > div:nth-child(2){
    display: block !important;
    text-align: center !important;
    width: 100% !important;
}

.site-header .site-header__upper .grid > div:nth-child(3){
        display: block !important;
    padding-top: 10px;
    width: 100% !important;
}
}
</style>

 


To remove the code at the bottom it would require a Shopify developer analysis to find where the issue is.

Let me know whether the code works, though. 

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers, read what they wrote about my work clicking here.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
New Member
2 0 0

Thanks Diego, worked wonderfully. 

Any idea if I can reduce the padding above/below the logo? OR, increase the size of the logo slightly?  

Rich

0 Likes
Highlighted
Globetrotter
567 81 102

Hey, 

Ideally you should edit your image in Photoshop or any software to remove the black space inside of it instead of fixing it with code.

As you can see, when I open the image on a new tab there's a lot of black space inside the logo:

dantepw_1-1596361536823.png

After editing it out with an image software the padding issue will be naturally gone. 

Please press the button "accept as solution" if my answer helped you out. 

Thank you very much!

Kind regards,
Diego

 

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers, read what they wrote about my work clicking here.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes