Swatchify

BACK

Lightspeed eCom Color Swatch App: Color Swatches App Management

welcome to the color swatches app video,tutorial for Lightspeed eCall in this,video we're going to show you how to,manage your products color swatches via,the apps admin interface we're starting,here on the ad vision app login screen,so this assumes you've already installed,the app and created your ad vision app,account I'll be using example sites,account in this video,once logged in click on the color,swatches app link under your shop that,you want to work with you'll see we have,other apps installed in this account,you'll have at least the catalog clone,app but you may or may not have the,product images app the product images,app is not needed for you to use the,color swatches app so we'll click on,color swatches to get started you'll see,the default view here is going to list,any products in your Lightspeed catalog,I'm going to search for the product I,want to work with in this tutorial we,can see the product I was looking for,here and see that it is currently,visible in the webstore and has no,swatches set up yet in this app to,manage swatches for this product we just,click on the products title this will,load any options you've set up in your,EECOM catalog for this product so for,this product we can see we only have the,one option that's been set up it's,called color within the option we can,see the color values or selections that,have been set up the jeweled rainbow,mid-century modern and rose quartz if we,go to the product on the front end of,the webstore we'll see those colors,match up with the color options here in,the color select menu for the product,this select menu is what the color,swatches will control once we set up the,swatches for this product so to set up,swatches for this item we have two,options for each option value first if,you want just a solid color to represent,the option value you can select a color,from the color selector,so for example we can select to set this,up as just a purple swatch this saves,you from having create images and,uploading them into the app however most,of the time you're going to want a more,exact representation of the option value,so you want to upload an image that,shows what this color option value,actually looks like so let's clear this,about this color selection that I just,made and instead let's select an image,that better represents this option value,you'll see when I upload the image the,system displays a square thumbnail here,this isn't the swatch that will fill on,your site it's just how the app admin,will show a representation of the image,it is important to note when preparing,your image swatches the max width for,images uploaded into this app is 150,pixels so when preparing my images I,saved them at 150 pixels wide exactly if,you upload larger images they will be,sized down but it's highly recommended,that you size your images before,uploading and make sure their DPI does,not exceed 96 though 72 is fine as well,and that you've optimized the images for,web if you're not sure how to opti

The above is a brief introduction to Swatchify

Let's move on to the first section of Swatchify

How to Solve 'Not Working Color Swatch' on Your Product Page | Inkybay Product Customizer

hello welcome to incubate today we are,going to show you an issue we are,getting the color swatch which is not,working we will also show you how you,can solve the issue so let's get started,first let me show you the issue this is,the demo product and this is the color,swatches you can see so the issue is,when I click on any color the swatch,doesn't change see this watch is not,changing the image although the image is,still zooming but it is not changing so,now let me show you how equals of the,issue you need to open the inspector,tool from your browser you can simply,right click and select inspect to open,the inspector tool not just the element,beaker click on the image now we need to,find the image ID for this scroll up a,bit there is the image ID double click,on it copy the image ID go back to the,inky bf admin go to settings then,general settings now scroll down and,find product page color view settings in,the product image ID class fee now in,now improv image auditor class field,will simply test that copied code but,before testing you need to type ID,underscore ask the code is from the,image ID now I am showing you how you,can do it click on the field type ID,underscore see you paste the code now,save the settings go back to the power,page and reload the page let's check the,swatch,Swach is working perfectly but the,zooming is not working so we need to fix,that as well to the element picker again,click on the image now I need to copy,image class and set up the ID here in,the class we need copy tilt feature or,underscore image we don't need practice,feature image so select the code copy go,back to the settings now we will use,comma to separate the course now without,using space simply type CL underscore,and press the code we are using CL,instead of ID because the code is from,the image class instead of the ID now,use comma don't save it right now let's,go back to the torque wrench now we need,to copy another image class scroll down,a bit in the image role section find the,classroom IMG copy the class go back to,the settings now CL underscore again at,first it save the settings go back to,the product page and reload the page so,let's first see if the swatch is working,watch is working well and now see if the,zooming is what,that is solved so this is how you can,solve image swatching on your product,page just for today see you in the next,video

After seeing the first section, I believe you have a general understanding of Swatchify

