Shopify themes, liquid, logos, and UX
Hi to everyone!
I am using the DAWN theme and overall enjoying it quite a lot, with the only problem that I find everything wayyy too zoomed in on dekstop. On mobile it looks great, but the banners are so zoomed in on desktop, it just doesn't look good.
Is there any way to change that?
When searching for Shopify Dawn Theme this pic came out - this is a good example of what I would like it to look like. Just everything to not be so zoomed in.
Here is my handle - https://reussirwi.com if someone wants to check it.
Would be super grateful, I coudnt find anything on the subject.
i have check this its theme on scroll zoom effect some same section use height css element
Hi @Jacquline it's very ambigous what you mean so we have to make assumptions.
If the text is really big on desktop check your browsers zoom, or font size.
For chrome browser https://support.google.com/chrome/answer/96810
If you mean the fly in effect that happens while scrolling on photos that are fullwidth I rather think it makes your website photo's pop very strongly. A lot of jewelry websites have garbage photography where it's faraway wideshots where the focus in on the models(wearing the items) but alot of the time you cannot even see detail on the actual products because they are overemphasizing lifestyle.
Here all the banner photography is very sharp and the products are visualized almost as scale matching a real life perspective as if someone was looking at their own hand.
However some of the product-cards images in the section "An Earring for any occasion ✨" do seem to have some blurriness , but that should probably be addressed by using higher image resolutions for the product image upload.
Contact paull.newton+shopifyforum@gmail.com for the solutions you need
Save time & money ,Ask Questions The Smart Way
Problem Solved? ✔Accept and Like solutions to help future merchants
Answers powered by coffee Thank Paul with a ☕ Coffee for more answers or donate to eff.org
Hi @Jacquline, the blue coloured Dawn theme publicity photo is showing an image made of two separate pictures. There is a small tick box where we can choose to load one or two images to the Image Banner section. Did you find it? If you choose the two image option, you may be able to have a similar banner and effect on your website, which looks very nice btw. All the best!
Thank you for the answers. @SkoorySquirrel @PaulNewton @KetanKumar
What I mean is look at the difference from how the promo image looks and how my website looks when opened on browser.
The banner takes the whole screen and you need to scroll down in order to see something else. I want to make the banner not so zoomed in.
Also if there is a way to add white space in the corners maybe this could be a solution - like on this website -
The banners just get super zoomed in, which makes the quality poorer and also I do not like it when scrolling. I don't think its a good experience for the customer.
I hope I managed to explain good.
Any help would be appreciated.
Hi @Jacquline , thanks for your reply! Just a quick message because I didn't have time to check your website and the images you've posted above - so I may follow up later. I wanted to point that there's now a newer version of Dawn out. Supposedly it offers options to manage the gaps between sections and it may have new options for the banner too. Secondly, there are ways of changing how the banner looks by editing the css coding. We're using Dawn 2.0 still and edited the code to manage the gaps; it's also possible to edit the max-width of the banner via css - though this may slow down the site a little - we did this when we were using the Venture theme (just added max-width and centered the banner). Theoretically it's possible to manage the height of the banner too though I'm not sure how well this would work - need to specify different heights for mobiles and desktops probably...if you enjoy coding or learning to code, this would be something to try. (Of course, always make a copy of the theme as your back up, etc etc.)
Sorry you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community!😊
Thanks for your good question.
Please share your site URL,
I will check out the issue and provide you a solution here.
@Jacquline wrote:The banner takes the whole screen and you need to scroll down in order to see something else. I want to make the banner not so zoomed in.
@Jacquline Do mean the HEIGHT of the banner??
In which case there are many prior discussions and solutions
may want to sort by date though.
I haven't checked in dawn but this may also be addressable by adding a wide/short aspect ratio sized image.
A clunky alternative is to use a custom liquid block and add HTML code of an image with a button that is the specific height your looking for.
you need to scroll down in order to see something else.
High level view - This is about screen real estate, more specifically the "above the fold" content.
If the concern about a slideshow/banner is the amount of content being shown above the fold instead of other priority-content requiring scrolling... then the real answer is to just get rid of the offending banner.
After all in this logic that banner isn't as valuable as it seems given other contents "priority" of access is being impeded just by the simple act of scrolling then get rid of the scroll causing thing. QED.
Contact paull.newton+shopifyforum@gmail.com for the solutions you need
Save time & money ,Ask Questions The Smart Way
Problem Solved? ✔Accept and Like solutions to help future merchants
Answers powered by coffee Thank Paul with a ☕ Coffee for more answers or donate to eff.org
Hello,
Did you ever find a solution to this problem. I reached out to Shopify and they told me it can be fixed with custom code and then left me in the dark... what bothers me is its just a png in a banner, looks find in the build area but as soon as you preview its massive. Its killing me.
Did we ever learn how to fix this issue?
Hi, @Laurala 👋 there's no "fix" because the poster never actually adequately explained what they think "zoom level" means.
It could be they just didn't know how to use the settings, or their media isn't properly formatted, or didn't bother to search through link of height fix questions etc etc ad nauseum.
Contact paull.newton+shopifyforum@gmail.com for the solutions you need
Save time & money ,Ask Questions The Smart Way
Problem Solved? ✔Accept and Like solutions to help future merchants
Answers powered by coffee Thank Paul with a ☕ Coffee for more answers or donate to eff.org
No Paul, you don't understand what she's asking. The banner image photos look much more zoomed in on desktop vs mobile. Even on mine when you look at a picture on mobile you can see the whole picture, but on desktop, it is much more zoomed in and you can't see the whole photo. Look at this link here on your phone vs computer https://theurbanmangoz.com/collections/beige-bliss
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