Shopify Customize Theme Code 2022

going on everyone. it's Jamie here from Shopify master class and today we'll be looking at how you can customize your theme code for your Shopify store. I'm going to show you here how you can access your theme code and how you can make edits. also how to create a duplicate, so if you make any errors, you can quickly revert it back to a working version of your theme. so make sure you stay to the end of the video here. before I dive into it, I just want to thank our sponsor, profit calc, the one click profit calculator app available on the Shopify app store. it's going to allow you to skip your spreadsheets and get back to Growing your store with real-time calculations. it comes with a 15 day free trial and there's a link in the description below to access that trial there. I'm also going to show a quick video detailing their full feature set. are you a Shopify business owner who spends hours doing your accounting? have messy spreadsheets kept you from growing your business? discover profit cap, the affordable and easy to set up Shopify app that crunches your numbers in just one click. it automatikally syncs with all your accounts and expenses to calculate your profit, displaying everything in an easy to read dashboard so you understand your business in real time. start for free on the Shopify app store today. so now let's dive into how you can customize your theme code. I'm going to start by finding out first how to access that you and your Shopify homepage here. you want to head to the left hand side, click on online store. once that loads, that's going to lead you to the theme section. currently, this test store is running the debate theme, and so that's. we're going to make the edits today, and so, before you dive into editing any code, I always recommend that you create a duplicate of your current Shopify theme. this way, if you make any errors or you screw anything up along the way, you can quickly revert back to this version, so your customers aren't seeing any store that is breaking. you want to make sure it's alive at all times and working, as you're probably gonna be paying for traffic to come to your site, so you don't want that to be wasted ad spend. so how you do that is under this section here: current theme. next to the customize button, there's going to be three dots. you want to click those three dots and hit duplicate. I'm going to duplicate everything about that theme. it's going to create a copy of it. so it says copy of debate or debut and you can click the three dots. I'm going to rename this, I'm just going to call the copy here. you could insert the date here. so it's going to give you a chronological order of the different theme changes you made and so once you've done that, you can feel free to edit the code and test how it's going to work. so, how to edit the code? you want to click on those three dots there again, then go down to edit code. that's going to bring up the code editor for your Shopify theme. as it says, here you can edit your themes files. they're all gonna be dot liquid, which is going to be shopify's templating version for their themes. so overall, it can be intimidating. there's gonna be quite a few pages. now where you go is going to depend on what section of your Shopify site you want to change. so it could be the card page, it could be the collection page, it could be the password page, the overall page. there are quite a few files here. now, as mentioned, it's going to be extremely intimidating. you're going to not want to know exactly what you want to change before you start making any edits. you don't want to check exactly if it's working, because if it's not working you're going to have to go back and reset it. so you want to have a clear idea of what you want to do before you start doing it. so I'm going to do an easy example here just to show you the kind of overall process. it's just going to take a few clicks and only a very minor change. but let's say, on your blog page, Shopify is going to start paginating these pages when there are 12 or more blog posts. so let's say you have 13 blog posts, it's going to show show more. on the next page it's going to split it up between page one and two. let's say, for whatever reason, I want to make this blog post just one here. I have to go now find in the blog section to find out where it's making that limit and where it's cutting it off. so again, it's just gonna be changing so it's going to show one blog post per page rather than up to 12.. the way I do that head over to the Shopify blog section. so on the left hand you can see blogliquid. so I'm going to click on that one because that's probably going to be where the blogs are located. we can see here that it's located in the section for blog template, so I head over to this section is probably going to include everything related to the blog. I know it does because I've tested this before recording the video. but just for exploratory's sake let's search for blog template here. then on the left we get blog templateliquid, so that's where this section is located. so once I hit there, there's been quite a bit of code on this page. now I know this one is on the top here so we can just edit that. if we take a scroll through you can see it's just separated in different sections. I'm going to show the page title then as if there's blog tags and it's greater than zero, it's going to include this element that has a Blog filter. you can select by group. now if you don't understand HTML error and watching just a quick HTML course- there's probably videos out there as well- understanding the different sections of shopify's dot liquid template files and I'll give you an overall better understanding. mainly it just requires reading through here. so I know that this section is located at the top, so it's going to pagenate blog artikles by 12.. so instead let's just change that to one that if I hit one there and I click save, that should update that section. I'm just going to add some random text here to show further change. I'm going to show the page title. I'm just going to add master class blog post. just for an extra change here. hit save. then once I go to the blog page again, hit that reload button to reload those changes. I can see this section is now news Dash- masterclass blog posts. so it's gonna be the title section. we can see now it's been page needed by one blog rather than 12.. so if I click to the next page, there's my random intro blog post and here's my random post here. these are posts that were created in another video and there's no real content, but they're great here, just for an example, to show how to edit the code for your Shopify theme if you want very thin, specific stuff as well. if we head over to assets and you head to the themejs, you also get themescss not liquid. this will be more The Styling here. this can give you further ability to customize different files for your theme and how certain functions are running. this one was actually done JS, so it's going to be JavaScript. this scss is going to be a formatting for CSS. so overall, tons of different customizations you can make. I'd really recommend defining what you want to do first and then trying to figure out how to do it. if you just go and start editing things and starting to play around with things, you can very well just make a mistake that is hard to fix again. that's where we create a duplicate file but just denote that there. so overall, this concludes the video on how you can customize your theme code. we're going over an example here and just customize the blog template, not exactly changing the theme settings, but just to give an explanation and an example on how to actually change the theme code and see how it updates. overall, this concludes the video. If you enjoyed it. I would love it so much if you hit that like And subscribe button below. if you have any questions, leave a comment. lastly, I want to mention our sponsored profit calc again, the one click profit calculator app available on the Shopify App Store. it comes with a 15 day free trial. there's a link in the descri.

