Image Carousel Section

Image Carousel Section

How to see the code

1. Please log in/create an account first. This is to ensure that all purchases are connected to an account and can be viewed on different devices.

2. Purchase the code using the "purchase box" on the specific page of the desired code.

3. After the purchase, please refresh the page.

Compatibility: Compatible with all Shopify Themes.

Images are very important in a website. Presenting the images in the right and unique way is also crucial to provide a very good impression to customers. 

You can check the demo store here. Password: made4uo

If you want simpler designs for your image gallery, you can check this code gallery section here and for multiple image gallery here.

 

What you are buying:

  • Image carousel that can be scrolled horizontally using a mouse wheel
  • Show/ hide  previous and next button 
  • Able to swipe on mobile
  • Tooltip added to help customer navigate / use the section
  • Upload multiple images (this might affect the loading time)
  • Apply image filters to every image, even apply it to the flipped image
  • Works on any image ratios

What makes our code better:

  • We do not use external libraries, with that being said, our code will have no to minimal effect to your website's speed performance
  • We do not leave or add codes use to advertise for our website
  • Our code is mobile friendly

Any issues related to the code will be fix with no additional cost, excluding code customization requests. Simply contact us with "Chat with us." We are just a button away. 

To start:

1. Go to Admin Shopify store > Themes > Actions > Edit Code

2. In Section folder, create a new section. You can name whatever you want.

3. Replace the default code with the code below. Make sure to SAVE.

<

 

4. We need to add the javascript code, go to the Asset folder. Find the global.js or theme.js, or your main javascript file, depending on the theme. 

5. Add the code below at the very end of the file, then click SAVE.

<

 

6. Add the section using the Theme editor. Find the "Carousel images" section.

 

That's it (",)

Copied!
Voltar para o blogue

Deixe um comentário