Flex theme shopify

Find out your best Shopify theme and theme on shopify in less than two minutes

Find Shopify Theme — it's free
No difficulty
No complicated process
Track competitor's stores
BACK

Building the FLEX Theme Shopify 2.0 Part 1 Shopify Academy

what's up everyone edwin anthony here,again back at it with another video and,in this video we're going to learn about,out of the sandboxes flex theme,so if you guys are brand new to my,channel what i do every so often is that,i talk about theme setups everything,related to shopify so if you like this,type of content please make sure that,you go into the subscribe demolish that,subscription and also don't forget to,turn on that notification bell so that,you'll be one of the first ones to know,when we come out with these videos,so again uh going over this what are we,talking about we're going to help you,guys install,flex and we're going to follow a,specific theme before this let's talk,about the company here real quick just a,quick introduction so the folks at out,of the sandbox are one of the first,pioneers of building themes for shopify,right and the theme that we're going to,talk about is one of their most highly,and probably one of the most expensive,themes that they have out of everything,if you guys check out my channel um i,also have one that talks about turbo so,make sure that you guys watch that uh so,if you guys you know want to make sure,that you like the style on how i teach,and all that stuff go go ahead and check,out that video first if you want to and,if you're already used to my style we're,just going to dive right into it so out,of the sandbox one of the top theme,developers they've created this theme,called flex and of course if you're,interested in getting started on this,i'll leave a link down at the,description so you guys could go ahead,and purchase a theme and then just,follow along but let's look at this as,towards what it has to offer so as of,today october 26th,we noticed that flex is now part of,store 2.0 so they just recently updated,their theme and it's called flex 3.0,that offers shopify's operating system,2.0 which is very good it's like really,really good i love store 2.0 because,they just have everything and they load,pretty quickly and so far so good based,on the experience,uh so reason why flex because flex has a,very nice interface that it allows your,store to look more than one way,you don't have to go very heavily on,investing with developers etc and you,could switch up your store to look many,different ways that's why flex,is a very good investment,and take a look at all these styles,you'll see all of these demos look there,is a lot of demos and as you can see,some of them kind of look the same but,you could see the difference as to how,your website could look like right not,just one way so we have like the menu,horizontal system and then we have this,other way where it has this vertical,interface which is nice,so if you're planning on having multiple,businesses or if you really need a theme,that's just very very flexible when it,comes to the type of niche take a look,at flex flex is definitely a very good,investment from a very powerful theme,development company which is out of the,sandbox,the one that we'r

The above is a brief introduction to Flex theme shopify

Let's move on to the first section of Flex theme shopify

Out of the Sandbox - Getting Started with the FLEX Shopify Theme

Out of the Sandbox - Getting Started with the FLEX Shopify Theme

introducing flex a revolutionary and,innovative Shopify theme brought to you,by out of the sandbox with ultimate,control and unlimited options flex gives,you the power to bring your ideas to,life the Flex team includes multiple,layout options for customizing your,storefront,additionally in these layout settings,you can select between several header,and footer styles to choose your,preferred layout option like you see,here flex also includes different,product page templates built into the,theme which can be chosen here as well,you can choose between classic image,scrolling or sections,the product page template you choose,will be the default template for all,your product pages alternate templates,can still be used for individual product,pages however the template that you,select here will apply by default we've,built Flex so that you can fast-track a,shop setup based on a demo shop our a,theme updater app now includes a demo,shop import feature exclusively for the,Flex theme this means that you can use,all of the content sections and images,as seen on our demo shops on your own,shop we hope they'll make shop setups,faster and easier while also flexing,your creative muscle in addition to the,site wide general color settings flex,also includes per section color settings,if you head into a section you will see,additional color settings with color,Pickers next to them they'll be,transparent by default but if you'd like,to choose a color to override the,general color setting you can just,update these if at any time you'd like,to revert these back to use the general,color setting you can click none and,they'll go back to using that general,color with Flex you'll be able to add,CSS customizations to sections directly,within the theme editor,create CSS classes or target other,elements within the section and apply,styles all without having to leave the,page sections and flex also include,additional layout options for ultimate,control like you see here if you're,looking to add some creative flair you,can play around with gradients and also,make use of our comprehensive icon,library,the flex theme comes jam-packed with a,countless number of additional features,and settings so any shop is using flex,can easily have a personality and look,all their own,you