Continue the next second section about Swatchify

How to Increase Your Shopify Conversion Rate for Your Clothing Brand

hey guys christian here and today i'm,going to show you a few ways you can,increase your conversion on your shopify,store let's get started,optimizing your online store isn't a,one-and-done solution for e-commerce,it's an ongoing process that will help,you constantly learn more about your,audience and how you can,better serve them right it's not about a,tactic with an endpoint it's something,that you should always be doing to get,better alright so the number one thing,that you need to do is improve,performance and site speed when your,site crashes during high volume shopping,days like black friday or your mobile,site takes more than a few seconds to,load you run the risk of losing your,customers attention and loyalty in fact,79 of customers who report,dissatisfaction with website performance,are less likely to buy from that site,again slow pages are the number one,issue that angry mobile users complain,about ranking even higher than site,crashes there are many ways to reduce,the page load time,on your ecommerce site including,compressing and reducing file size,images decreasing the amount of apps,that you use and minifying and improving,the html javascript and css,we actually made a video on how to,increase website speed on shopify you,can check that out right here,before we get to number two i just want,to say welcome to everyone new my name,is christian pinon one of the,co-founders here at their branding we've,been helping frustrated store owners,since 2015 become impactful store owners,tutorials tactics and strategies and the,number one way that you can support our,channels by hitting that subscribe,button turning on notifications please,do it we love you all right the second,thing you can do is make the site search,work flawlessly visitors who use on-site,search are 1.8 times more likely to,convert and can generate as much as 14,to 40 of your store's overall revenue,why do site searches converse so well,well to begin with it's likely that,shoppers who use site search exhibit an,intent to buy right so once this intent,is put into words shoppers are led,quickly to what they need often this,means that they're not necessarily,shopping for a button shirt they're,actually interested in products that,meet my more narrowed down description,such as a red hooded flannels or sail,button down plaid blue shirt get it so,make sure that you have a good search,solution for your store all right and,coming in at number three is to use high,quality images and copy considering that,people can't touch or try on your,products online you need to work twice,as hard to make your products come alive,via excellent photography graphics and,description you can't rely on stock,photography or small uninspiring product,photos to convince your customers to buy,something we actually made a video on,how to write better product descriptions,you can check that out here as well and,the fourth way to increase conversion,rate is to hit that like button just do,it all kidding aside,

After seeing the second section, I believe you have a general understanding of Swatchify

Continue the next third section about Swatchify

Shopify Color Swatch

if you want to add colors which is,exactly like this product you need to,open this image in a paintbrush let me,open that image I have that image,already downloaded I'm just opening it,with paintbrush okay,from paintbrush I need to select this,one and select any area of this dress,which you want to display over there,size should be 40 by 30 you see below,dress you will see that the size should,be 40 by 30 okay I'm going to copy this,I'm opening new window new I am testing,over here otherwise ah,first I'm using the exit size like 40 by,cutting and pasting over here the size,is 40 by 30 PX okay now I'm going to,save this,this color is like blue strip,okay now I'm going to open this product,in an admin area the product name is,Sanjay races okay,and now I am going in a product,from products,searching the product okay before that I,need to go to sells channels and online,store and Tim's and from here there is,three buttons over here I need to upload,my picture which I have taken from,paintbrush and it to click on edit HTML,there will be assets you need to click,on assets here you need to click on add,new asset from here you need to select,that blue strip upload assets you have,to be sure about name you have used over,here you just copy that name now go to,that product and go to the variant click,on a new variant suppose I have a small,size and this color I I write small,alone material is this one last pick Sun,gate code run it hotter,I've used the color name which I have,saved with my image name exactly same,name I've added in a small size only I,guess you have used as instead of small,I need to use s,okay let's check over here,it is here same okay,you

After seeing the third section, I believe you have a general understanding of Swatchify

Continue the next fourth section about Swatchify

SalesHunter theme Tutorials | Video 5: Set up Product variants and Product Swatches

