shopify-product-image-slider

KO | EN

gitlite — search

#javascript #react #ai #golang #go #linux #docker #java #awesome #kubernetes #awesome-list #security #ios #openai

shopify-product-image-slider

(★ 27)

Implementation of the Slick image carousel into a Shopify store

shopify-product-image-slider 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Image carousel for Shopify product images
There are a lot of out of the box apps for sliders on the Shopify App market but I wasn't able to get one that just took the product images and wrapped them in a simple slider. This implementation uses the [Slick image carousel](http://kenwheeler.github.io/slick/) created by [@kenwheeler](https://github.com/kenwheeler/slick/) into a Shopify store.

#### Reference the Slick css and js files in your theme.liquid file.

```
  <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.css"/>
  <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.min.css"/>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js"></script>
```

#### Create new file called product-image-slider.liquid
In your Shopify theme, create a new snippet called product-image-slider.liquid

#### Reference the new product-image-slider.liquid from your product template
From your product page template(product-template.liquid) remove the contents from ```<section class="primary-images">``` and paste the include statement to the product-image-slider.liquid file.

```
<section class="primary-images">
    {% include 'product-image-slider' %}
</section>
```

*Not all Shopify themes are the same so yours might not have a product-template.liquid file in the sections folder. If that's the case look around for your product page template and insert this new code into that template file.

shopify-product-image-slider

shopify-product-image-slider 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

shopify-product-image-slider

shopify-product-image-slider 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README