Beginners Guide To Shopify Liquid in 2022

whether you are new to shopify or you're already a shopify store owner, you've probably encountered a code that looks something like this. this is shopify liquid, a template language created by shopify that serves as a framework for all shopify themes. in today's video, we'll take a closer look at shopify liquid. we'll start by understanding shopify liquid further and then we'll learn about its features. are you ready? let's begin to recap. shopify liquid is a template language used for creating or modifying shopify themes. if you are familiar with ruby, you probably have heard about this template language because it's written in ruby, or it's known to be written in ruby, but in terms of syntax it's very different compared to other programming languages. we'll get back to this in a minute. in addition, shopify liquid is very limited, like. there's a lot that you cannot do with liquid. for example, you cannot retrieve a data from a third-party server just from shopify. now what is it used for? in web development, there are two contents that you can render: statik content and dynamic content. statik content is a content of a page that stays the same and is usually hard coded in html, whereas dynamic content is the content of a page that changes depending on specific parameter. for example, we have the following product page. it specifically rendered this product for cats because in the url we specify that we want to render the specific product. in shopify this is called a url handle and by changing this to a different handle of a product, the product page will render a different product. this is how dynamic content is being rendered. in addition, shopify uses its own architecture or template files to display these pages. for example, this page is using productjson. it's a json template that uses sections to complete the page. taking a closer look at the section files, you will see that there's a liquid code mixed with html, css and javascript. so, to put it simply, shopify liquid is like the middleman between shopify stores and the server of shopify, where all the data about your shopify store is stored. and then when a shopify store asks for a data through liquid, shopify, liquid will ask the server of shopify if that data that is being requested is available. if it's available, then the server will give it back to liquid. then liquid will give that to the shopify store's theme. otherwise, if it's not available, then the server of shopify will just return a 404 error response. shopify liquid is categorized by three features: objects, tags and filters. objects, also known as variables, are wrapped in double curly braces and it's used to output pieces of data from a shopify store. for example, this is a shop object. inside of this object there are properties or attributes that you can use by using dot notation. let's say we use the name attribute, so you're going to type it like this: so shop dot symbol and then name. this will render the name of your shopify store. there are plenty of attributes that you can use from most of the objects in shopify, so if you wish to learn more about these objects, i suggest going to the shopify references page and get to know these attributes or objects. now let's proceed to tags. tags in shopify liquid are the programming logic that tells templates what to do. these tags are wrapped in curly braces, followed by percentage symbols, and it's usually followed by a closing tag. tags are divided into four categories: control flow, iteration, theme and variable tags. control flow tags are the tags that you can use to create conditions. this is the if, the unless, the else or else if, the case and when and lastly, the end or operators. to create a tag, you need to start it with a tag itself, say, for example, the if tag. then you need to close it with a closing tag and if. however, not all tags are required to have a closing tag. a good example of this is dlc or elsif. these tags can only be used between if and and. if you cannot do it like this or like this now, if you want to create multiple conditions for a control flow tag, you can use the operator's end or or. for example, we have the following condition: if you're using end, two conditions must be true in order to execute the block of codes inside of the if. if you're using or, either of the two conditions can be true, it will still execute the code inside of the if tag. now, all of those are part of the fundamentals of programming, and so if you're not familiar with it, i suggest go and learn it, because we are not going to go in depth with this topic. next is the iteration tags. iteration tags are the text that you can use to repeat blocks of code. this is where you can use the four tag to loop through an array of values. for example, we have the following four tag with a condition: for each product in the collectionproducts, we are going to render the name of the product. so, for example, in this collection. we have three products: product one, product two and product three. this entire code will basically output three heading title ones with a text, product one, product two and product 3.. you can also combine 4 tag with an else tag. this is very useful too, especially if you want to know whether the four tag executed the codes inside of it or not. next up is the theme tags. theme tags are the text that you can use to generate template, specific html codes, dividing arrays into multiple pages and telling shopify themes to render or use a specific layout or snippets. so this is where you will find the form tag, the section tag, the pagination tag and the layout tag. don't worry, we're going to be using most of these tags in the future lessons. lastly, is the variable tags. variable tags are the tags that you can use to create liquid variables. if you're familiar with javascript or other programming languages, you can create variables. most of the time you're using var, keyword or a data type. in shopify liquid, you can use either assign or capture to create variables. so how can you create a variable? say, for example, we use the assign tag to create a variable, you can create the assign tag, followed by the name of the variable, then followed by an equal sign symbol or equal sign to create or assign a value. for example, we can use the name of the shopify store and pass it to this variable. now, if you use this variable, like how you use an object, this will output the name of the shopify store. so those are the tags. now let's continue to the last feature of shopify liquid and that is the filters. filters are kind of hard to explain but, to put it simply, they are methods that modifies the value or the output of an object. they are placed within an object tag and is denoted by a pipe symbol. now let's take a look at this example. let's say we have a product, the title object. here we can use a filter by adding a pipe symbol here and then specify what filter that you want to use. let's say we use the up case filter. this will then change the output of the object and make the string all upper case. that's basically how filters work. they change or modify the output of an object. now there are plenty of filters that you can use for every situations. there are filters for strings, for numbers, for arrays, for urls, for colors etc. but they all do the same thing. they modify the value or the output of an object. so that is shopify liquid, a template language used for rendering pieces of data from a shopify store. if you have any question, let me know in the q and a section or in the comments below. otherwise, feel free to subscribe and like this video. i would appreciate it if you like this video, because i took so much time making this video. it's been a fun editing. i've been working on this for about a week and i learned so much about making 8-bit animations or characters, and i also learned about davinci resolve- making animation using davinci resolve. that's really really amazing to use. so, yeah, anyway, thank you so much for watching. hit like subscribe bell and yeah, i'll see you next time. bye.