After seeing the first section, I believe you have a general understanding of Flex theme shopify

Continue the next second section about Flex theme shopify

Full Width Product Descriptions Flex Theme

Full Width Product Descriptions Flex Theme

hey scott austin here from jade puma in,this video i'm just going to show a,quick little,tip on how in the flex theme with online,store 2.0 you can get your product,description to be full width,so out of the box so there used to be a,a theme,or in in the theme version before online,store 2.0 in flex there was a template,for product description full width or i,think it was called bottom description,or something like that and it's not,available in the new version because,it's not needed in the new version,so if we go into theme customization,right now i've got the default uh,product theme selected i've got a lot of,sections added on to this,page or this product already i even have,in here so if you're going to product,information this is where your,description is right it's a block,inside of the product information,section but that section is half width,right it shares half the width of the,screen,on desktop with the images,so your product description if it's,longer like this,it ends up getting you know it can go,really long and it's only taking up half,the page so i always like to take that,when appropriate and move it underneath,and go full width,so but this,block in the section allows me to move,the description,anywhere i want within the product,information section but that's always,half half screen,so the way that you make it go full,width is you actually turn off this,block you can actually remove it i'm,just going to turn it off here for,demonstration purposes and now what we,want to do is go down to,the sections and let's add a new section,custom liquid and this is a new section,type inside of online store 2.0 and it,is absolutely fabulous so you may have,used custom html before which is,powerful custom liquid is even more,powerful so now,all you all you have to do is,put in the liquid for the product,description which is just curly brace,curly brace,product dot description,save that,and now my description is full width and,i can place it anywhere i want along all,of my different other sections that are,added so in this case i want to move,that all the way up to the top,underneath the product information,section,so that as soon as the,product form and the images are showing,up right underneath that is the product,description so i'm going to save that,go out to the front end and look at that,page,and what you'll see here so it now we,have it full width which is really nice,but you'll see,there's some css issues going on the,spacing is a little bit different,and this is one of those little things,you learn in using the flex theme over,time,what you need to do,is to wrap your whole product,description liquid code into a div right,so we just put a div around it which is,super easy to do,right so that's just some html,but what we need to do to that div is,apply a class to it,and that class,is called content,because the,flex theme css does a lot of styling,things,based on the class content so it'll say,you know dot content h1 in the css or,dot con

After seeing the second section, I believe you have a general understanding of Flex theme shopify

Continue the next third section about Flex theme shopify

Flex Shopify Theme Free Download || Best Shopify Theme Free

Flex Shopify Theme Free Download || Best Shopify Theme Free

hello welcome today i'll show you how we,can easily download the flag shopify,theme,and fully free from my store you can say,the,flag shopify theme in the premium,traffic theme it cost around for,around 500 dollars,is a beautiful looking theme and you,will have a lot of feature in this theme,you can see the,store using flex theme it's so beautiful,but today i will give you the file of,the flagshopify theme and it's,completely free you don't have to pay,anything and you will easily can use it,on your store and any shopify store so,don't worry let's go what you can do,it's a flagship of a theme let's see,this store,how it's looking,it has created with the flagship effect,theme,it's looking so great you know,so nice looking product slider,it is a quick view section also,i'm just loving this theme,live easter home decor i think this is a,product slider also product page,and this is the nice feature,okay great one and it's also responsive,theme,you can see on the mobile phone,it's fully responsible,okay let's move to the main point and,today i will discuss how you can easily,download the flagshopify theme from my,store okay then i will give you the link,of my,of my store on the description section,when you click this name and link you,will come to this page,it's the flagship with a theme free,download page,where you are scrolling this page,then you will see this link,download now button you will have to,click on the download now button,while loading i want to say something,that i am a graphic i am a designer of,shopify surface store from fiverr i'm a,freelance designer if you want to design,your store from the fiber you can ask me,i will give you the link of the fiber,okay when you,open this and you will have to click,download on it,then you will just have to download on,it,okay flex custom theme,it's downloading i hope it will be,downloaded soon,now we will move to my shopify store,it is my shopify dashboard it is the,theme section and now i'm using the,brooklyn theme it is a free theme and,you can easily customize it but it's not,so good looking,it's not so premium looking thing you,know,if you are if you want to run a premium,look store and if you want to,create your brand on your own then you,have to,go with the premium theme it's not so,good for you,if you want to start with this theme,this is a brooklyn theme it's a free,from the shopify but i don't think it's,so good to go on here we can see this is,the theme,and i don't like the customizable of,this theme,the collection page on the product page,it's so,confusing here,people don't,know what is this,okay let's move to our flex shopify,theme if you want to,if you want to,download the shopify flagship theme and,then you will have to add theme button,upload deep file,add file,where i have downloaded it it is flex,custom theme then you will have to click,and open it but i have already installed,the flagship theme on my store so i,don't have to install it again you just,have to do it then i want to c

