How to vertically center logo on homepage

Store Design
, ,
1

I’m trying to vertically align my logo on only the homepage. I learned it’s possible to hide the logo on the homepage by adding the following code before the tag in the theme.liquid file.

Show More

{% if template contains ‘index’ %}

[details=Show More]

Show More

.header-wrapper {

Show More

height: 0px;

Show More

}

Show More
Show More

{% endif %}

However, I’m not sure if there is a way to center the logo vertically on the homepage. I’d also like to adjust the size on the centered logo. I’m familiar with HTML and CSS, but new to liquid. Any suggestions?

Untitled-1.jpg
Untitled-1.jpg1920×996 293 KB

I’ve included this image so you can see what I’m going for here. Are there any liquid experts out there that can help?

1 Like
2

Thanks for your reply. Where does this code go?

3

Hi @thrette ,

This is Victor from PageFly - Landing Page Builder App

Following code before the tag in the theme.liquid file.

{% if template.name=='index' %}
.logo-bar-section {
    max-width: {{ section.settings.logo_width }};
    display: inline-block;
    margin: 0 27.5px 35px;
    text-align: center;
  }

{% endif %}

Hope my solution works perfectly for you!

Regards,

Victor | PageFly