SHOPIFY TUTORIAL | HOW TO ADD CUSTOM HTML 2022

welcome back graduates. so today i'm going to be showing you how to add custom html sections to your shopify theme. now we're using dawn theme. it's a great free theme, but it's missing a lot of core features that you know. i think you guys need you know. in our previous videos, we taught you how to add parallax image overlays, taught you how to add an faq section. we even taught you how to add this beautiful instagram section. so now we're going to be teaching you- i say we, i'm going to be teaching you- how to do custom html sections. as you can see, we got an embedded map here, which is pretty cool. now this, this custom html section, allows you to do a lot of unique things with your store. you can embed things, you can write your own html. so, anyways, let's get right to it and show you how to do this and, as always, show you step by step by step. now what we got here is our sections, so our custom html folder, and you just have one file. now let's go right into our theme. as always, we start off with that home click on the online store. you'll end up in themes and let's go and edit the theme that we want to edit. so you're going to go and i'm going to open up the customizer in another tab, as well as edit code. now on here, i will show you that there is no custom html section. we've got our parallax feature that we that i showed you how to do and what else do we got in here. we've got the instagram faq, but there's no custom html. all right, let's go and solve that. it's kind of cool, though. they got custom liquid. that's really cool. all right. now let's go back to the code editor. now we're going to go into the sections folder. i'm going to click on add new section and we'll do. we'll call this: eg hyphen- custom hyphen- html. hit enter. now you're going to want to open up a text editor, like i always suggest. use it. use vs code or sublime, but for this case, notepad is fine for this tutorial. i only advise people to use code editors when you know you're actually trying to do development work. all right. so drag it over, copy it all, go into here, get rid of all that and paste it, hit save. it's really that easy. it really is. we make it painless for you, because that's what we strive to do. so now what we're going to do is we're going to refresh, reload and wait for shopify to take its time. now what we want to do is go into add section and we want to click on custom html. so, as you can see, here, we've got an html section. we also have a, an option where you can add, you know, text. you can align it, you can adjust the spacing, the margins, the padding, the background color, text color, max width. you can wrap it in a container if you want. but i'm going to show you a really cool site called powerio and what it allows you to do. it allows you to embed all these unique things. there's all kinds of different apps that they got. they have social feeds. you got media galleries, count on timers, form builders, more form bill builders- i don't know what these things are. it seems like they're saying the same thing over and over. but for this case, we're just going to go into the countdown timer. maybe you're running a sale and you're counting down the days until the sale ends or drops or whatever got it. so now we'll publish and we'll embed with code. we're going to copy this code. we're just going to go into the customizer. we're going to paste the html code right there, hit save and look at that. how cool is that? now, because i'm logged in, it shows that. uh, it shows, it shows this little button. but isn't that pretty cool? i think it's pretty unique. let's go and add another uh html block or section, rather, what else do they got in here? maybe we can go to like mapsgoogle, mapsgooglecom, and we'll- uh, we'll, type in: i'll just go to a previous line: embed share map copy html. let's go and add a map to our store. we're fancy like that- hit save and now you'll notike that some things right here won't always look great. so if you're trying to embed a map, we'll change this to a hundred percent and voila, we got ourselves a fancy, fancy map. i think that's pretty unique. so now you just learned how to add a custom html section to your theme and then again, this works on any theme. we're just using dawn. so if you really enjoyed this tutorial, make sure you smack that subscribe button. i really need to get better at saying subscribe button and as well as liking the video, because it helps us, it motivates us, it allows us to create more content, reach more people and, if you're feeling fancy, go and join our facebook group. it's a community of like-minded individuals who help each other out, teach you how to do different things, and there's some content in there that you won't necessarily be able to get on our youtube channel. and anyways, guys, thank you so much for watching and check the links in the description below- and we've got a lot, of, a lot of upcoming things that we're working on, like apps, custom themes, tools, you know, to help you find products. we're doing all kinds of cool things that you know behind the scenes that we want to release this year. it's a lot. it's a lot. let me tell you that, okay, and um, definitely look out. you're going to want to subscribe to this channel because you will see, you want to get notified, you want to know about our upcoming products and yeah, anyways, i'm rambling, so subscribe, tok to you later. bye.

