Skio Universal Plan Picker V1: Liquid, JS, CSS support

This documentation is specifically for assisting existing merchants / stores who have the following files in their theme codebase:

• snippets/skio-plan-picker.liquid
• assets/skio-plan-picker.js
• assets/skio-plan-picker.css

Important: if you do not have these theme files already in your Shopify Theme codebase, please refer to our Skio Universal Plan Picker v2 documentation: https://help.skio.com/hc/en-us/articles/21063912234779-Skio-Universal-Plan-Picker-V2-Lit-JS-Component .

V1 of the Skio Universal Plan Picker utilizes Shopify's Liquid for server-side processing of all values prior to page load (snippets/skio-plan-picker.liquid), as well as a separate JS file (assets/skio-plan-picker.js) to manage post-page load interactions with the element. All CSS styling can be found in the assets/skio-plan-picker.css file.

None of the plan picker code is out of reach! The javascript is not loaded in the {{ content_for_header }} or hosted on our servers. You have complete control to make the changes you want within your theme codebase.

Documentation

Documentation for each of these files can be found below:

snippets/skio-plan-picker.liquid (Liquid) : https://integrate.skio.com/skio/manual-theme-setup/plan-picker/liquid-skio-plan-picker.liquid

assets/skio-plan-picker.js (Javascript) : https://integrate.skio.com/skio/manual-theme-setup/plan-picker/javascript-skio-plan-picker.js 

assets/skio-plan-picker.css (CSS) : https://integrate.skio.com/skio/manual-theme-setup/plan-picker/css-skio-plan-picker.css