SHOPIFY LIQUID: Theme Programming for Beginners [CRASH COURSE]

[Music]: [Applause]: alarm. welcome to this crash course on Shopify liquid, the templating language of Shopify themes. first of all, I want to thank you for bearing with me over the last three months. it's been a busy three months with the release of my latest Skillshare class Shopify theme programming which, by the way, the link is in the description. but in today's video we're going to cover an overview of Shopify liquid, a very practikal run-through of what you can do with Shopify liquid, which you can think of as the kind of back-end programming language of Shopify themes. so this crash course is gonna be split up into four, four parts. the first part: we're gonna cover the absolute basics. we're not even gonna touch the store data, just get you up to speed with some of the syntax. the second part: we're going to actually bring in some store data and use liquid objects. and in the third section we are gonna incorporate theme data. so theme data allows us to take user input from the admins of the store. they can customize their theme using the customizer and then we can use that data inside our themes- very cool feature of Shopify. and the fourth and final part: I'll be toking about some of the limitations of the templating language, what you can do and what you can't do with Shopify liquid and also covering an important topic within Shopify liquid, which is the topic of scope. we've got a lot to get through, so I'm gonna jump straight into the video. let's jump right into the computer and get into it, all right, so we're now inside my computer and we're looking at the Shopify admin of my testing shop: Chris testing shop. now, if you haven't done so already, you can create your own development store through your Shopify partners account. if you don't have a partner account, it's free to join. you just go to partners Shopify comm and join now, okay, and the great thing about a partner account is it allows you to create what's called development stores that are basically free store that you can use as a development environment to practike your programming. okay, so that's the first thing you'll need you'll need in an actual store, and the second thing you'll need if you want to follow along is the theme I'm using, so you can use any theme to follow along with. in fact, maybe it's the theme you're working on right now, but if we look at a fully developed theme like debut, for instance, there is a lot of code and files here, so I don't recommend, if you're trying to just learn Shopify liquid, that you work with a theme that's already been built out, because there's a lot of HTML in here. there's a lot of different files and lines of code, so my recommendation is to start with a blank theme, and the theme that I use is the one that you can generate through theme kit using the theme new command. what I've done for this tutorial is I've already generated that theme and I've put it on my github page. so if you just want to download the theme, it's at github. comm- slash- christopher dodd, slash, Skillshare. okay, this is my resources for my classes on Skillshare, comm and also on youtube now. so here you can see theme kit template theme and if I download that zip file, I'll just download it to my desktop. it's a very small file, should download really quickly. then I can go back to my store and simply upload that theme. all right, so now if you have a store and you have this theme, then we're starting from the same starting point, and if I click into actions, edit code, which is where we'll be diving into in today's lesson, I'm going to expand this out. you'll see that we have much less code in here. we don't have any sections or snippets and our index file is only ten lines long, okay, so this is ideal for practike purposes. we don't want to overwhelm ourselves with too much HTML, and definitely liquid and Shopify themes in general can get quite messy and hard to understand when you have so much code and stuff going on. so I definitely recommend you start from a starting point like this. all right, so how this tutorial is going to work is I'm going to basically follow what I wrote here. so this is a guide that I have on my website. you can find it at Krista freelancercom slash Shopify liquid guide and it's a comprehensive artikle, basically a text course, on how to do Shopify liquid programming. I toked about different styles of objects. I discuss all the objects available, where you can find them: objects, scope. it's a mammoth artikle that I don't expect you to read in one go, but if you get lost at any point throughout this tutorial, you can come here and read up on a section that you didn't quite understand or maybe something that you want to use later on. maybe it's a filter or an object or a tag that you didn't see before and you can come back here. you know, use control F to find that filter and see what it does. okay, so what we're gonna do is we're gonna start with pure Shopify liquid, without touching any of the store data or theme data, and then we're going to introduce store data and theme data to show you how you can use Shopify liquid to actually present the store data on the page. Shopify liquid, of course, is the templating language for Shopify themes and it allows you to represent what you've got stored in your store into your website. all right, so without incorporating store data, it's pretty useless. but what we're gonna do- just so you get the concepts- is start without any store data and then introduce it. all right, so I've done a lot of toking so far. let's actually jump in and write some code, okay, so what I'm gonna do? it doesn't matter what template that you do this in, I'm just gonna do the index dot liquid template. I'm gonna get rid of all of this code and I'm gonna start with the first basic example, which is assigning a variable. all right, if you've done any programming in the past, this is a very basic function. so I'm going to create a variable and assign it the value of hello. okay, so this is obviously going to be a string variable. so what you can see here is we've got a opening curly brace, a percentage sign, we've got our code in here, so we've we're running the assigned tag and we're just doing our variable assignment there. then when we're done, we close with the percentage sign and the curly brackets. so pretty much all the time you're doing Shopify liquid, this is what a tag looks like, except when you're outputting stuff on the screen, in which case you use the double curly braces, and that's what we'll do right now. we are just going to assign this variable and then output the variable to the screen. I'm going to hit save on that. one extra thing I'm going to do, so that we only have what we wrote here on our page, is get rid of some of the layout code. so in my themes art liquid file inside the layout folder, I'm gonna get rid of everything except this main tag here with the content for layout. so although this header content, I'm just gonna delete. all right. so now we can view what we've made here by hitting this link here to preview our theme and I'm gonna open up in a new tab. so it stays in the same window. now when I open up the theme. you can see it says hello. so, as you saw, we assigned a string to a variable and then we output it on the screen. this is very basic shopify liquid. actually, I think we should have them side by side. so what I'm gonna do is take this out of full screen, create a new window with a preview, and then we can place them side by side on Mac like this. there we go: all right, cool. so here we have our code and we have our output. so we've created our own string variable. this could easily be a number as well. so let's just say the variable is 5. refresh the page. you can see it's 5. okay, we can perform math on that variable. so what we can do inside our output tag here is run a filter. so in Shopify liquid we have three types of syntax. we have tags, which you can see here. we have objects, which you'll see when we introduce store data, and we have filters. filters are a piece of syntax that is pretty unique to Shopify liquid, so it might take you a litt.