More:How To Make $10,000 FAST Dropshipping T-Shirts On Shopify For Beginners

How to edit a Shopify Theme - Development Best Practice

hey, das ist jan vom letzten end days video ever made for small modifications to existing team der golf. das video ist die show. you can use the developer tools to find out exactly when its place changes- energiewende, ballast video of the week and find the correct team pfeil, die pending und change. you want to make the front and the fear hätten massives. bevor die vier euro. die familie musste shopsystem. we can stop the way. ok, so beck immer development store ohne page and to give the story of the world's gesamte letzte posten: helfe client, ente, client wants to remove des little sale text lag hier bei den city-fans one: fördern ein bett displays, tailings ist erfolg, sagt mit gc you save up to 15 prozent. over the wall ist der safe und das product eine fixe. überlasst video. you might think, okay, let's go tell it on the open update and later products, including der voerder section character and let there be just for fun action template ein bisserl, bring you tube template filewich konzert auf dem elend. liquid 104, just starting out, diesmal mit computing overwhelming. so, christian beeck, sexy die unicum exchanges. indessen, exercise 100 postämter, implement changes. union vigo hat manchesters problem. ok, superstores front and inspect element. automotive news. pace award gold to the losail text right click and inspect ein display bringt. bei chrome developer tools einige hätten ziehen. die ist wie vor. basically sie hier ist old age tml auf der website nsa hannover, die elements der elemente kate heiratet und websites und web site auf das windows tool des css sulz, der applied to any element in folge sampl, remove the context no longer be beugt wurde. auch eine focus on right now the search for us cs s klasse. select the one for sale. text vollpreis, item label. which way birgit prinz point to search for, in diesem fall ein oder holz notike ist der charakter: information center, container, div, class, quadrat, preis, so dass es demnächst reference point arbeitswoche in das team fall. zuletzt hauptbecken verletzt. okay, die very first thing. the search for that is des css glas verpackt an was für anders gehabt und es ist es die only match in dem very likely, das ist der place we wanted to about that i can always the test as safe, diesem fall effekte frontend. ein verliebtes test will appear at position sowie zwei piloten von der preisfront. perfekt. so instead of writing testen wie credit suisse cs s class tailings links und judith action zuletzt verdankt dort komplettpreis. next meines the park kreischef raed know that we wanted someone to display. result in präsent, denn die weide bei der kompressor produkt dort komplettpreis. next kloster, likud-blocks, editors and is [Musik] said and the front and we can say: you say the perfect, but we can do ist inspect. das elemente can relate to factors and i can't you. next ist: klickt es mit plus aktuelle news, es den autorinnen select of our new age tmn element, denn die linke wird sonst teil des erfolgs. ampel wie warnte kaller to get my baby wants to be wild, wird small, and we won't wait to be ok, actually i don't want to. the way to the bold - dies tue wird erstmals ein kapitel selector bss fall auf das team. the way to the bottom css, the wall of worry - be implemented first. you know, they saying, it just works and have any variance. update des change the whole story bietet. ferner hat das ist gut demonstration. ok, so lassen die saytec head business class aufpreis item label sowie katherine, falls das ist, wie das new sail ist, extended enterprise information is coming von disney park press. so let's go to the city and product dort preis researchcom label, preis item label hat. ist es die only imagine dokument in document sowie can be pretty sure that is it. play stay. don't want to remove das in teil, i just want to commit suicide und ist back. check the front and the text ist perfekt. aig ist ein letztes foto video zu dem hobby on something new, something ort der des made to basic, beide hände für just starting out. think des videos, super important questions of it. blicken livecom in section topix-index video zu. if i don't want to subscribe to the channel in die nächste video, weil