hi everyone welcome to another video on,the sales hunter tutorial series in this,video we'll learn how to add and the,jobs the product swatches on the product,page after logging in to shop by admin,on the Shopify panel go to products all,products you can choose a product to,create a new product,or click on any product on the list to,edit on the product configuration page,scroll for the very intersection choose,add variant,then insert the option names and option,values for example with size variant,continue adding the option name and,option value,product variants are updated accordingly,you can edit the price for each product,variant if needed,then save all the changes after saving,here is a product variant section you,can click on the image thumbnail to,change the product variant image not,only can you choose the uploaded product,images you can also add a new image for,the variant by choosing edit you can,adjust the specific settings for each,product variant for example choosing a,variant quantity as 0 to show it as out,of stock,after you've done the adding product,variance process go to online stores and,select themes choose customize,directing to the product page which was,edited recently on the top bar the page,is showing product page as you can see,the product variants are not displaying,in the drop-down menu option by default,of Shopify go to the theme settings tab,click on the product color swatches,section if you want a variant display on,which type enter the variant name on,this option separate the variant option,name with a comma,for example inserting color to display,this variant with color swatches type,continue with society's variant on,material variant,as you can see here the three variants,are displaying in three different types,the size 36 is displaying the cross,since we chose this variant as out of,stock in the settings when choosing,different variants the product Imogen,tries to change accordingly sales humper,theme also supports three different,styles for swatches what you're seeing,now is circle style now changing to,square style and here is a result for,the last swatches style the swatches,will appear as square for color and,image swatches,but with label swatches it shows as a,rectangle and is responsive to the,variant text length this is super useful,if you have the long option name for,example material variant as you can see,here changing the rectangle style the,variant is not showing great,when you're done don't forget to save,your changes now your product page is,displaying beautifully with the product,swatches,once again thank you so much for,watching guys as always let us know if,you have any questions and stay tuned,for more videos on how to work with,sales hunter the best converting Shopify,theme

After seeing the fourth section, I believe you have a general understanding of Swatchify

Continue the next fifth section about Swatchify

Collection Swatch Pug

hello guys I hope you are having a very,good day I'm on deep and I'm going to,demonstrate you the usage and,functionality of the collection search,bug app so let's start this is the desk,tour and I have uploaded a couple of,products on this store as you can see,this is the home page and we are viewing,the featured collections on all the,other stores the default collection page,thumbnails are only able to show one,product image so while the customer is,on collection page or is viewing the,featured collection on home page they do,not know how many color options a,particular product they are viewing has,for some of the customers they are very,particular about the colors and if they,do not like the colors of the product,that you have status main image there,are chances that they will not buy the,product just because they did not know,that there were other color options,available for the same product so there,is a huge benefit of showing all the,available color options or patterns on,the collection page itself because,instead of jumping to each product page,just to check the available variants the,customer will be able to quickly view,the product images for all the available,variants which helps them to buy a,product in much less time and it,improves the overall buying experience,of the user right you can and the user,can select and see the images for all,the available colors,and once the user has decided which,variant to buy they need to click on the,product and they will be taken to the,product page so for example if the user,wants to buy this color combination in,the black and red they click on the,product and they are taken to the,product page with with the desired,variant already selected so they all,they all they need to do is add to cart,and they will buy the correct variant,they that they wanted to buy let's go,back to the home page there are three,types of color patterns or colors that,can be uploaded to the app first is a,single color for example your product,has only one color so you can add a,single color like red or orange or any,other color and the second is if the,product has a dual tone color like for,the for this product two color options,can be added to the same variant black,and red blue and green and the third,option is if the color has a pattern in,it like this jacket has a variety of,camouflage patterns so you can add,different patterns for different,variants black camel green pink camo,right,let's now go to the admin section and,see how these images these patterns can,be changed by the admin section so here,it is the admin section first of all the,all the process is very easy and has,been divided into three simple steps,first option is to select the option to,use for image stretches on the,collection page or featured which,featured collection on home page these,are the three options and you have to,select one of them this what this,basically does is for example product,has three options using which different,variants are created

Congratulation! You bave finally finished reading Swatchify and believe you bave enougb understending Swatchify

Come on and read the rest of the article!

I am a shopify merchant, I am opening several shopify stores. I use ppspy to find Shopify stores and track competitor stores. PPSPY really helped me a lot, I also subscribe to PPSPY's service, I hope more people can like PPSPY！ — Ecomvy