how to reduce size of slider image on homepage

Solved
Excursionist
38 0 3

i want to resize my slider on home page to height :1700px * width :500px , coz its way too large and occupying alot of space and want to add dots instead of arrow on slider. how can i do it ?

 

Untitled.pngtoo much width

 

 

screenshot-www.walmart.com-2019.11.12-16_41_05.pngi want these instead of arrow

0 Likes

Hello ,
Please share your site url.
So that i can check and provide you exact solution here.
You are  working on which theme.

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Custom Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Digital Marketing | Site Speed Optimization | Web Development
0 Likes
Shopify Expert
656 162 195

Hi, @rads091 ,

This is Evita from On The Map.

 

What theme are you using?

 

Best,
Evita

On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
0 Likes
Excursionist
38 0 3

@OTM @oscprofessional i have messaged you 

1 Like
Shopify Expert
656 162 195

Are you sure you want height: 1700px and width: 500px not the other way around?? It will look like this: https://prnt.sc/pvxr7h

 

On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
0 Likes
Highlighted
Excursionist
38 0 3

@OTM sir , basically i m looking for slider image as size of walmart , 1700x500 approx 

thanks for replying.

Untitled.png

0 Likes
Shopify Expert
656 162 195

Add this code:

.homepage-slideshow {
    width: 1700px;
    height: 500px;
    overflow: hidden;
}
On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
0 Likes
Excursionist
38 0 3

@OTM thank you sir, it worked ,but looking offscreen, how to set slider screen fit in the middle and optimized for mobile coz on mobile it is still displaying in 1700x500 px.

 

download (1).pnghow to set the screen fit in the middle and optimized for mobile coz on mobile it is still displaying in our corrected ratio.

0 Likes

Success.

Shopify Expert
656 162 195

Add this then:

@media only screen and (min-width: 749px){
  .homepage-slideshow {
      width: 1700px;
      height: 500px;
      overflow: hidden;
  }
}
On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
1 Like