Customized Multicolumn with Video Option

Customized Multicolumn with Video Option

Log in or Sign up to ensure access to purchased code across multiple devices.

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: All  Shopify 2.0 FREE themes  themes only. Works from lower version to version 11

We customized the multi-column that would have a pop up to display more related images. You will need to create a page and upload your images. 

You can check the demo store here. Password: made4uo

Customized Multicolumn with video option

What you are buying:

  • Modified multi-column that has a pop-up
  • Pop-up will be from a page link
  • Able to add a video instead of image
  • Autoplay and hide controls available options for video
  • Options to have different image ration in every block

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. Create a page. From your Admin page, go to Online store > Pages > Add a page

2. The title of the page will be used as your page link but this will not appear in the customized multi-column. Add the images in the content area by clicking the "insert image" icon, and make sure to click SAVE.

3. We need to edit the code of the theme. From your Admin page, go to Online store > Themes > Actions > Edit Code

4. Under the section folder, create a section, you can name it whatever you want.

5. Replaced the default code with the code below. Then click SAVE


6. Next, go to the Asset folder and open the global.js. Then paste the code below at the very end of the file. Make sure to SAVE.


7. To add this section to your template. Click the three dots on your top left hand corner, then "Customized Theme"

8. Add a section, and look for "Customized Multicolumn"

Copied!
Back to blog

Leave a comment