More:The 3 Things you Need to Start Dropshipping on Amazon

Shopify Theme Development: LIQUID Programming For Beginners (Tutorial)

whether you're a shopify developer or not. if you use shopify, chances are you'll encounter your store's source code or your shopify store source code, which is mostly written in html, css, javascript and, of course, liquid. if you're a developer, you probably know already what html is, css is javascript s, but liquid. what is liquid? is that something that you lick lick with? that was not a good joke. jokes aside, in this video we're going to be toking about liquid programming so you can understand what is happening behind the scenes of your shopify store. stay tuned for that. [Music] before i start this video. this video is sponsored by me. if you're interested to learn how to create shopify themes, you can enroll to my course- shopify theme development course- and in that course i will teach you how to create a shopify theme from scratch. i'll teach you anything that you need to know to create a functional shopify theme. if you're interested, i'll put the link in the video description below and use the coupon code. you can use the coupon code liquid to get 30 off of your purchase. all right, let's go back to the video. so before we start learning liquid or how to code using liquid, let's understand first what is liquid. so liquid is a template language created by shopify and is written mostly in ruby. it is mainly used for controlling or maintaining what is happening to your. what is happening in front end, or basically, is: um, it controls the flow of your shopify store. so you can consider liquid as a back-end programming language. html, css, javascript are what you're seeing in your browser, in your front end, and then liquid is what's working, or, basically, liquid is the guy who works behind the scene to control or to maintain your shopify store. you can think of it like a cereal bowl, so, basically, the serial is the html, css and javascript, and then the milk that you pour in here is basically liquid, because it is, it's liquid. so you mix them and voila, you have a cereal bowl, you have a shopify store. i think the milk is inspired. on a serious note, though, if you take a look at your development store or your shopify stores code editor, you will see there are a bunch of codes that starts with curly braces, not the json codes. what i'm trying to say is the double curly braces, or curly braces, followed by percentage symbols. those codes are liquid codes, but don't worry, we're going to tok about more of this later on, so you get an idea. what are they? so, first of all, liquid codes are categorized in three parts: objects, filters and then tags. so objects is basically what you use to tell shopify or liquid what to render or display in front. and so, to put this simply, basically objects is like an echo statement from php or c out of c plus plus. so you're basically telling shopify if you use an object, you're basically rendering the value of that object. so say, for example, a variable, so you can use that variable as an object and then shopify will think of it, or liquid will think of it as an object and then, oh, i will render the object, i will render the value of this variable. so you probably get an idea now how to create or use an object. so you need to start with double curly braces and then, inside of that curly braces, you need to apply or provide an object or a variable. okay, so let's open our code editor. so select edit code and it should open our code editor. and then let's open our templates folder. should be this one: close the layout, close everything, open the templates and open the indexliquid and we should have the following objects: so content for index is an object that displays the content of your homepage. so basically, that's what you're seeing here in the home page. so if we get rid of this and if we save this and if we refresh our page, our home page, we should have nothing but header and then footer. so now, going back in here, in our indexliquid, we can start creating our first object. so say, for example, let's create an object. so, like i said, create an object, create double curly braces and inside of this, between this curly braces, just type the object. so, for example, let's use shop and then to use an attribute, we're going to add dot symbol and then the attribute name, which is name. so if we save this and if we open our browser again and if we refresh our home page, we should have the following name of our shopify store. now, obviously, there are a lot of attributes or objects that you can use in your liquid code. there's the shop that we used and then there's the product collection page, customer, etc. etc. okay, so now that we know how to create objects, let's learn how to use filters [Music]. now. filters, they're the ones that changes the output of your objects. so say, for example, we have a string value, hello world, and everything is in lowercase. so if we use a filter called uppercase, basically the uppercase filter will make the following string uppercase. so this string is what we're going to see in our, in our browser, in our front end. so that's filter, something that changes the output of an object. so let's go back to our code editor and here in our indexliquid we have the following: object: shopname- right? so shop is the object and then name is the attribute from shop. now to add or to use a filter, all you need to do is to add a pipe symbol after the attribute or the object. so let's just add a pipe symbol- you can find that on your keyboard just above the shift key or the right shift key- and then, after the pipe symbol, just add the filter. say, for example, let's use up case. now, if we save this and if we refresh our home page, as you can see, the name of our store is displayed in an uppercase form. now it's also possible to use one or more filters in one object, so you're not limited to just one filter. now, say, for example: now we're using an up case filter. right now, if you want to add another filter, all you need to do just to add another pipe symbol and this time we'll use another filter. say, for example, let's use the filter called prepend. so pre-pen is a filter that adds a string volume before the object or the value of the object. so say, for example, prepend. and if we honestly save this, it's not going to work because some filters requires you to add or to pass a value or a parameter. so let's try and save this, it worked. so if we refresh our page, as you can see, we got an error that says liquid error, wrong number of arguments given, one expected too. so we need to pass a value for our prepend filter. so to add a value or to pass a value, all you need to do is just to use colon after the prepend filter and then space or just add double quotes or single quotes and then between of these quotes just add a text, say, for example, hello, and then space just to separate the, the value of the shop name, and then the hello world or the hello word, the word hello. let's try and save this honestly. and if we refresh our home page, we should have the following output: so hello space, which is from the prepend, so hello space. and then weekly health, theme development. and there you go. that's how you use filters. so, to put it simply, tags are the ones who control what is happening in your shopify store. so basically, they're the ones who control the flow of your shopify store. the logic of your shopify store is that a fly? what the hell? now there are three types of tags. there's the viable assignment, there's the control flow and there's the iteration. if you're a developer or if you have an experience with coding, you'll definitely find this very easy to understand. if not, just keep watching and i'll show you no way. now. before we start learning the types of text, let's understand first how to create a tag. creating a tag is like creating an object. so previously we were using double quotes or double close, double curly braces, but this time we're just gonna need to create set off curly brace and then a set of percentage symbols, and then between those we're going to use a tag. so say, for example, we're going to use a tag like a sign to create a variable. so, that being said, let's start off with variabl.

