If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)

captcha

Shopify. How to change slider dimensions

This tutorial will show you how to change slider dimensions in Shopify template.

Shopify. How to change slider dimensions

  1. Log into your admin panel and navigate to Themes option.

  2. Click on Customize Theme button.

  3. Our new images were created with 570px width and 322px height. Original images have 1170 x 450px.

  4. We are not going to use the third slider image in this example, however, please note that you need to have all your images with the same size.

  5. Save the settings by clicking on Publish changes button:

    shopify_slider_size2

  6. Go to Themes -> Edit HTML/CSS option.

  7. Click to select widget-nivoslider.liquid file under Snippets:

    shopify_slider_size3

  8. Insert the following div under:

    <div class="container">
    	<div class="row">
    
  9. Depending on the desired slider size, we will insert the following div into the

    <div class="row">
    	<div class="col-md-9">
    
  10. To make it bigger or smaller, increase or decrease the col-md- value, for example:
    <div class="col-md-6"> or <div class="col-md-12">

  11. Don’t forget to close your newly added divs by adding closing div tags at the end:

    	
    	</div>
    </div>
    

    shopify_slider_size4

  12. Click on Save button to save your changes. Reload your page to see the changes.

This is it. Now you know how to change slider dimensions in Shopify. Good luck!

Feel free to check the detailed video tutorial below:

Shopify. How to change slider dimensions