After seeing the third section, I believe you have a general understanding of Flex theme shopify

Continue the next fourth section about Flex theme shopify

A Link List Section for the Flex Theme on Shopify

A Link List Section for the Flex Theme on Shopify

hey Scott Austin here from Jade Puma and,for all of my stores I create a page,called brand guidelines and it uses a,custom section that I created called,brand guidelines that allows me to put,in you know what logos we're using what,the color palette looks like topography,information and I also have information,in the bottom of this one for flmb where,I have links to video tutorials and I,also have links to store management,tools and this whole thing started off,as one big section with lots of elements,you can add to it and blocks that you,can add for the different types of,content and the problem I came across,let me just open this page up in theme,customization inside of Shopify admin,the problem I came up with is a section,currently is only allowed 50 blocks,and here if I open up the brand,guidelines you see I've got I don't know,how many that is let's just say 2025,different uh blocks added for colors and,the video tutorial links and headers,and then I was also adding you know,other links for the story management,tools section here and I hit the 50,limit so I created a new section,that just allows you to add the link,list,um that you know here's store management,where there's you know headers and then,links so that that section works like,this you can add it to a page,and it allows you to Define what the,header is going to be and uh you know as,much information as you want underneath,for an explanation you can also set some,colors and some spacing and then the,blocks you have two options for blocks,you have a link header and a link and,they're pretty simple the link header is,this element here,and all you get to do is put in what the,text is for that and then links are two,elements which is the title which is,this information right here,and then the actual link,that you know you want it to go to,and it shows the link uh as text and it,is hyperlinked so it'll take you to,whatever that element is,um for the cut for the consumer of this,page they can quickly link off to,different things,so that's the section pretty simple one,to add it to your store all you have to,do is create the new section using the,section name that's shown on the,tutorial which is if you're watching,this on YouTube there'll be a link in,the YouTube video to go to the Jade Puma,site where the code is located if you're,on the YouTube or if you're on the jpuma,page already watching the video then,just look down below the video you'll,see the code block there so create a,section with that title name and then,just copy the the code from that code,element paste it into that new section,and you should be able to add that,section to any of your pages in your,store after that all right hopefully,that helps thanks for watching

After seeing the fourth section, I believe you have a general understanding of Flex theme shopify

Continue the next fifth section about Flex theme shopify

Adding or Editing Products on Shopify (FLEX THEME)

Adding or Editing Products on Shopify (FLEX THEME)

all right guys so,right now i'm just going to show you how,to go ahead,and add a product to your shopify,website,so basically when you log in to,your shopify you will come to,this page which is basically your,homepage um if you,select products it will take you to this,page where you'll see,pretty much like all your inventory you,can also filter your products by,name as well here or product vendor,availability etc,you can even sort it i think for most,popular,too so there you go so you can see your,low inventory your high inventory,um your old newest etc,so that this is basically that screen,where you can view all of your inventory,on your back end which also gets shown,on the front end of the website so,there's a couple of ways that you can,add,a product but for smaller inventories,which is what we're doing today i'm just,going to show you how to,add it without importing a csv file,so we'll just go ahead and add a product,simple product,um so pretty much here,what you'll do is you'll add your title,so whatever that may be,you might just say i don't know it's,just for the sake of,putting something there um would you say,that's the helmet,you'll add your description which,generally typically looks like this so,i'll show you guys what it will look,like,so for example let's just go to eraser,top,um not gonna let you click on it for,some weird reason,so let's go to shop here this might just,be a bit easier to actually go,into it there we go,okay so um the description will have,everything that you see in this section,right so underneath the pricing is what,you will see,so fi approved and sfi,foundation is actually an image so in,order to add that,you'll need to save it i'm just going to,save it to my pictures,and save image pictures there we go,um and then that is just a whole bunch,of text so say for instance we wanted to,add this,we just copy and go ahead and paste it,and to add an image we'll just insert,image it actually should be in here too,but i'm not entirely sure,let's just have a look we might have,already uploaded,that little yes we have okay so we just,insert that one,and then we'll insert the other one too,so just scrolling through now,then you insert that image and there you,have it,um media is what you see here,so the first one will actually show a,bit larger,which is this one which is the one that,gets mainly shown then you can add your,variations,uh pretty much you can add that there,it's pretty self-explanatory,your price so comparing that price is,like a sale,price so if you um for example you know,it's i don't know something's 50,and then you want to mark it down to 25,half price um,so that's just what that does so even,here you,you'll see what it means um cost per,item so,if you guys want to figure out your,margin and your profit that's where you,add that in here,uh and,for inventory look you don't really need,a,sku or a barcode for anything,that's is a very small inventory i,like you can add it if you want to for,example if you ha

After seeing the fifth section, I believe you have a general understanding of Flex theme shopify

Continue the next sixth section about Flex theme shopify

Shopify Theme Review Flex by Out of the Sandbox [2022]

Shopify Theme Review Flex by Out of the Sandbox [2022]

hey it's klaus here with another,e-commerce coffee break this time i will,do another shopify theme review,and we will look into the flex theme of,out of the sandbox so let's get right,into it,so here we are on my shopify partner,demo store,and the team of out of the sandbox,was nice to give me a free test license,to show you the flex theme so you can,see here we are on the preview of the,store,and i have not done a lot i just went in,briefly,and did change a few things and,i want to show you basically the back,end obviously on,the theme library of shopify if you go,in there in the steam store,you will find flex look for flex from,out of the sandbox,and they have a couple of demo stores,which are fully,layouted and whatsoever that you can,have a look at,for me it's more important to show you,the back end because obviously that's,where you want to work on,so i said this is the demo store that i,have right now,and now let's dive into the back and,then see what the theme has,so the um out of the sandbox gives you a,um app which is called a theme updater,and with the theme updated then you can,install,there are different themes so you will,see here flex is here,and let's go into customize and see,what's happening in the back end of that,theme,let's move this over here,so um it starts and showing you the home,page here but i actually want to start,with the theme settings down here,so the theme settings gives you the,basic um settings for,the flex theme and there's a couple of,things that you can,do here i want to say flex has a lot of,options,implemented in the theme which is a good,thing,because it might save you money on,hiring a software developer,for certain features because they are,already in there,on the other hand it might be a bit,confusing and a bit of a learning curve,when you start working with the theme so,here we have a couple of options,announcement bar which is up here um you,can put this on and off obviously,i would always recommend having a,notification bar up there,as you know it's gone it's also called a,hello bar announcement bar,notification bar it's all the same word,um for the same thing or different words,for the same thing,up here i would always have some,information on promotions,on free shipping you have seen that on,many sites,but it has been proven very very useful,then you can already have a pop-up in,here,so you don't need to have another app,for implementing a pop-up,the theme comes already with a pop-up,generator in there which can be quite,handy um,but depending on what kind of features,you want to have for your pop-up so for,instance,you want to have a timed pop-up for,not only exit intent pop-up you might,want to go for an,app nevertheless and then you can have,a couple of a fixed message bar here so,that would be another bar i wouldn't go,for too many bars on top of here you,want to keep,your header very very narrow so that the,main content,of your store always is on the screen,without scrolling down,one interestin