More:pacific theme shopify

#30 How to Add Shopify Custom Logo Option with Liquid Code | Shopify Liquid Tutorial Bangla

Hai, Asalamualaikum, salam kenalan. siakupiedu Amri Khairudin. custom logo ekoton. [Musik] upnya Fred Perry, sexcom. klik Open new tab. klik show costumes. [email protected] showroom score sheet. ajak Nesya met him. dotlink kuda Jonas Photo Shop kontrol * flash like comment section your site so alive Syaikh single-single. [Musik] custom house yang sedang Sule kosong headlam tak friderichsen itu. [Musik] six, seven halo testing. soliman robertson siksa Esia meledak ketombe waktu rewelcom Lego custom wartainfocom out gue close, close, bye, bye, bye. oke, Hai, kami asustek ludah kamu potong The Potters Dino sudah celup showfou tumben cair kirimin ke dalam produksi. Clash of my logo cross check data 15 tubuh main-main [Musik] di sungai kalau Amrik exploding, shakhrukh Khan fresco tinggal jenis kesel. logo main-main Icons 21 oke mereka getpaid4typing [Musik]. [Musik] klasecoid. [Musik] minhai background-color. Kok belum yo yo Asia, mereka tim tekanan vs Portugal strategi. so, so, much so, makhluk-makhluk itu mesinnya sih Soluna Jono tiba-tiba ikhlas tidak link Bucks los outdoorcom ngecor You are cover dan Februari atau Holden petsid, syukur Tekken, 5 menit. itu sering-sering the shoulder komentarnya khas kota bang letaknya ketombe. volume dari objek-objek suruh, kalau tak perlu, Taipei, Taipei, Taipei, Paddle Pop news turbosawmill speakernya, speaker mereka ide-ide logo-logo sudah segini full label blog info-info of love logo size of the sun. Shining status kau terurai. sinkronitas fullmoviecom loij dicelupkan AC idrmejaqqcom. selain berarti peluang PDIP conditioner, conditioner AC sering-sering ntar free download, edit settings. cotlookcom seblak fase-fase ini ok di akun, hobi serta usaha mereka. qq10q, semut saudagar kopi, kolam ikannya kabul kalibrasi. [Musik] sgp6d ini Seaworld Indonesia underscore: You are wrong with two hundred times Anggrek judi-judi easy electric motor fase-fase spandek polos Days pendek dengan spend the Close program. please benteng otot hebat sama lo kota yang tenggelam itu [Musik] tahu kali output kita. saya boleh itu livescore-livescoreim oke us dan worth it internet dengan Snow White, Astro rejeki tortosa dengan Club pynocare white 2011 by Time Teluk wazetoto3 tersebut depan suami dijangkau deh kalau mereka khusus para [Musik] suami bikin lagi ya pendaki Ami sedikit kuning archive password iCloud bikin tugas keluar j2me informasi dicampur dengan OS s60 rel di [Musik] Indonesia. ini [Musik].

Shopify Functions - a new way to customize Shopify

