Shopify themes, liquid, logos, and UX
Hi I've tried with several different solutions from other community members but didn't seem to work out for my page.
I'm looking to center the logo in the header on my shop. https://ytems-se.myshopify.com
As well as remove the hamburger icon for the mobile version. It's strange because it's gone from the desktop but not mobile.
Any help is really appreciated!
PW is: jotwau
Hi @Ytemsstore, the first thing you need to do is undo all the changes you made which didn't work for you like the hamburger menu.
In your timber.scss file, add this CSS at the end of the file:
.site-header .grid--table>.grid__item {
width: 100%;
}
@media only screen and (min-width: 750px) {
.site-header__logo img {
margin: 0 auto;
}
}
Hi @g33kgirl, thank you so much for you reply!
I tried with what you suggested- but it didn't seem to work.
Do you have any more suggestions?
@Ytemsstore I checked your website. The code itself works but because the menu is hidden, it's not pushing the logo image to the center. Can you undo the hamburger menu code which you tried which you said you want to display on desktop?
@Ytemsstore please see screenshot:
@Ytemsstore the other solution (actually a hack) is through code (modify at your own risk).
Go to Edit code -> Sections -> open header.liquid and change line 140-142 from:
<h1 class="site-header__logo large--left" itemscope itemtype="http://schema.org/Organization">
{% else %}
<div class="h1 site-header__logo large--left" itemscope itemtype="http://schema.org/Organization">
To:
<h1 class="site-header__logo large--right" itemscope itemtype="http://schema.org/Organization">
{% else %}
<div class="h1 site-header__logo large--right" itemscope itemtype="http://schema.org/Organization">
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024