After seeing the sixth section, I believe you have a general understanding of Flex theme shopify

Continue the next seventh section about Flex theme shopify

Add Gallery Template to the Flex Theme in Shopify

Add Gallery Template to the Flex Theme in Shopify

hey scott austin here from jade puma,in this video i'm going to explain how,to create a new gallery template,in the flex theme so i'm using this,fraggle tribe store that i'm building as,an example here,and you can see they've got multiple,lookbooks and each one of these,lookbooks,is a page right i can see that up here,and if i click on the edit page,functionality there,and open it up in the shopify admin what,you'll see,is the template that is applied,is the page.gallery-3 template,now the theme comes with a,page.gallery template but only one of,them and the thing is,if i look at another one of these,lookbooks which is also a page you know,with a gallery template and i edit this,one,in the shopify admin it's going to have,a different template applied to it this,is gallery dash,4. and the reason for that is,notice there's no content here in the,page right,so all the content that is showing up on,this page,all the photos that information is,stored,in the theme settings so over here in,the shopify admin,i've got my uh customized theme,functionality open,on one of these pages already uh one of,these uh lookbook pages,and you can see here under gallery,if i open up that section that's where,all of the,image information is stored right all,the all the photos and any links that,are in them,um so if i was to apply the same you,know gallery 4,template to another page it would have,the exact same content i couldn't have,two separate pages with the gallery temp,the same gallery template apply,with different photo galleries so every,time you create a new,photo gallery page you have to create a,new,photo gallery page template so what i'm,going to do is show you how to do that,and it's actually pretty simple we're,going to go edit our theme,code but we're not actually going to,edit code we're just be doing,copying and pasting inside of the theme,code so this is the kind of,process that people without any code,skills could totally do,if they follow these steps here so let's,go into edit code so i went into,online themes or online store themes,and right now i'm working in the live,theme so i'm going to edit the code and,that live theme,and what i'm going to do is close out,anything that's already been opened,all right so if i look under this,template section here you'll notice i've,got a page.gallery.liquid,now i've got page.gallery one through,nine for the eight different lookbooks,that,i've already created and we're going to,make a nine here but,your your theme when you open it up,should have a page.gallery.liquid,now if i look at that file you'll see,that it has,um a couple sections in there of a,banner and a gallery main,so what i'm going to do to start off is,i'm going to click on this,add new template and i'm going to add a,new template and it's going to be a page,template,and it's going to be named gallery,nine right because i've already got one,through eight,you can also you know name it for what,the gallery is going to be about if you,wanted to,um you k

After seeing the seventh section, I believe you have a general understanding of Flex theme shopify

Continue the next eighth section about Flex theme shopify

Show or Hide Sections between Mobile and Desktop on the Flex Theme in Your Shopify Store

Show or Hide Sections between Mobile and Desktop on the Flex Theme in Your Shopify Store

