FROM CACHE - en_header

Help with slideshow

Betenics
New Member
4 0 0

Hello all,

I am having a problem with the slideshow doesn't showing properly on phone.

I know it's about design, but is there some code I can change so it fits on phone exactly like on pc?

Thanks

store is www.betenics.com

Replies 5 (5)
brandography
Shopify Partner
75 15 12

Hello! I can take a look into this, what theme are you using on your store? Will the slideshow have multiple photos? I'm only seeing the one right now. 

Find a Powerful eCommerce Marketing Partner


Let Brandography help you spread the word about your products through cutting-edge eCommerce web design, strategic sales channels, and expert digital marketing tactics.
Check out our website
Betenics
New Member
4 0 0

Hello, I am using Brooklyn theme.

It will have just one photo that is displayed

brandography
Shopify Partner
75 15 12

So it looks like the image just gets stretched on mobile, which makes the text that appears in the image to also look stretched. There are other themes that allow you to select a different image specifically for mobile that prevents things like this from happening, but you should know that it's not best practice to write text in an image. Search engines will not see text on images and that could hurt your ranking. My advice would be to choose a different section type such as Image with Text inside of your current theme so that you can somewhat recreate this look while also having hard coded text. Good luck!

Find a Powerful eCommerce Marketing Partner


Let Brandography help you spread the word about your products through cutting-edge eCommerce web design, strategic sales channels, and expert digital marketing tactics.
Check out our website
diego_ezfy
Shopify Partner
2809 531 745

@Betenics 

Unfortunately that is a known issue with the Brooklyn theme and most of the free theme sliders, they were not coded with a mobile-first approach. There isn't any sort of coding that could easily fix that. It would require to re-build the slideshow section, which, in my opinion, is rarely worth it financially.

With that being said, there are copy/paste Slideshow sections like this that can be a cheaper (yet professional) alternative.

This would fix the problem you're facing, give you much more customization freedom and also work with any stores/themes you use in the future. Perhaps it could be a viable solution.

Kind regards,
Diego

Don
Shopify Staff
Shopify Staff
2281 159 304

Hi there @Betenics!

 

I can see you've already got some feedback on your query here from our fellow Community members, that's great!

 

I also took a look at your store to check this out, though it was not immediately clear which section was the slideshow (as there may be just one image in place).

 

That said, I can confirm some of the info shared here on how slideshow images like this are coded and how to work with them in order to get the most out of them.

 

Check out some general tips for using the Brooklyn theme here, including info on recommended image sizes.

 

Because the size and shape of the slideshow are dependent on the size and shape of the customer's device, your slideshow images will be cropped on some screens. Try to use images that have a focal point in the middle so that the important part of each image is always visible.

 

There's more info on working with the slideshow section here you can check out.

 

Try using a few different devices with different screen sizes to test out any images you're looking to use in your slideshow, to see how they appear when cropped differently in this way.

 

Finally, for now, I'd recommend this article from our Partners blog, which goes into depth on combatting image cropping.

 

Can you tell me a bit more about what stage your business is at?

 

Are you building out a store for an existing business to sell online, or is this an entirely new venture?

Don | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog