Get Started With Elementor Containers | Part 1

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
Hello people, my name is Ferdy and it is Elementor  time. It is time to create websites using the   Container Builder if you know Elementor already  for a while you've been waiting for this the   new Elementor container Builder what is the story  well before we created the website using sections   columns and elements with a container Builder we  will make website using containers and elements   the learning curve is a bit harder but I will  show you step by step how to work with this this   is my first store about the container Builder so  let's Dive Right In we're going to focus on the   positioning and I will make much more tutorials  where I will cover everything about a container   Builder so let's get started with rebuilding  the website of tesla.com or a desktop tablet and   mobile when I go too fast for you you can go to  the settings of the YouTube video and change the   playback speed to a slower one or you can click  on the left arrow on your keyboard and go back   5 seconds in the video in the description of the  video I've timestamped so if you want to go to a   certain part of the video you can click on one of  the timestamps and you go directly to that part of   the video so in this tutorial I'll show you how to  create a page like this Tesla home page using the   Elementor container let me show you a few things  I will make use of the hello theme besides that   I will make use of Elementor and Elementor Pro  if you don't have that you can go to 30corp.com   forward slash L Pro hit enter and if you want to  start with a license for just one website you go   to this one 49 per year and then you have all the  features of Elementor Pro you can buy it fill your   details download Elementor Pro upload it over here  connect it with your account and you're good to go   and I use Save SVG because I want to make use of  the Tesla SVG and one more thing I go to Elementor   custom fonts I use the carbon Electra font that's  how I call it because that found looks like   the Tesla font you can also use another  font I go to the website I edit this page   and I want to edit this page with Elementor if you don't see this container over  here go and exit go to Elementor settings   experiments scroll down and when you see  the flexbox container put it to active   and save it then go back edit with Elementor and  you'll see the container well a few more things   before you get started if I click on the three  lines and I go to the user preferences I prefer   to use the dark interface I prefer to use the  editing handles and when I go to the site settings   Global colors I make use of those three  colors which are from the Tesla website   and I grab my Colors by using the Google Chrome  extension color pick eyedropper so I click here   and I can select the color copy the  color code and use it in Elementor   so having said that let's get started I close  this and I want to go to the settings here   below and I want to change this page to page  layout to a canvas that means there's no header   there's no footer there's just one beautiful  canvas and we can paint it with Elementor wow   so I'll just start with a header so I click  on the plus and I want my elements to go from   left to right so I choose the arrow to the  right and now I want to fill this with an   image and two navigation menus just like here  the image navigation menu and navigation menu   so I go to this area to all the  elements and I search for an image   then I drag it over here click over here and I go  for the Tesla image I will configure this later   then I go back to all the elements I  search for the nef menu I drag it over here   sometimes it needs to become blue then I  release it and there it is and then I can   hover over here duplicate it click over here and  change the menu to the Tesla second manual well   if we take a look I can update it and I can click  on the I and the gray thing is with the I when I   change something so I make the logo a bit smaller  I go to the style of the logo to pixels and I   make it to 122 and I click on update look at this  automatically it will change so that's the great   thing about this eye so when I change something  I want to see it well I want to compare this with   the website of Tesla but I don't like this bar  over here so I hover over here edit my profile   and then over here at the toolbar I uncheck  showing the toolbar when viewing the site   I update my profile and close it I go to Elementor  I click on the I now I don't see it anymore so now   I can compare how it looks well there's a lot of  work to be done yet and by the way I use images   and this one I used the SVG Grabber right Mouse  click over here and I can save this background   all for personal use or for the tutorial Elon Musk  and I are friends so he's totally fine with me we   also have the same birthday he's from South Africa  I love South Africa so we're buddies in my fantasy   world so uh yeah and I drove a Tesla so he must  be really happy with me so let's go back to the   tutorial how can we make this look like this I  want to go for a second area click on the plus   this time arrow down so all the elements will be  below each other then I go to The Container Style   I choose the background type classic  and then I want to upload an image   that is this one from model 3. insert the  media then I want to change the size to cover   change the position to Center Center and then  it will go to the center so if I will make this   bigger look at this the the Tesla will remain in  the center so I go to The Container layout minimum   height if I increase it it stays in the center  because we just said it should stay in the center   but I don't want to create a height customizing  pixels because every desktop screen is different   I want to remove this and I want to go  for the viewport I this is the viewport   So based on someone's computer screen the height  of these images decided so viewport height should   always be 100 percent that means that it will fill  the whole screen so if I make this website smaller   it adjusts beautifully okay still not like  this but we're getting a little bit closer   so now I want to go to the upper header so I  can click over here or I can use the Navigator   and then I can select the container if I double  click over here I want to call this one the header   I can collapse this then I can go to the second  container this one double click and I call this   one the model three so right now it's time to  talk about items and Direction and for me to   re to remember it I think about One Direction  and justify Bieber and that way I never forget   that's all about directions and justify content  One Direction Justified Bieber wow I came up   with it myself whoa I'm so smart what okay  let's continue with directions and justify   content so let's take a look at this header  first how can we make this look better I go   to this area so I select another container and  then first if I update it and I take a look   but I see this is boxed it's not completely from  the left to the right over here it is so in order   to change that we go to Elementor to the container  and the container width is full with that means it   will be completely on the left of the screen  to the right but here there's an empty area   why is that well over here I set the direction  of this header should be from the left to the   right and that's why I decided to use that  Arrow over here I can also change it right   now everything is from the left to the right next  to each other I can also put it below each other   so the logo first menu on the second menu I can  also reverse the horizontal row so right now here   is the first element the second element and the  third element and also with the vertical area I   can reverse it I use this one or this one look  at this when I click on this Arrow right look   at this area and this area it changes so based  on those two settings those settings will be   adjusted so let's start with a row horizontal  so everything is from the left to the right and   I see this Gap over here so how can we fix that  well we can justify the content right now it's   aligned to the left so if I update it it's all  at the left I can also align it to the center   update so everything we do over here is  horizontal the third one is at the right and then there's my favorite one for this  one space between that means that the first   element is totally at the left and the  last element is totally at the right   like this hey this is getting more as I have  it in mind so it's great then there's this one   space around so that means that over here  between two elements there's two times the   amount of space as over here so what I also  can say I can divide it or space it evenly   that means that between all the elements  and at the sides the space is the same so   this is the same as this area so all  those white areas have the same width   but as I said I like the space between because  then we have something at the left at the right   and at the center but more important look at  this this Tesla logo it's on the top and this   is in the center and this also how can we fix that  well we just talked about the horizontal settings   now at the Align items we can talk about the  vertical settings so I can say everything should   be at the top but what I prefer everything  should be the center vertically oh and now   this looks already so much better than what  we started with so what we're gonna do now   we're gonna take a look at betting and margin in  order for everything to work and sometimes it's   it's just a matter of playing around and that's  what we're going to do we're gonna play around   with pixels it's like I'm living with pixels  okay this is a weird joke that's the YouTube   channel of my friend Reno so don't check him out  because I want to be the most successful YouTuber   in the world you know what he can be number  one I'm number two so check out his channel let's continue what I want to do since we have  this beautiful header over the background I   want to do the same so first I want to choose  the height of this area and I can measure it   a little bit so I can now alt shift command or  I can measure this a little bit so it says 80 I   think it's a little bit less what I can do I can  go to Elementor to the container of the header   and change the minimum height if I increase  it look at this but if I decrease it   it's a minimum of this and it seems that  I need less space in this error so how can   I fix that if you cannot make it smaller  or closer or shorter than this area go to   Advanced and uncheck the betting because by  default there is some padding I uncheck it   and then I go to The Container layout and over  here the gap between I want to bring it to zero   now you see there is not much space and  that's exactly what I want because now I   can decide how much space I want to have and  I think it is 52 pixels update so let's see okay so now we can configure it even further this  is a container tutorial it's not a design tutorial   so what I see over here this looks really weird  you know what let's go through these settings   really quick but it's I don't want to focus on  styling but okay I want it to be like this I   cannot create an animation that's a different  tutorial but I can make it look like that so   I click over here and then I change the pointer  from underline to background so right now I have   ugly ring backgrounds I go to the style  then I change the typography to Garmin okay then it's way too big so I go to the size I think 13. and I want to change the weight  right now it's a little bit smaller than this   I can bring it to medium  okay so I'm happy with that   then we have the horizontal padding  I can bring it close to each other or I can spread it a bit more so I think 17 is  great then if I hover over it I want a vertical   padding because over here when I hover over it  the the background is not as big or as high as   over here so if I increase this look at this  I hover and then I increase this now I can see   how big the background will be so how about  five then I want to change the background color   by going to hover and change the pointer color to  Black and I can make it transparent so I bring it   all the way to the left almost all the way now  when I hover over it looks like that and later   we're gonna take a look at how it looks when this  background is over here let me go back over here   I would have a border radius because over here  there's a border radius so border radius let's   increase it to five great and when I hover  over it I still want the text color to be dark   yes I like the settings so I say right Mouse  click copy right Mouse click base is still so again we're a little bit closer to the style  I have in mind or the the website of Tesla is   so now I want to bring this background below the  header how can we do that well if I take a look   over here at the container I know the height is 52  pixels so I go to the model 3 container then I go   to Advanced and I uncheck this because right now  if I increase it it will be increased everywhere   if I uncheck this I can also increase or decrease  everything individually so right now I'm creating   more spacing so I go to the minus minus five  and then A2 bomb and now it's behind it but   the logo disappeared because this background  is in front of the logo so I go to the header   I open this I go to the image and I need to go  to the Z index at Advanced and the Z index is   kind of a layer so I say the Z index of this is  10 that means it's in front of this area because   this area if you don't have a z index it's by  default zero so the image the navigation advanced   then and the other navigation are in front of   the background otherwise things  disappear we don't want that so update like that now like that so now it's a matter  of how can we make it look exactly the same   when it comes to positioning s the Tesla website  well what I see if I make a screenshot over here   maybe there's a fast way to do this but I do it  like this I go to photoshop I drag this to the   center and it snaps then I select this area  from the model area of on over here I create   a new layer beautiful purple and duplicate it  holding alt it's not a Photoshop tutorial if I   select them both what I see this is  exactly in the center at the Tesla   website but if I take a look at my website  let's make a screenshot command shift three let me copy this and paste it here it's not in the   center how can we bring this to  the center well let me show you you know why it's not in the center because we're  working in a flexbox container and the flexbox   it's already explaining it a little bit flex once  you go wherever it wants So based on the width of   this area and this area in this area the container  decides okay I'm just gonna bring this a little   bit more to the left I don't care I don't want it  to be in the center so what we need to do in order   to bring this in the center because we aligned the  container in the center over here we need to give   this a permanent value so if I go to the width of  the image I can go to Advanced to the width I can   say you should be a custom size which is in pixels  300 and now you see when I increase the decrease   it it's shifting because this is still Flex this  is not Flex anymore we decided you'll be 300   pixels the same I want to do with the navigation  menu with this area I want to say you will be   300 pixels what it is doing it's  giving this a permanent value   which brings our menu back in the  center so if I make a new screenshot and I copy it and I paste it now it is perfectly  aligned in the center but what we see this area   is in the center because it's in the center of  its own space so I click on the logo I go to   content and I bring it to the left then I go to  the navigation menu go to the content and bring   it to the right update perfect now I want to bring  this closer because here it's totally at the left   here at the right so how can we do that well I go  to the Tesla area to the image I go to Advanced I   uncheck the linking of the padding values and  I go to left that increases so let's say 50.   and what you see that's what I like this is not  shifting because I'm still operating in my own 300   pixel space so let's say 50 update it refreshes  you see it's almost the same so let's say 46   so we can make it Pixel Perfect it's not  necessary to make the Pixel Perfect in my opinion so I can I think I can make the  logo a little bit smaller even and now at Advanced make it as if it's on the exact same spot  okay over here I can do the same so I go   to the navigation menu Advanced and this time  uncheck it and at the right let's say 30. update great well what I see the text can be a bit bigger  so I go to typography 14 also here typography 14 right now I cannot copy and paste  it anymore because here I have settings   that should not be applied on the center  otherwise I will mess things up so right now it looks like this  and I'm happy but I think we can make our header a bit bigger and  I go over here to Advanced increase it so it will be brought a little bit down  yes I'm happy with it okay it's not Pixel   Perfect we can make a pixel perfect but  then this tutorial will become long and   um I think we're doing a great job right now so really close let's take a look at this area  the model 3 area right now I have nothing over   here but what I want to do I want to go to all  the elements by clicking here I want to drag a   container over here so a container in a container  and by default this container will go up to the   top why if I go to the model 3 container we did  not configure this yet so I go to the layout and   then it's pointing down so all the elements over  here are below each other instead of next to each   other then I go to the center and now this  area is brought in the center and I can also   bring it in the center horizontally so perfect  now in this area I want to have a new container   so I drag this over here and in that container  I want to have based on this title in this text   I want to have a heading go back and I want to  have a text editor element so I copy model 3 okay go to The Styling  typography change it to Garmin also here Style Carmen then I go to the text order  online for touchless the delivery   so I go to the content area I paste it and  every link over here by default is red so   I can change it by going to the style clicking on  this beautiful color copying go to content select   this whole area and then over here I can make  it bigger by clicking here choose a color custom   this one okay then I can make it unaligned just  as over here what I see is not in the center so   I need to go to this particular container and here  I want to say that everything should be below each   other and in the center and in the center like  that what I also see you don't see that well right   now but there's a lot of space over here so I can  click over here go to Advanced uncheck the margin   and decrease it so I can  bring it closer to each other something like that update now I want to  have another container below this area   so in this container below this container  so let me see how I can do that I drag it   over there and now I see let me see if I Collapse  it yeah this container in that container I want   to have a button like this custom order so I  go to all the elements I search for a button   I drag it over here and now I can change the  style or change the text custom order and then I   want to go to The Styling to the background color  which is not there so I go color pick eyedropper grab this color copy it then I paste it here then I want to create some  border five and the padding I uncheck it and then   I say 12. 90 12 90. and I take a look at the text  I think it's the right height or the right size   okay when I hover over it nothing should happen  what I can do now right Mouse click duplicate but   now it's below each other I wanted to be next to  each other how can I do that I click over here I   bring it next to each other and to the center I go  to the second color or the second button I click   on style and the background color should be this  one and the text color should be the primary one   so what I have now is two containers in one  container so if I would go to the big container   I can change the height of that container then  everything goes up now it is to go down how can   I do that well what do you guess first I want  this to be down how can I separate this from   each other well there are the Justified content  options and if I use this one it says this will   be totally at the top and this will be totally  at the bottom so if I select this look at that   so now I can increase it or decrease it like  that update I take a look at the Tesla website   it's coming close I think the model 3 can  be bigger I mean the text of the model 3.   I had the model 3 amazing car I love  it but then we got children my wife   said I prefer a bigger car so now  we have a Peugeot 5008 beautiful car okay I don't want to focus too much  over here but a few things we can do so this is okay but this should be lower how can I  do that and go to The Container I separate them a   bit more but then I can go to the advanced area  uncheck margin and then I can bring it all down um like that it's really close now actually  I'm okay with it I think you know by now how   how it should work if you don't understand  it please watch it again or leave a comment   like hey 30 maybe you can focus a little  bit more on this because I don't get that   but I'm really happy with the results and  what I can have now over here is an animation   I will not make an animation you need  to use CSS or JavaScript for that maybe   I should make a tutorial about that but  right now I just want to go for an image select the image it's this  arrow down make it really small and go to Advanced uncheck  this and then minus margin like that and then I can make  it a link here at content link   and I can have a hashtag link  to model y sorry model y okay now I Collapse this to make things a little  bit more visible I can call this one arrow   down now I can duplicate this Intel now  the arrow is gone so I go to the image   advanced I decrease it a bit  more until it becomes visible   okay then I can go to the model 3 and I call  this one model y then here at the container   I go to Advanced and then over here I say model  y so this whole container is called Model y and   over here at the arrow I said the link is hashtag  model y so right now if I click over here I will   go down to the next area and that's also what  happens over here and then we can have plugins   that will make it a smooth scroll and stuff  that's for our tutorial but now it's a matter of   changing the model changing this to model y  going to the container changing this to other y   of course change the links duplicate  the area oh there's one Model S go to the cell Model S so I think we did a great job if you  take a look over here looks like that and here it also looks great well  what I see when I refresh the page   you see some animations what you can do  using Elementor click over here advanced   go to the motion effects turn it on well let's  say Fade up or fade in up and you can also say   do that after a half second and then after a  bit longer advanced motion effects fade in up after a quarter second that  one will appear and then fade in left or to the right no  left after one second then over here fading right after his amount so I update it look at this almost the same as this but there's a text  over here existing invent inventory so   let me go over here change the  text and this thing inventory save update so I think personally so far so good  by the way I'm honest I'm new to this to this   flexbox container stuff I'm learning things  I'm also in contact with Elementor like hey   is this the right way to approach this because  I want to give the best tutorials if you are   the web developer or you see something like 30  this way you are doing this is totally wrong   please let me know in the comments I want to  do it the best way possible by the way using   the container Builder there are so many ways  on how to do things but I want to do it the   best way that's the the easiest way or not  the easiest way but the best way that will   make your website as slick as possible also when  it comes to coding and right now I want to talk   on how to optimize your website for tablets and  mobiles okay really important let's take a look   at how this looks on a mobile let me first  go to the Tesla website and make it smaller what I see quite fast it changes to the  tablet View and then this menu is gone   this menu is gone and there's one menu button  at the right so let me do shift command four 1470. if I go to my website it's  still not uh responsive so I need   to chase a breakpoint because over here the  breakpoint for the from the desktop field to   the tablet View is around what was it 1400 pixels 1500 so that's what I want to uh do over here  so I go to the three lines to the side settings   layout and collapse this at the breakpoints  for the tablet I want to say 1400. I updated   so again I make the screen smaller okay let's see how you're doing  over here so the breakpoint okay let's change it to 1200 if I make it smaller it should also be the case over here yes okay the breakpoint is exactly as I want it  to be now let's see what happens when I go to   the tablet view I can click over here below  responsive mode then I click on the tablet   and then look like this well it's not exactly  as this so if I want to see a mobile or a tablet   view I manually inspect then I click over here and  then go to iPad pro version you can also say iPad   and then I change this to 100 percent so  it's how I want it to be so what I can do   let me go back to the normal  mode I can search for a button   using the flexbox container I can just drag it  over here and it's beneath this area remember I   need to go to Advanced Z index say 10. then  I go to content I change the text to menu but what I want to do here at Advanced I want to  say this should not be displayed on the desktop   so I scroll to responsive and I say hide it on a  desktop and then it will be shown on the tablet   and on mobile here with this menu I want to go to  Advanced and I say to Elementor I want to hide it   only template and I want to hide it on a mobile  also over here advanced responsive height on the   tablet height on mobile so look what happens right  now we've seen the menu when I make it smaller   the menus will disappear and the button appears  but the button is that does not exactly look like   this one so how can we fix that also over here by  the way you can um your right Mouse click inspect   iPad 100 so there's some room for improvement  so let's start with the menu let's tell this   I go over here then I click on the  responsive mode and I go to the tablet View   so those are active manual and the Tesla logo this  is not active so I go to the style of the button I   change the color to primary I click on the button  I want to drag this all the way almost all the way   to the left then I want to go to the  text color and I use the primary color   update now automatically it looks like this  and now it's a matter of lining up everything   making it Pixel Perfect so what I see  over here the lowest too far to the right   and there this menu button should be to the left  so I go over here to the button to the advanced   area here it is 40 at the left I uncheck this  or 48 I bring it to 36 let's see what it's doing brings it to the left whoa okay I'm happy  with that and then I want to adjust the menu   to this style of course so I go to the menu I think there's a small border over there so I  go to the button style and at the border radius   I increase it to four I uncheck the padding  and that was Zero so from this point on we can make it look better well before  we do that let's go to typography   change it to Garmin or the font you want  to use change this to 13 Maybe is okay and I want to go to the padding well I always  want to have twice as much space at the left and   the right s on the top and the bottom so let's  start somewhere let's say eight 16 8 and 16. okay or it can be a bit bigger yes okay let's go to Advanced uncheck this and  say at the right I want to have 30 pixels padding okay that's too much let's bring it back to 20 and I have to be honest this is also new for  me this way of making websites if you're like   further you're toning do it the wrong way let me  know in the comments because I want to be the best   in explaining the Elementor container okay so  um container content button still let's see 10 I'm okay with this so what I see  below Let's uh close this now in this one I can drag this to the right also over here it looks already quite the same this is my  website this is the website of Tesla so I   don't need to change anything if I would change  something over here I would go to the Navigator   to the model 3 area and inside that area is the  container and I could change the minimum height   and in that way look at this I could bring in  closer and I can go to Advanced place this to   zero so I will line up better so let's do that I  actually am already quite happy with how it looks so I can say um let's go to the history  and I go over here bring this back   and now if I click on the container this  is back and the top okay it's also back so so far so good over here if I click   nothing happens over here if I click  there's a menu that appears but a lot of   menu items well let me show you really  quickly how we can do that I go back exit then you can go to Elementor if you have  element Pro Elementor templates below pop-ups   let me remove this one start over again  I create my first pop-up by clicking here   I call this one menu pop-up and I  create a template I can make use   of a lot of templates over here but I want  to create from scratch so I click on the X   then I click on the plus I want everything below  each other so just actually the Elementor page   builder is exactly the same Builder as the pop-up  Builder then I go to all the elements and I go   for the navigation menu I drag it over here I  can use the main menu and I want the layout to   be vertical and again when I'm doing this I'm  like okay it's not a tutorial on how to create   a menu it's more Elementor container but let me  show you really quickly what I will do if I go over here I hover over it it looked like this  so what I can do make an image a screenshot   and check what the color is  the background color I copy it then I go to the website and I go  for backgrounds and at the style   hover the background is this okay  the color should stay this one okay then I want to go to  the element the navigation   menu Advanced and it's adding I  want to increase it let's say 20. okay let's see how it looks over here a bit bigger oh by the way if you make it smaller to the  tablet's view for instance this appears so what   I can do in order to let this not happen I go to  content and then the mobile drop down breakpoint   there's some break points so I say none so this  menu will always appear even if I make it smaller okay then I go to the style Garmin increase it a bit okay then I go to the vertical padding if I hover over here there's also a border radius so far so good publish then I say save and close I don't want to trigger  this a few more things I want to do I want to I   can duplicate this and then I can add my other  menu over here and then with betting and stuff   you can align it I leave what uh with this  one now I want to configure this I'll shoot   it bear where should it appear so I go to  the settings here left below and the width shift command four is around  400 pixels so the width is   400 pixels I want to fit the height to the screen  I want to position it horizontally to the right   vertically to the center doesn't matter because  it's um height is fit to screen I want to show   an overlay over here so it becomes darker  if you don't want that just do it like that   and I want to have a close button so I  click on update save and close and now   I go to the home page so I click on exit  pages homepage Elementor edit with Elementor I go to the tablet View click over here and click on Dynamic  text I scroll down and I search for the pop-up   then I click on this icon  and I select the menu pop-up so now page will be refreshed and make it smaller okay it's working but I want to happen   animation so how can I do that I go back exit go  over here to templates pop-ups edit with Elementor then I go to the settings again  entrance animation fade in   from the right and go back fail us from the  right and let's say zero comma three seconds command r click over here so this way the cookie crumbles now you know a  bit more about the container Builder than in the   beginning that's what I hope for you there  will be more tutorials because look at this   um if I would go over here or to the container  um there's so much more we can talk about gaps   between the elements the rep additional options  so we're not there yet right now we know the   basics on how to create websites using the element  container but wait you did not take a look at the let's go to Pages we did not take  a look at in the mobile version yet if I go to the mobile version look at this right now this is how the the  images in the frame now looking like this   so it's a different image so right now I say  right Mouse click save image s go to the desktop   now it is saved I go to Elementor to the mobile  view and now the the image of the car does not fit   so I go to the right over here on  my secret data now you see oh no I go to the Navigator to the model 3 area   still I click on the plus and I drag  the image of the mobile over here I insert the media and now it's  looking great by default update so refresh right now this is what we have  created and make it smaller tablet View is the one from Tesla it's one from  us you can make it a bit slower   and make it smaller at the website of Tesla and this outlooks at our place you see there are a few more things we can  do with the padding and stuff but also here   how can I fix that let me show  you I go to the first button   then I want to justify the alignment here at the  content nothing happens I need to go to Advanced   and here for the mobile I change the width to  100 and voila there you go also over here click   justify and over here for width it feels  great to be Justified so now refresh the page also here becomes wider for the mobile view so you can play around with the the Pixel Perfect  area bringing this a little bit to the right to   the left um I showed you how to do that but  that's the way the cookie crumbles that's it   ladies and gentlemen the first tutorial about  the Elementor container there's so much more to   cover we can talk about the gap between elements  about the wrapping and the more complex websites   you make them the more you'll see how powerful the  stool is so through the tutorials I want to create   um more in-depth tutorials more advanced tutorials  so you can learn how to make websites using the   Elementor container Builder also known as  the flexbox container so stay tuned for more   tutorials if you like this video please like it  feel free to subscribe for more upcoming tutorials   and when you do that you'll see my new  videos that I'm about to make a lot of   videos because I'm excited for the container  Builder it's finally released it's finally   uh workable so uh The Best Is Yet To Come and  personally I hope this also the case in your life   I don't know where you are in life I hope you'll  have great days you are a blessing to other people   and you are a blessing to yourself but I want to  stick with the WordPress content because right   now I want to preach about stuff in life but um  maybe one day I'll make another YouTube channel   about that probably not but maybe hey maybe okay  thank you for watching this tutorial bye bye
Info
Channel: Ferdy Korpershoek
Views: 54,413
Rating: undefined out of 5
Keywords: Ferdy Korpershoek, Wordpress, Elementor Container Tutorial, elementor flexbox container, elementor flexbox tutorial, elementor flexbox container tutorial, elementor flex container explained, elementor flexbox header, elementor flexbox container release date, elementor flex container mobile, elementor flexbox playground, elementor flex wrap, elementor flex containers, elementor flex direction
Id: URucDXU1dU8
Channel Id: undefined
Length: 50min 29sec (3029 seconds)
Published: Wed Nov 23 2022
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.