More:Little to NO cost Small Toys & Games bring big profits on Ebay & Amazon

10 - Shopify Theme Folder Structure and Rules for Developers

hello and welcome. in this video I'm going to show you Shopify team folder structure and how they are going to work. also, you learn about some of the limitation and what you can do. what you cannot do on Shopify folder is structure for teams. so if I come to the shop we have created in previous videos, this is the default team. in the upcoming videos I'm going to focus on bringing customization to the existing team so that you can get to know how you can customize the team and how you can change something and liquid and how section and everything works in Shopify. after that we will start creating our own team from scratch with the zero could add it from any other team. so let's start doing it. if you click in action button, this is the default email shop 5g- view it. you can click on dig it. it could also I all have open my visual studio code. this is the team we have downloaded in the previous video. if I come to my code here, this is the source code. if you check out, we have asset folder. we have conflict folder, layout, local section, a snippet and template. these are all the files we have here and you cannot have your own custom folder here. it is not like a, like a wordpress theme or any other thing. if you create a folder here called custom, you cannot use it because sofa will not understand what is that. the only way shop I understand is that folders they have here at the time of this recording the whole area structure is like this: but- shocked. I promised to bring some new object in the shop voice team structure. they have added some new folder which is going to come in the end of this year, 2019. maybe they bring it on January or 2020. so that is something new that will come and I will cover it in the channel. but for now, this is all you have. as I said, you cannot create your own folder here. also, if you a come to an in inside the folder, you cannot create a folder inside this one. this is all you have. if you want to create something, just create a file, either that is a JSON file or that is going to be a CSS file. let's say that is a CSS file or a J's file or a liquid file. you can create them, but you not a separate folder. these are the guideline. I am grieving you like that. that are the limitations. if I come to my team here. in the previous video I said you want to bring changes to your team to the live store. everything we write is in our config folder. if you come to the terminal here, you can please control tilde, which is the button near exclamation mark. you can now write team watch and this is going to watch for any changes in your local directory and it will upload that 3ds store. these are going to be your store key. I will reset it every time I showed and I will visit it as soon as I finish recording the video. so if you bring any changes that will affect my store. so make sure you don't read: this is the team ID and this is going to be my shop URL. so if I come to my quit here, let's say this is a snippet. and if I create a file here, let's see, I will give it test dot HTML. now I will save it. check out this one. it did upload that to my team here. it was uploaded. what if I create a folder here? let's see, I am going to create a folder and say this folder name is false and I'm going to store all my fans here. it did not upload anything, even if I create a file inside this one. let's say test that assesses all CSS. this one will not upload that one. you can see it is going to give you an error. team file may not be stored in the sub folder. that has an error. that's why you cannot have a sub folder inside the folder. whatever you have here, it is fine. I wish so. if I add that feature in like soon, so you can have more folder inside this one, you it will give you, if it will make your team a lot cleaner, like you don't have to store like everything, like fun CSS, JavaScript, everything in one folder. that will give you a lot flexible, a lot of flexibility. so that's it like. this is the team structure you have here. you cannot add more than this. whatever you have here and everything will come here. know what is assets? you can store images here. you can insert your SD file. you can assert CSS file, all in the asset directory. of course I will go and in the future, videos in the conflict. you can install your configuration and all your data. for example, your team has a sitting. if I come to the shop right here, you can click on the team and you have customized here if you click on the customize. now this is the team sitting. you have check out the sitting team sitting. I will go in details. all the sittings you see here, all of them are written in the sitting underscore, schema, JSON. we will look at this in details but for now just understand those settings are stored here. these are going to be all your information and if you scroll down you have everything else. these are with translation and these are going to be the data for those sittings. so I will close this one. we will discuss about this in details. for now, your layout is like a master page. think of a page which any sub page will will inherit from that. if I open the team that liquid, this is the only page- and Shopify page here, and the sea lion, the Shopify team that has the HTML document here. other pages does not have. I mean like, if you are creating appreciate in the layout, all of those pigeons must have this template. so these are going to be master template. for example, password has the same thing, but if you open any file from the sections they see I open artikle, they do not have any HTML tag data like storing HTML tag. that's why, whatever is in the layout, they are going to be master template. I call the master and they are master because any other page are going to inherit from them. so whatever you write in a section, it is going to be injected in a team, that liquid, and then it will be displayed. if I scroll down, here is something called content for layout. this is where all the sections will be displayed. for example, if you have a section called artikle blog court, whatever, all of those content will be yielded here. so that's how it is going to work. I'll close this for now. we'll tok about them in details. I will go to the locals. locals is true. all the translation file, for example. the fault is English. you have any like for any other languages. you have this one. all of them are JSON file, for example. you skip the content, it will look like this: but if I open any other language, I do know which one is this de and this is how it is going to look. little for translation. we will not touch this for now. and sections are going to store all your sections. what are sections? we'll tok about them on details, but for now, if you come to this section, it is very clear: theme sitting section. these are all the sections that you have in your team. if I open these are all the sections, you might see there are a lot of them. why we don't have all of them. some of them are hidden here. you can click on add section and you will have all of them here. so we'll tok more about them and how you can create your own in the future videos. but for now, understand whatever in the section directory will be here and some of them are not here because some of them can be included directly in layout files. snippets are a small piece of your code. like you are reusable code. if you have a code that you use in multiple place, you don't need to repeat them. you are add them in, let's say, one file and then you include it in multiple places and you have template. templates are pages. for example, you have a page called about us. we have a page called contact us and they are different. you want the design to be different. that's what you can create template and once you create those pages, you can apply those template to the pages. we'll tok more about them in the future videos, but these are the custom templates we have so far. also the config, the ML file. that is true, all the configuration for you, sir. this can have more of them. for now we have this match. this is the standard files unit for the team, but for more we will discuss them, like how you can add more fil.