hey everyone, jan here codingwithyancom, shopify functions a powerful new way to extend or customize shopify features by writing your own backend code. and yes, you heard that right. for the first time ever, shopify opens up parts of the backend logic for us developers. now, saying it like that probably also raises a few questions like: how does it all work, exactly what do i even mean by back-end logic, how are functions different from traditional apps and how can we get started. but no worries, my friend, because coincidentally, that's exactly what we are going over today and i really hope you find some value in this. so then let's have a look. alright, so then let's get started by answering the how does this all work? and therefore, let's first consider the typical dev stack, which was also beautifully illustrated on the shopify devs channel, so we can think about a store in three simple layers. first of all, we have the database, so that's where all the data is stored, like historic orders, customers, the products that have been created, all the store settings and, yeah, just everything, or every bit of data that needs to be saved or stored somewhere. on top of that, we then have the back end, so this is where the website logic runs, like managing products, incoming orders, new customers get created, and so on and so forth- like all the behind the scenes logic, and the backend also writes the corresponding data into the database or reads it from there. like, for example, if you were to delete a product on the back end, it would also be deleted in the database, right? so that's just one example of the logic that's implemented behind the scenes. on top of the back end, we then also find the front end, which is usually built by using a theme, but it could also be a custom storefront completely built from scratch, and this is where we showcase our products or different data from the store. so the front end could be called the presentation layer. now, on each of these layers there are also different tiknologies that allow us to make customizations or work with the available data. like, for example, on the front end we could use liquid or hydrogen, and the database is directly accessible through the shopify api. now, historically, the only thing where we couldn't make any changes or augment anything is the backend logic, and it's also pretty much where apps would come into play, because they could implement your own routines, write your own logic and then, via the api, you could still read and write data from or to the database. so it's kind of similar to what the backend does, and apps already provide a great flexible way of extending the native features. but they also come with a few drawbacks. first of all, there are certain parts and areas of a storm that you just can't reach by using normal apps, like, for example, the checkout discount logic or the checkout shipping logic, because you can't just inject code right there. and that's already one of the key differences between the new functions and then traditional apps, because with the new functions you will be able to reach these areas, and actually the checkout discount logic is the first place where the backend logic is opened up, and then other key areas will follow over time, and i would also try to add a small list of like upcoming areas somewhere here on the side. the second drawback with traditional apps is that you would need to figure out your own hosting, which in and of itself is not too much of a problem because it's actually not too difficult. but if your app solves some time critikal tasks, then you might face some issues with limited bandwidth if your server can't skate up that quickly. and it's actually very important because with shopify websites, scalability is never an issue. you can have like 10 visitors per hour, but you can also have 100 000 and the website just doesn't crash. and that's actually funny because while i was still working in the agency, we had tons of clients who went to the german equivalent of the show shark tank. so this is like people would present their product ideas, searching for investors, and then all these websites had huge traffic spikes because it was like broadcasted on television during prime time and then our websites never had a problem with that because shopify takes care automatikally. but other wordpress websites were like crashing left and right and developers would be like crawling through the pieces that have once been called their website, begging us like: hey guys, how did you build these websites? and we were like playing it cool, yeah, just just use shopify whatever- and i mean, of course, slightly overplayed here, but based on true story man. we had a good time working in the agency, but anyways, what i'm trying to say here is that if your app solves the time critikal task, then it shouldn't be the bottleneck of the website and you just have to ensure performance. and that's also a new major benefit with shopify functions, because they literally run on shopify's infrastructure and can execute less than five milliseconds, and they also scale up yup to pretty much the largest sale events on the planet. so how cool is that? all right now, the last key difference i think you should be aware of is that, with shopify functions, we can now seamlessly integrate our settings into the admin dashboard. so, for example, if we're toking about a discount function, you can also have the settings or the interface to configure your function right at the discounts, where it actually makes most sense. and with traditional apps, you would always have to go into the apps tab, then bring up your app and then configure everything there. so i think that's an improvement. however, it's very important to understand that the settings for your functions or the interface to configure everything still has to be served through your own server. so that's exactly the same as with traditional apps, and only the time critikal scripts will actually run on shopify's infrastructure. so that's the difference here. and, yeah, i think it's also important to understand that shopify functions are installed through normal apps. so that's a commonality. you can share and distribute everything via the app store, which is awesome because it's like a super large audience. and, yeah, maybe the best way to think about them is that shopify functions are not a completely different thing. it's more like a new feature or something you can add to apps. and if that was confusing by any means, let's have a look at the following lifecycle diagram, because that will make things crystal clear. alright, so it all starts with the app developer, who adds a function to an app. then, when everything is ready, you can deploy the app so that a merchant can install the app on the store, and it's also where you would configure everything using the settings, and these settings come from your app server. then, when everything is configured, the app developer or the app makes an api call with the current configuration of that function. so this is kind of where the function gets uploaded to shopify's infrastructure and then when a customer interacts with the website, let's say, adds a product to the card, that's where your function gets actually executed on shopify's infrastructure. and i think this diagram is the best overview you can get, and it's also available in the shopify docs and if you're looking for that, the link is in the description. okay, so now that we have a high level understanding of how everything works- and i know there's a lot of information to take in also takes me quite a bit to do these summaries here. but now that we understand that, the question would be: how can we practikally get started? what are the best first steps? and first of all, we need to understand that shopify functions are not any different from like normal functions we know from programming. now you have an input, then you have the actual function where you write the logic, and then an output. in order to get started, you just need a few things up front. so first of all you have to pick

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.