My Youtube go here Mehedi Edix Subscribe!

What are You looking for?

How to Add Before & After Slider in Shopify

Please wait 0 seconds...
Scroll Down and click on Go to Link for destination
Congrats! Link is Generated

 

Add Before & After Slider in Shopify
Add Before & After Slider in Shopify

How to Add Before & After Slider in Shopify?

Do you want to create a professional Shopify store? Then you land on the right article. In this lecture, we are covering about how to add before and after slider in Shopify. But if you have investment, you can contact me on WhatsApp (+923176186400). I make a complete & Professional store for your future business.

Let's talk about our topic, so this slider is used to show the customers how the product looks before and after. This section on your store makes the customer more engaging. We use some custom liquid to make the after and before slider for Shopify store.


This type of after and before slider used in single product store, but you can use this on both single or multi product store. After applying this section, the sales of your product increase automatically. 

Is this code responsive?

Yes, this code is 100% responsive and mobile friendly. It works on both PC/Laptop & Mobile Screens. There are three option in this code, you can select manually where you want to show the slider. 

  • Mobile
  • Desktop
  • Both

How to add before and after slider?

Follow the given steps one by one to apply this before and after slide effect in Shopify store.


  1. Log in to your store.
  2. Go to theme section.
  3. Click on 3 dots.
  4. Click on edit button.
  5. Go to theme. Liquid option.
  6. Copy header code.
  7. Paste below the <head> tag.
  8. Save the code.
  9. Scroll & Open Section Folder.
  10. Click on “add new section” Button.
  11. Enter File Name & click on Save.
  12. Copy After & Before code.
  13. Paste in new file & save.
  14. Go to customize.
  15. Add before & after slider section.
  16. Add images (before & after).

So here are some basic steps you need to follow to add before and after slider in Shopify. Here is the code button below. Click on the below download button to get the custom liquid code.



If you still face issue to apply this code, then watch the below video for better understanding. The video is available in Urdu/Hindi language only.

إرسال تعليق

Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.
NextGen Digital Welcome to WhatsApp chat
Howdy! How can we help you today?
Type here...