hey scott austin here in this video i'm,going to show you how in the flex theme,you can take a any given section that,you're showing on the home page a,product or a page where wherever you're,using a section and you can say this,section,i only want to show it on desktop or i,only want to show it on mobile,and let me show you an example of how,that works so here i am on the home page,of fit my foot,and i've got these pressed logos and,there's 10 of them on desktop,and you'll notice when i switch to the,mobile view there's only four of them so,i use this hiding and showing between,desktop and mobile,um to make that happen to show 10 on,desktop and,four on mobile let's go on the back end,and look at theme customization what,you'll see,is over here on the home page i've got,two logo lists,this is the one with 10,and this is the one with four logos in,them now if we click on the one with 10,over on the right where we have the,details for the section if i scroll down,you'll see this css class,and i,typed in show desktop,on the,mobile version,i typed in show mobile,so by adding that css class right there,that's what's hiding on on mobile the,desktop one so the desktop one is shown,on mobile hidden on desktop,and the,logo list for the mobile where it says,show mobile that is shown on mobile and,hidden on desktop,now,the flex theme has css classes that,automatically do this but i always,forget the naming of them because,they're not as intuitive to me as show,mobile and show desktop so i always just,make my own and it's really easy to do,it's just a few lines of code,so here in my i always make a custom css,file right so you can see here i have a,jadepuma.css.liquid file so i don't edit,styles.css.liquid you know which is the,themes css file i only edit or i add,additions to css in my custom file so,here,is you know the few lines of code it,takes to do the show mobile and show,desktop functionality,where on the normal displays this is you,know on desktop,uh we're hiding the mobile so display is,none and we're showing the desktop,display is blocked and then when the,screen is less than 798 pixels then,we're showing the mobile and we're,hiding the desktop display is none for,desktop now the flex theme has three,major break points or two major break,points for three major screen sizes so,they have the mobile and the break point,for mobile is 480 480 pixels and then,they from between 480 pixels and 798,pixels that's the tablet screen size and,then desktop is anything at 799 or over,so here you know i could have had a show,mobile show desktop and show tablet but,that just means you have to think more,and and add the right elements in,you know you would you would add show,mobile css class and show tablet and,it's just too confusing to remember so i,keep it simple there's just mobile and,desktop and in this case i've designated,that,mobile also applies to tablet if i,wanted mobile to only apply to mobile,and assign tablet to desktop then i just,change this,max wi

After seeing the eighth section, I believe you have a general understanding of Flex theme shopify

Continue the next ninth section about Flex theme shopify

Building the FLEX Theme Shopify 2.0 Part 2 Shopify Academy

Building the FLEX Theme Shopify 2.0 Part 2 Shopify Academy

welcome back edwin anthony here,resolutions design back again with,another video now this is the part two,for the flex theme for everyone who is,watching in this series make sure that,you go ahead before entering in this,tutorial make sure you watch the part,one which i explained how i set up how i,installed flex how i set up all of this,that's what we covered in the last video,so if you're not caught up to that go,ahead and check in the description as,well as check in the home page and,you'll find right there the part one of,the series so make sure you go ahead and,check that one out before moving forward,with this one,all right guys so in this part two for,this series what we're going to do is,we're going to complete the home page,what we're trying to do is we're trying,to fill this out similar to the flex,theme demo,um and let's get right to it of course,don't forget to smash demolish that like,button um and also the subscribe if,you're brand new to this channel we talk,everything related to shopify all right,let's get right to it uh let's go here,in continuing uh so right now what we're,gonna focus on is the main banner so the,main banner right here uh don't forget,to make sure that you have all of your,images ready to go,i've explained this in the part 1 of the,series how you need all of these images,ready versus going back and forth right,here you can see that i named,this image called main banner and that's,what's intended to use for this right,here so let's get right to it right here,on the left hand side uh we have image,with text overlay let's see what this is,about,so image with text overlay is exactly,what this is right here this is the,image with text overlay so i'm going to,click on this to get inside of the,property settings and right here it's,asking me for an image i'm going to go,click right here to search i'm going to,click right here to upload and then from,here let's go ahead and look for our,images that we were looking for,let's see here let's go inside here,and the image that we're looking for if,i'm not mistaken is this guy right here,main banner let's open that,and that uploads into the database for,shopify,so that we could go ahead and add that,picture there press select on the bottom,okay i'm going to leave this as is for,now and let's see what they had,previously they had new collaborations,with arts community all right so they,had this as a text,and then over here well it pretty much,says the same thing and then right here,a button that's called check them out,so if you want to change this uh,information you could go ahead by,changing the subheading as you can see,right here and then we have the call to,action which is called check them out,right here and then we have somehow a,collection that's probably preset so,a good idea in order to click on a,specific destination uh let's see what,our collections what what do we have we,have all collections classic news,uh let's go back here let's say,products,so for products i'

Congratulation! You bave finally finished reading Flex theme shopify and believe you bave enougb understending Flex theme shopify

Come on and read the rest of the article!