Shopify themes, liquid, logos, and UX
Hello,
I have a very simple store I'm setting up for a friend. The preview link is below. The issue I'm having is that my background image doesn't show up on mobile even though I tested it in the browser with mobile sized screen in the dev tools. All desktop browsers work exactly as I want, but on the actual phone the entire top banner is just blacked out, no image, no welcome message.
I'm using the dawn theme and shopify CLI. I've made minimal changes to the code.
I greatly appreciate any and all responses.
hello @spracto please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file. for showing welcome message in mobile devices see screenshot https://nimb.ws/Zoz6D7
@media only screen and (max-width: 729px){
#Banner-template--14861211009189__image_banner{
position: relative;
}
#Banner-template--14861211009189__image_banner .banner__content.page-width{
position: absolute;
top: 50%;
}
}
I don't have the file "theme.css" in my assets folder but the CSS for the section in my question is "section-image-banner.css" so I went ahead and added the code you provided there. The banner does show up but I'm still missing my logo. Also now the banner is on top of the logo when I'm on desktop.
I changed the "top" attribute to 80% and that moved the banner down enough to where it's out of the way now. Logo still doesn't show up on my phone though.
It should look like this on mobile:
It doesn't look like a logo and a banner have been uploaded to the theme, at least not at the moment in the preview link. If you are still having problems, then try uploading them and post the preview here again please
What's odd is the logo shows up for me in the preview when I'm logged in but not when I pull up the preview in an incognito window. I re-uploaded it, no difference.
I'm very confused what is determining whether the logo shows or not...
https://y10v3g20g2ux5aj9-57530089637.shopifypreview.com
@spracto - i can see logo in both normal and incognito mode
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024