Shopify Theme Customization 10 Hidden Features

Key Takeaways

If you use Shopify daily, like I do, you are going to love this video. In this video, I'm going to show you 10 Shopify features that's going to make your work more efficient and more fun. But not only that, it will also help you to save time and give you more control over your store without any coding. So, let's get started. The first feature I want to talk about is the ability to use AI to change sections within your theme. And this is a new feature. In order to access this feature, you just need to go to your theme editor. As you can see, within the theme editor, we have Sidekick in here, which is like the normal Sidekick AI of Shopify. But now, if you click on any section or any block, you can see this small option in here to ask [music] for changes. All you need to do is to type the changes that you want to have, and Sidekick will take care of it. So, let's say for example, you want to change this text [music] color to red. All you need to do is to click in here, click on ask for changes, and type what you want. Change [music] text color to red. And as you can see, Sidekick changed the text color to red. And if you click in here on this button, you can see the changes that Sidekick [music] done. So, basically, instead of going to the section settings in here or to the block settings or maybe even to the theme settings to figure out which option is responsible of this text color, Sidekick did this for you. And if you click here on the arrow, you can see the modifications that Sidekick did. So, inside of theme settings, Sidekick changed the colors of the scheme number [music] eight. So, now if you go to in here to settings and you go to the colors and to the scheme number eight, you will see that the text is now [music] in red. And this same logic can be applied to any section you have or to any block you have. So, let's say [music] you want to change anything in here, all you need to do is to click and to tell Sidekick what do you want to change. [music] It's very important to note in here that Sidekick is not rewriting your theme codes, it's just changing the settings or adjusting the settings in a way to get you the results that you want. So, if for example, your theme treats all your headlines in the same way and apply the same colors to all of them, in this case Sidekick can change this. So, the color red will be applied to all of your theme headlines. So, the limitations in here will be based on your theme limitations. Sidekick is not going to rewrite anything, it's just going to adjust the theme settings. The second feature I want to talk about it is the ability to edit or create images using Sidekick. Again, from your Shopify dashboard, you need to access Sidekick. And you find Sidekick here in this corner, you click on it, and you can make it full width if you wish, and you start talking to it in the same logic that you use ChatGPT. So, basically, you can give it your product image and ask it for modifications. I've uploaded a Starbucks cup, and I will ask it to create or generate an image of someone drinking this coffee in a office. So, generate an image of someone It will take few seconds to generate the image, and you can even ask it for more modifications if you want. So, as you can see, now I have my image. If you click on it and you maximize it, you can see that the product is very well represented. Honestly, the image is very nice, it looks very natural, and you can directly use it on your store. This tool is actually improving more and more over time, and I think you can do a lot of good photos and good images using it. Just make sure to upload an original good high-quality image for your product in order to be able to use it. And if you are okay with it, you can either save it to files in here, so they will add it to your Shopify files, or you can download it if you want to have it on your PC. So, you click here on download, it's really up to you. If you click on save to files, it will be it will be saved to your Shopify files. So, now when I go in here to content and to files, I should be able to see it, and as you can see, it's in here. You can also use the same feature within your theme editor. So, let's say for example, I want to change this image. You click here on edit image, and you can ask for changes here directly. So, let's say I want to change this to have a studio background, I can either choose this option or type it in here. I'm going to go with it and click on enter. If you are liking this video so far and the features I'm mentioning as well, please don't forget to smash the like button, subscribe to my channel, and hit the notification bell because in this way, you will get notified every time I publish a new video. And now, let's get back to our topic. And as you can see, now I have this image in a totally different setup. And you can do any modification you want. Once you finish, you can either save the image or save as new and directly use it. I'm going to click on save as new, and now I have my new photo in here. The next feature we are going to talk about is one of my favorites, and it's new. It's going to make your work much more easier and much more efficient. I'm pretty sure if you work with Shopify, at some point you have wished this feature [music] exists. Well, now it's here. When you are within your theme editor, >> [music] >> usually when you are changing something or a collection or a product and you notice that there is something wrong that you want to change within this product or within this collection, usually what we needed to do before is to go to the back end and to change the products from there. Now, this is not the case anymore. You can open the product editor or the collection editor or even the page editor within the theme editor without leaving >> [music] >> where you are working. So, let me show you because this is going to make much more sense when you see it live. >> [music] >> So, let's say for example, in my case in here, I have this collection in here listed. It's a featured collection section. [music] If I click in here, the first option is to choose the collection. So, in my case, I have already chosen the activewear collection. If you click in here, you will see this edit option. When you click on edit, you will see the collection editor page opens in here, and you can modify everything about it. So, you can add description, you can even change the rules, you can even modify the meta fields, everything. And this is very very really time efficient because before we used to go back to the back end or open another tab, which was very annoying. This same thing can work also for products and for pages. Let's say for example, you have listed a featured product on your homepage, and this is the product I have that I have listed, but I want to modify something about it. With the same logic, you click [music] on it in here, you click on edit, and directly the editor will open in here, and you can modify everything about the product in here. As you can see, this is the full editor, so everything, even the meta fields, are in here for you to change them. The next feature we are going to talk about is a very time efficient feature, and I'm pretty sure at some point you wished it existed. With this feature, you can basically copy and paste sections within pages. You can also duplicate sections on the same page or copy and paste sections [music] in the same page, but more efficiently or let's say in most cases, what you need to do is to copy and paste sections between pages. So, let's say for example, you've created an Etsy section, [music] and you want to have the same section in all of your pages, before you needed to recreate this section, now you don't need to do it this anymore, you can just copy and paste the section. I'm going to show you how to do this. So, let's say for example, I want to copy this section, all I need to do is to right click in here, and as you can see, I have the option to duplicate or to copy. Once you click on copy, you have it on the clipboard. You can either come in here and paste it in here if you wish, or you can go to any page. So, let's say for example, I want to go to my collection page in here, I can go to this page, and I can simply click here and click [music] paste after. And as you can see, I now I have my section in here pasted. [music] And this can be applicable to any section and any block. So, if we go back in here, for example, and we click, there are these blocks within this section, same thing. I can right click, I can copy or I can duplicate, and I can paste. You can do that on all type of pages within [music] your theme. So, whether it is the homepage, the product pages, the collection pages, or normal pages, or even the blog post pages. Now, the next feature I want to talk about might not make sense to everyone or every store owner because in some cases, it might be a little bit more advanced than your actual or your current knowledge, but it's still very valuable. [music] And it is the ability to change the custom CSS of every section on your store. If you have no idea about what coding is, just wait for this section to end and to move to the next feature. [music] But if you have a little bit an idea about what CSS is, this is going to [music] make a lot of sense, and you will understand how important this feature is. When you click on any section within your theme editor, any of these sections, you will see that within this this section, if you scroll down, there is this custom CSS section or this custom CSS block. And in here, Shopify basically is allowing us to change the CSS of a section or of the theme even in general in here without playing around with the codes. CSS is the part of the code that's responsible of the font sizes, the font colors, the display in general. So, usually, even if you are not a web developer, you will still be able to modify CSS or to work around it, especially if you use a little bit the AI or ChatGPT and try to figure out things. So, again, this might not make sense for you if you have no idea about custom CSS, but if you do, this is life-changer because now, instead of playing around with the full theme code, you can simply modify your things in here. So, let's say for example, I want to make this text bigger, I need to find first the type of this text. So, what's the family of this text? Again, you this might be difficult for you, but usually text are either H1, H2, H3, similar to what we see in Office Word or P. Let's go with P. I think it's a P. And write font size 100 pixel, for example. Okay. So, as you can see, I was able to change the font size of this text only in this section. I didn't change everything in the theme. I just changed this section locally. And that's why this feature is very valuable because it allows you to do these small modifications at the section level instead of changing the full code. In so many themes, for example, all the headlines will have the same size. But let's say you want your H2 to be bigger in some sections and smaller in the on the others, that's how we can do it at the section level [music] using this small custom CSS section. Also, you will have another one in here at the full theme settings. So, if you scroll in here, you will see that you have a custom CSS. This is going to change the CSS of the full theme, not only of a section. So, if I put in here the same thing I have put in there. So, if I go in here and copy uh the CSS and put it at the theme level, you will see that so many things are going to change, [music] not only this part of the text. So, as you can see, this text is now bigger because [music] it's P and I have modified the size. So, if you want to do something or to do a modification at the section level, you need to put it at the section CSS level. And if you want to do something general for your like full theme, you can do it in here. Now, our next feature is very nice and the practical and it will allow you to improve [music] the images or how your images appear on different devices. With this feature, what you can do is to change the focal point of an image. So, let's say you have a banner on your homepage and it looks very good on desktop. But when the theme cropped it for mobile, it skips the important part of the image. Like it removes the product or crop the product. Now, with this feature, you can define the point or the part of the image that's more important and basically Shopify is going to preserve this part when it's cropping any of your images. So, [music] let's go to the banner section in here. We have this section in here. When you click on the image, as you can see, this is my image on desktop. If I go to mobile, this is what I have. Uh let's see I will choose a different image, but this time I will choose something with a uh a bit higher. So, let me change to this one. So, as you can see, Shopify now cropped the image here [music] on desktop without showing the uh model face. Let's say I want to keep the model face no matter what. So, what I can do is I click here on the edit image. And in here, I precise the focal point to be here. And I click [music] on save. In your case, you need to preserve, for example, the product or maybe a special part of the image, you just need to locate the focal point where the important part of your image is. And I will click back. And as you can see, now the model face is showing. [music] If I choose the mobile view, I have the same thing. Now, let's move it to let's say to make the focal point, for example, instead of here, in here. And I click on save. As you can see, now the crop has changed and I have the focal point in here showing. If you go to mobile, you [music] see the same thing. This is a very nice feature, especially if you don't want to have different images per devices or maybe your theme doesn't have this option or maybe even if you have like large images and you want to crop them and you want always to make sure that the important part of your image is showing on all devices, no matter what. The next feature is a feature that's going to save you a lot of time and it will keep you calm. And it is the ability to restore unsaved theme edits. [music] It happens all the time. You would be working on your theme editor, something will distract you or maybe by mistake you will close the tab or whatever. [music] And suddenly, everything that you have done is lost. Well, not anymore because Shopify now allows you to restore the edits. So, as you can see in here, they are telling us that we have edits that weren't saved. So, and we can simply click in here and restore them just by one click. This is one of the new features that I think is very, very valuable, especially if you are a little bit clumsy like me and you [music] tend to close tabs before finishing your work. Our next feature is a simple one, but it can keep your work organized within the theme editor. And it is the ability to name sections and blocks. And I find this feature very valuable when you are preparing for an update or a roll out or something like this and you want your sections to be organized. Maybe you don't want to um show them all now. Maybe you want to create some sections and hide them for future before launch or something like this. I tend to find this feature very valuable at this point. So, from your theme editor, if you click on any section in here, you can see that you can name it. So, let's say in this case, I can name it activewear collection. [music] And let's say I created a banner for Christmas, I can go in here, let's say duplicate this banner, name it Christmas banner in here. And do everything I want inside of it and simply hide it for when [music] I want it to go live. Uh I also like name my sections when I do some special modifications or add some CSS coding or something like this to make sure that I recall what's happening in this section or what's different about it. You can also do the same at the block level. So, if you click in here, you can rename your block as well. The next feature I'm going to talk about is a big one and it's going to make so much sense [music] if you sell in different markets. And it is the ability to change your theme layout per market. So, let's say, for example, you sell in Europe and you want just for France to have a different banner on the homepage and to have like maybe an image with the image of flags or whatever. Okay? And you can apply this logic to anything else that you want to change. From your theme editor, you go in here and as you can see, there is this option in here to choose where you are changing. And you are going to only see this option in some of Shopify plans. I don't believe that you will see this option in the first plan, the cheapest one. You need to move to the um higher one, to the next one to be able to have this feature. So, basically, when you click you click in here, you can change the market where you are seeing or modifying the [music] theme. If you are on store default, you will be modifying the theme for all store all over the world. But if you want to change something for France, as you can see in here in my markets, I have Europe and I have France, you click here on France and now we start modifying within the French market only. So, we're not modifying the whole store all over the world. So, let's say I want to change the image in here, I click in here and as you can see in here, this banner has this green small icon and this tells us that this banner was modified for this market. If you go back in here to the store default, you will see that we had a different image. If you go in here, you will see that I have store default, I have Europe and I have France because this is how I have set up my market. If I click here on France, I will start editing the theme on the French market only. So, everything I'm going to do now is going to be only applicable for the French market. If you want to know how to set up your markets like this, I highly recommend you to watch this video on my YouTube channel where I talk about Shopify markets in details. [music] In Shopify, you can set up your markets in a very detailed way. You can have different languages, different currencies, even different store layouts, different shipping, different taxes. Everything can be customized per market. So, [music] again, if you want to know more about Shopify markets and how to handle them if you sell internationally, I highly recommend you to check this video on my YouTube channel where I talk about this in details. Now, let's get back to our feature in here. So, if we click on France, we will be changing the store in the French market. So, let's say, for example, I want to change the hero image in here, I will go, click on change and I will select another image from my uh store files. So, I've selected this image. And as you can see, once I do that, I have this small uh diamond green diamond in here. It's telling me basically >> [music] >> that this small block of this our this section has been modified at the market level. So, in this way, I know that this image has been modified in here, but if I go to the European market, for example, it's still the old image. If I go to the store default, [music] it's still the uh the old image. But if I go to France, it is the new image. And this same logic can be applied to everything, to all the content, even the layout of the page. [music] So, let's say, for example, I want to remove a section and I I can do that. And in this case, I will be doing that at this market for this audience only. This is an amazing feature because it can allow you to make the experience [music] on your store very local and very specific to each of your markets. Our last feature for this video is a very important one and I have talked about it before on this YouTube channel and it is the ability to generate [music] full sections using AI. Shopify rolled this update maybe few months ago and it was life-changing because instead of downloading apps and paying for them in order to add sections to your store or maybe hiring web developers to do this for you, now you can do this yourself just by simply telling Shopify AI what do you want and the section will be created. [music] So, from your theme editor, you click here on add section. And as you can see, you have this option in here to generate a section. You click on it and you basically need to tell AI what type of sections that you want to create and the AI will create it for you. I will go with one of the options, so I will go with this one. And the Sidekick will be creating and now Sidekick will be creating this section for me. After creating it, you can even tell it about things that you want to modify and things that you want to change and it will work on it as well. I'm not saying that this feature is perfect. Sometimes the section that you will get won't be perfect and sometimes you won't [music] know exactly how to talk to it in order to get what you want, which is which can be frustrating, but you can always use ChatGPT to help you with prompting for Sidekick and I think with a little bit of experience and a little bit of trial and error, you will be able to figure it out. Also, if you want to know more about how to use this feature and maybe get some prompts of common sections that most store owners like to have, I highly recommend you to check this video on my YouTube channel where I show you so many examples, practical ones and I give you access to prompts that you can use directly in order to generate more sections using AI. [music] So, as you can see, the Sidekick returned this new section in here and it's fully customizable. So, it's looks and it feels like any other section on your Shopify store. You can add things, you can modify stuff, you can link articles and so on. You can even in here give AI kicks follow up instructions and maybe for example ask it to give you more customizations. Maybe you want to be able to customize the margins, to customize the spacings, maybe you want to show four products in here and so on. You can ask it. Just when you click on save, this section will be [music] final and you can't change it anymore. And once you do that, by the way, you will be able to use this section again and again as any other section on your store. You just need to click on it, you can copy and paste or you can click on add section in here and you will find it in here under AI generated and you can use it on any of your pages. I hope you like these features. I find them very practical and I know some of them are very simple and some of them are very advanced, but all of them are very efficient and they are going to save [music] you time, money and effort. If you like this video and found it valuable, please don't forget to smash the like button, subscribe to my channel and hit the notification bell because in this way you will get notified [music] every time I publish a new video. And before leaving, I want to remind you to check this video on my YouTube channel where I talk about the last feature [music] in details and how you can use AI to generate more sections for your store and not only that, I share with you some valuable prompts that you can directly [music] use to generate your sections within minutes.