The New Shopify Dev Documentation for Liquid is AMAZING right now!

today is such an amazing day for all of us because shopify has released quite a few updates or changes, and in this video we'll be going through one of these updates, and that is the documentation for shopify liquid. now you're probably thinking right now, bernard, there are better topics to tok about. there's dehydrogen and oxygen, there is the improved shopify cli, there's the check, check out extension. the list goes on. i can't even count it with my own fingers or hands, but i just want to set those topics aside for now and do videos about them in the future. now, before i begin this video, i just want to say this first, from the bottom of my heart: i want to say congratulations to all of the developers who worked hard on this amazing updates. you are amazing and you are very appreciated by all of us from the shopify community, including my own community. thank you so much, and you all are amazing. did i say that twice? i say that twice. back to the video. if you are unfamiliar with shopify liquid, you can check out this video or you can take my shopify liquid course. i'll put all of the resources down in the description below, including the documentation that we're going to tok about in this video. so, speaking of that, let's go to our computer and start toking about this amazing update. welcome to the new documentation of shopify liquid. now, the first thing i notiked when i went through this page is the navigational sidebar in the previous documentation. in the previous documentation, you will see here not just the liquid link, but also the api references, the ajax api, the storefront api, the hydrogen, etc. but now all we have here is the liquid and everything related to shopify liquid. i also notiked that they've removed the um in this page sidebar on the right side. if you remember that. they removed that, which is really really nice. it looks cleaner and less cluttered and i really like that. i really like the new design. now, if this is your first time viewing this page or this documentation, you probably have this in daylight mode. so if you want to look at your documentation in night mode, you can check out or you can go to the navigational bar and you should have either a moon icon or a sun icon. currently i'm in the dark mode or night mode, so you can see um, there is a sun icon here that i can click. moving on to the next update, and that is the code snippets in the documentation, and you know what this is actually really really cool. you can now edit the content of the code snippets. let me show you what i mean by that. so let's open, um, the liquid documentation and if we scroll down, as you can see, here we have the following code snippet or code box, whatever you call that, and now you can change the object or you can customize this. so, as you can see, if you double click, you can customize, or what am i toking about? you can change the object. say, for example, i'll use shop dot url and that will automatikally or update the output in real time, and then you can highlight this and then open this in a new tab and that should open the polyness potent potions. our store will be opening when the moon is in the seventh house- a stroke anyway. going back to the topic, if you're a shopify developer and you want to go through the objects real quick without without opening a new page, this is a great tool for that, because you can just go through the objects. for example, i want to use product and then i can just scroll through the attributes without opening the product page and that will automatikally update the output in real time. and there it goes. you can see it's saying health potion and you can also create conditions here. as you can see, here we have the if. if page description is set, then output the following meta tag: another thing that i really liked is the performance of the pages, or the speed of the pages. now i'm not sure if that's because of my connection, but i notiked that it's faster compared to the old documentation. once again, i'm not entirely sure, but i think they have lazy loaded most of the content and they are cached. i'm not sure. if my assumptions are correct, they'll be really nice. so i've gone through the objects tags and a little bit of filters and i don't think there's something new in objects. correct me if i'm wrong, please, but i notiked that there is a new tag under the syntax. if we open the tags now you need to click the plus icon to open this. if you click this tags, it will open the tags page, so you need to be careful, but that so click the plus icon. it will open the following: and then under the syntax, there is a new tag called inline underscore comment. i really like this new tag because the comment tag is really dreadful to use if you want to create a comment, all you need to do is to use the number sign. you don't have to type comment anymore. as you can see right over here in the um code snippet, we can erase all of this. you can just create a tag and then you can type number sign- not that number sign- and then followed by the comment that you want to say so. for example, i want to eat pizza right now. that's how you make comments. you don't have to type tag comment. you don't have to do this anymore like this. previously, we were using comment and you still have to close the following tag with and comment. you don't have to do this anymore. you can simply type number sign and then type your comment. i am shaking and crying: rn, that's faster, right, i know you can get rid of this. don't need that anymore. but personally, if i'm going to use this tag, i'm going to make it like this: as you can see, i'm using um- plenty of equal signs just to create a line and, as you can see, it's much cleaner. looks really nice. this is what i'm going to do. if i'm going to use the comment tag or the inline underscore comment, all right. so those are the things that i really liked. let's tok about the things that i don't like. or, let me just put it this way: i wish they have done this, they added this or they kept this. now, just a disclaimer: this is not something that i would say, quote unquote, important or should be prioritized. so if ever shopify is watching this, thank you for watching. first is: i know this won't really matter to some, to some of you, but i notiked that the color palette changed, or the color of the documentation changed. previously it was green, but now it's blue. i don't know, it just just bothered me. it's just the documentation, though. if you open the themes page and the apps page or other pages, as you can see, the color is different. right, it's darker greenish, darker green, but in the documentation of liquid or under the api references, if you open other pages, like the graphql admin, api, that is, oh, it's different. why am i toking about this? i don't know, it just bothered me. i guess this is so nonsense, but my point is: it's different and i don't know, it just bothered me. i really like the um green theme, but yeah, we'll get used to this. the second is: i wish they have added like a badge to, especially to all of the new things, like the inline underscore comment. that is a new tag. i wish there was a like a badge in the sidebar or the navigation sidebar, like beside, should be like new, just to, you know, show that, hey, this is new, try us out. or, you know, open this. or maybe shopify devs could have added like a separate section here where they, you know, say something about the new features or objects or tags or filters, just like what they did to their apis. if you remember, there is a um. if you open, all there is the release notes. i think this is just everything about their api. yeah, maybe there is one. no, there is none. so, yeah, i wish there was something like this in liquid, or just a badge saying that, hey, this is new would be nice. those are just my ideas to make it easier for us to go through the updates, because who would want to scroll the entire documentation of liquid um just to see what's new? correct, once again, it's just an idea, might be dumb, i don't know. the next is: this might be really out of the topic, but i really hope, or i really wished, shopify updated the um. the

How To Autodetect Local Languages In Your Shopify Store

[Music] from local apps. here and in this video I want to show you how you can make it that when somebody comes to the app from a different country, it'll automatikally populate in their language, right? so what we've done is we have an IP detection that we use on that. so somebody in, for example, France comes or show in French, or so in Germany comes a show in German, right same thing with Chinese in the every other country, right? so that's kind of how the app works. but in order to do that, you need to turn on. so if you don't have the Apple include below this is a pro feature in the app. just, clear is a constitu. I'm doing this for us in it and what you would do is you basically go in here and you would hit this button here: auto detect language. so if you turn this on and then save it, you'll know how to access to hundreds of countries on where people show up. so, for example, I'm in Canada and if somebody from Canada showed up on the app, it will show up in English from Canada, say they with the us, same thing with Denmark, same thing with Mexico, same thing with Sweden and all these countries. now let's say you don't want that to happen, because if you have a country like, um, let's say, Arlen, for example, some in Ireland shows up and they don't want it to show up in Irish, right, ok, because no one that really speaks Irish- most people would prefer to have English, right? so all you need to do is you need to just go in the back end and you just need to move. remove Ireland from the list. so if I remove Ireland from this list, all of a sudden someone in Ireland will not get in Irish. don't just get in the default language. so, whatever your default language of your story is, that's the language that it will show up for that person, right? and that's kind of. that's kind of the way we wanted. and the way we also do is we use the analytiks in order to find that out. so if, for example, you'll have this section, your analytiks, down here, which will tell you: oh, people who were in Irish switched over to English. if you see that a lot, that means that maybe you shouldn't have it in that language available right on there. so, yeah, so if you want to have it auto detected from the person's location, I think that creates a better user experience for the customer and this app is all about creating great user experience for the customer. right, we do a lot of what we do in here with the menus or locations, the colors, the font sizes, everything, so that way your customers have a great customer service experience and that way looks really nice on your website as well. right, and I think that having a audit attack- they have an auditor net properly- is a really big part of that, right. so some countries they may prefer to have English or they prefer not to have. they can, they can also do that, right, in other countries they don't. so, again, all you need to do is you need to go in here and you need to just click on the auto detect button right here and that will make it that when somebody comes in to another country, it'll automatikally show up in their language and they always have the option of switch. so if, for example, I'm in France, it shows up in French. I can always come here searching to do whatever line other language I want. all right, thank you very much again. the smoke alarms translate pro. if you don't have the app, include a link or go to the link and grab the app, and if you like this, I do like and subscribe to this channel. please leave any comments or questions below or reach out to the customer service team. we're always happy to help you and we want to create the great experience for merchants and we want to create new and better experience for your customers. thank you very much, you.