Elementor Container Tutorial | No More Sections And Columns 😎

[@genemoore1]

Thanks so much Ferdy. Great job dude. I'm not sure if this is an improvement or just over complicating something that wasn't broken. This reminds me of when Dreamweaver went to Floating Boxes or something like that, which was awful, then to Bootstrap which made a lot more sense. Feels like we're going backwards here.

[@clintwaters8278]

This is definitely a step forward. This is a huge step in the right direction. I see moves Elementor more in line with the box model. We can naturally progress to CSS grid from here.

[@codestudio5968]

Agree with you.Its going more complex. Probably Elementor going to lost their customer very soon.

[@mhthmusicvideos]

On the contrary, they are embarrasingly lagging behind. Many other pge builders have been using flexbox for quite sometime. It's the future of modern day web design. Not only does it make more sophisticated page layouts much easier to achieve, it also significantly reduces the amount of code needed to achieve them. The current system of sections, columns, inner sections etc, generates significant code bloat, something that even Elementor themselves admit, which can greatly slow down site speed. As a test, create a new blank canvas page, add just an empty section, preview the page and then inspect it and see how much code is required just for a single empty section. The burning question is, just how much longer are we going to have to wait before it's no longer 'an experiment'.

[@avigarg7859]

Really useful video. Explanation: I am not using the pro version of elementor right now and this technique you just told in video will enable me to design my template where I need content side by side despite I can only add (child container again and again in place of inner section{Pro feature}) , that container always go below previous child container and you also can't add a new (2 columns[after clicking plus symbol ]) container in previously generated new empty container with the free version. So this technique will enable you to do pro feature work in free version.Thanks again.

[@josephaugustin5103]

You would need margin- left and margin-right to be set to auto to center the outermost container. Glad they brought in containers! It should mean far less excess DOM elements.

[@scottgeithman193]

Thank you sir. I was confused as hell for awhile because I can still copy and paste sections and columns but could not create them ... now I finally understand why ... Elementor switched to flexbox layout and it makes more sense now!

[@volga2544]

Great video! It forced me to install Elementor Beta Dev - Been playing with containers for the whole day .... Turns out the flexboxes are much easier to deal with... Looking forward for a stable version now.... Thank you, Ferdy! I like your tutorials ... ))))

[@jcarlin596]

Great video. I am currently learning CSS and this update really shows the flex box characteristics so well. Can't wait for Elementor to release the final version

[@lianabagui]

Thank you so much! The new Container feature has been driving me crazy the past few days, I just couldn't figure out how to make new columns with this new thing. 😂 But now I do thanks to your video. 🙌 Awesome content!

[@shanesmith2143]

EXACTLY what I was looking for. Thank you so much for this tutorial, Ferdy. 30 minutes very well spent.

[@jocelynpatrick2823]

Another excellent video Ferdy. I always appreciate your honesty and I've learned so much from you!

[@riderxo2451]

Hei, nice tutorial. It's helpful for learning the basics of the new container option. One small notice, because i am watching almost every tutorial i can find on containers, i learned that even if containers are an improvement over sections, in terms of code generated and less DOM, i think you are using way to many containers. Some things can be achieved without making containers inside containers.

[@prokassim]

Very helpful tutorial, you are always on the cutting edge with great , helpful info, and tutorials. looking forwards for your in depth tutorial. thank you very much .

[@gamepacked]

As soon as I heard the Gutenberg joke I liked the vid straight away. Great tutorial man!

[@DavidJG242]

Didn't know this. now I want to change my existing website :( cool video....

[@drewtrykowski1881]

Great video, but correct me if I'm wrong , If I have a primary container and then insert lets say 6 containers into the primary container the "items justify content" for containers with in the container do not work .... is that correct ? or am I doing something wrong ?

[@patricklafontaine4313]

Hi! I just try to do something and it looks like impossible... I have a header with 3 things: 1- left menu 2- logo 3- right menu I can easily place those in a row (I make a container per item to get more flexibility). Now, I just want to add a container that would be just under the left one (number 1) to add social media just under the header in the corner... But as soon as I add a container it just move everything to go in the same row... How can I let the first part unchanged and just add this container under the row and then adjust the position and contain...? Thanks!

[@sergiocohaguila9067]

That functionality already existed in kadence block, a Gutenberg extension, even before the new version of WordPress 5.9 came out, because in this latest WordPress update they added a block called row, and it is similar to this functionality of Elementor that they are just launching in beta.

[@jerry-suhrstedt]

Hey, great video! What screen recording software are you using? Looks awesome.

[@henstradesign4802]

Thanks for the video Ferdy! I gotta say, I'm indifferent to these new changes. Based your tutorial, there seems to be too many errors/glitches with the update...time will tell.

[@aerialiskites]

Goodie! 👍 Looking forward to that in-depth tutorial of yours when this container thing goes live! 🙂

[@campermimo]

Hoi Ferdi, worstel met het maken van een sidebar in Elementor, en een sidebar die ik ook elke breedte kan geven die ik wil. Elementor containerversie btw.

[@in.motion.marketing]

Thanks, Ferdy, we love what you do too. Looking forward to the container element :)

[@HARAUNANSTYLES]

Thanks a lot Ferdy you are the best

[@kostaszias]

Youe Elementor Container Tutorial very good

[@shaunross2995]

Not quite as good as it could be, it's just a re-imagining of sections but the columns are hidden. But still a step behind the advanced Wix builder that's literally drag and drop anywhere. But good to see new ideas like this in Elementor.

[@ferdycom]

Let's hope they make it better 😊

[@dariuszpichalski]

When changes start?

[@dc-metron]

Hi Ferdy! How do you create a multi-column layout inside another container? I can add containers within, but they stack vertically and no amount of resizing or setting-button-clicking is changing that. Thanks! PS - In English we pronounce it "dooplicate" (yes English is so wonky!). 🤗

[@sjessick]

Thank you! Just solved one of my problems in 2 clicks!

[@EduardoPereira-iy7js]

This new container is really cool. Problem is the the bugs I have been facing. In my case, everytime I drag a new element, it comes duplicated. So I deactivated it:(

[@freyjauser]

Nice content. Wondering... I've seen the pixel measurement tool on several webdesign videos now, mind providing for its name ? Thanks Sir !

[@iketutsistawan4248]

this is great new feature, it is opening to new possibility to web creation. In my case, this will best for creating more creative header, mostly for custom width header (elementor header mostly full width), been strugling to create it with elementor

[@plantifulalexandra]

18:00 Spacers are actually not a good idea, just use padding :) But cool video, thanks!

[@KevsGuide]

some of my pages have gone wacko. people on the elementor FB group are saying we shouldn't be using containers on live site. i tried turning the container off and my container pages went blank

[@timsimmons7916]

I would think to get those 3 Containers to center you could wrap those 3 inside of 1 container and have that container at 100% centered.

[@audunjemtland8287]

Is there any way to be able to drag text and images around free form anywhere on tablet, phone and dekstop versions? I'm sitting manually tinkering borders, margins and things that are not mean for positioning of elements. Is this different from regular vs. Pro? (I don't have Pro)

[@TheeSpercialOne]

Thanks Ferdy 🔥

[@emailjough]

17:37 sorry Ferdy but you're mistaken. Its not a bug at all. You simply need to set the parent container to align items: center. Adding spacers is bad advice. Please review the flexbox spec.

[@ferdycom]

Yes, thank you. I got the feedback already and felt so stupid. I keep on learning 😊 And yes, adding spacers os bad advice.

[@chlpac1985]

How do I stretch the container to the entire width of the screen? Full width content doesnt fulfill this function.

[@mel-182]

This is awesome! I always liked flex-box!

[@JohnSobyyy]

Thanks for the tut. "Learn Gutenberg ... hahaha, as if anyone would want to!" LMFAO

[@luisfernandolondonor7369]

Great tutorial

[@whowantstogetnaked]

awesome job Ferdy, really enjoyed this tutorial - inspiring stuff!

[@stichtingvision4532]

Een geweldige uitleg over de nieuwe mogelijkheid. Is deze container mogelijkheid gebaseerd op CSS-GRID-MODULATIE?

[@streamingvideo6654]

Awesome, thanks for the clear instructions!

[@limpfootadventures]

how do you resolve making sure buttons stay along one line if there is a different amount of text in icon box? thanks

[@IanMc07]

Thanks so much ferdy... Looking forward to more..

[@thijs2189]

Thanks again for this lesson, looking forward to the Alpha version

[@morozara4962]

Just saw video yesterday and been messing with it. Problem is when I place post widget will not let me exclude any or offset as it will not open

[@ankushbaliyan8103]

Hello ferdy sir.... It's soo soo confusing... This new update. But I know you taught us this😇. 🤔Is it any better than the first one?

[@ferdycom]

Hey Ankush, it is better! But it needs some refining.

[@coolestnerdever2128]

Thank you so much for this Ferdy. Can you confirm how you measured the image again around 27:07 please?

[@mhd3117]

thaaaanks i wana ask you something i see all your videos but one thinks i didnt find it how to setup click to update single section instead of update all page with elementor means like twitter instegram when you like a post it didnt update all the page to update this section how we do that

[@mhd3117]

and fore extra information the (container) update from elmentor from 2019 shopify have it hhh because that every one thught shopify faster then wordpress >>i dont like shopify because the high price

[@VerdiHeinz]

Great video!

[@peacetoall1858]

Excellent tutorial. Thank you. How do we overlap widgets and containers with this new setup?

[@trickknowledgeco]

how to add migrated navigation menu on header with elementor

[@gothickangelstudios]

Can't wait for it. Mine does not have the column drop down menu option yet.

[@bobbypalmer2460]

Really useful tutorial thanks, Ferdy

[@alexotoous]

this is good for developers who know CSS, that's a flexbox container

[@robmongeau3308]

hey would it be possible to create a side header with the new container? i tried following another tutorial but as soon as i apply it to a page it stretches back to full width and is over all the page content. Would it be too much to ask you to do a tutorial for that

[@yurisamarin8200]

With those new tools we are going to forget to CSS

[@menneke49]

Ferdy, please post this video using dutch language. My English isn't good enough to be able to understand everything you say in this video

[@Mr.PauloSica]

thank you so much! that was very helpful! ❤🙏

[@mrtango5003]

How to activate container in elementor Many thanks. Excellent video

[@envatoreviews]

Thank You Fredy 🥰...

[@larsrasmussen9801]

thank you Ferdy ❤

[@user-st3sd3us7e]

awesome!! thank you for this help video!

[@johnehimhen8515]

Good one, thanks so much Ferdy

[@KariposTheOne]

When is it coming out?

[@ferdycom]

I think in February or March.

[@brunofrancisco9992]

elementor flexes on elementor

[@artoine]

At 10:40 you typed in a link of your website but you forgot the R however it still redirected you to your website with the R (korpers) How?

[@nasnong]

6:31 bro is just flexing editing skills 💀

[@markda9615]

How do you freely move containers just moving them around

[@ferdycom]

Using the layer panel

[@rajuu_ra]

container does not avail for me, what will I have to

[@seacterate]

Woww.. Thanks body, great video again.. And now less DOM fast WEBSITE...

[@farhanfahim7820]

Brother, Please do a full tutorial for the TokenICO plugin.

[@zaidsarrouj9929]

Thank You

[@dominmax]

Please tell me that you can save the "parent" flex container as global. Is that possible?

[@isaaciq4742]

Hi Fredy Am having trouble with my site, I designed it using elementor with the Astra theme, but bullet points and numbered list don't on the front end. I was told element causes the issue but I don't want to change the page builder. Do have any suggest fixes for this issue?

[@Kestisr]

Thx for Help!!!

[@GuidoAlvarez-fm9hg]

I am using Hello Elementor Theme. How can i create Container that is on the same level as the default Hero container?

[@klaidi.m1003]

great tutorial

[@ErniLandia]

Is the update already out at the stable channel?

[@Football__Junkie]

Is this Elementor's new strategy to load faster and reduce bloat?

[@Jacob-Holt]

I'm new at this. What's the difference between container and a section? I might have missed that. And I'm building my first website in the near future, should I use sections or containers or skip elementor and start with Gutenberg? Thanks

[@Releasly]

Try both and see what fits you best, I am using sections. When the stable version comes out tho, I will switch to container.

[@monikakonieczna9435]

Brilliant, as always :-)

[@tresvecesdos]

Great job. Thanks ;)

[@int8float64]

What's the main advantage of using this container-based than the normal?

[@ridabrahim7604]

From my little knowledge it makes the page loads faster because, less codes, let's wait for an expert to validate my comment

[@clintwaters8278]

Correct. A huge reduction in DOM elements. Much cleaner code. More in line with something like webflow.

[@ag9314]

Pls help, I couldn't find the container

[@kavisl979]

thans a lot

[@mybiglearning7919]

Good

[@RobertoOrtega]

What software you use to screen recording?

[@nhivan5646]

Where is the Stretch to Full Width ???

[@basicelement]

I believe its better if we wait for the final update before we use it

[@brianlee2196]

how to measure it?

[@re66044]

3 months later and it’s still in beta. Or alpha.

[@muafaa]

can we now use this feature for client? is it safe?

[@ferdycom]

Yes, it is.

[@gilcambo9778]

Thanks Ferdy for this very interesting tutorial, as always. With your help, I'm going to save some money. I was decided to switch from the free version of Elementor to the Pro version. When I saw your tutorial, I thought that Elementor has fallen on its head.They had the best tool you could ever dream of and, because of this pride in change at all costs, they made their page builder go several years back. Until this system becomes the mandatory standard, I'm going to stay with the free version of Elementor while looking at Divi and Joomla to find an alternative that suits me better than this madness pushed by Elementor. This new version seems to me to be as bad as the WordPress Full Site Editing.

[@pxman1946]

This is the new golden standard. Everything becomes much easier, its why Oxygen, Bricks and so on are so popular.

[@jamesdavis8731]

why would you even consider Divi? Just awful. The container feature is EASY to use once you get a bit used to it. It offers a lot of flexibility.

[@gilcambo9778]

@@pxman1946 I respect your opinion but this standard is not for me. Up until now, I love Elementor but not anymore.

[@gilcambo9778]

@@jamesdavis8731 You have your choices and I have mine. For me, this container system is the worst of all page builders and I will never use it. I preferred Elementor to Divi but now this is just the opposite.

[@pxman1946]

@@gilcambo9778 Once you explore the container systems, using flex and grid you'll be amazed at how you never used them before - I was at least.. However Guteberg I find intolerable to use.

[@SimonWYHuang]

Great...

[@AngelaPerez-ie4gy]

My elementor does not have experiments

[@realhackjunkie]

I liked the sections and columns better

[@SwisTony100]

Great video ty. You are pronouncing duplicate wrong try this, Dyouplicate the U is you hard to explain like this 🤣 Keep up the great work 👍

[@bocagelandscape]

I'd say: A dyew-pli-cut To dyew-pli-kate

[@neilwyrchowny9253]

Or, for the North American audience, doo-pli-kate as the verb and doo-pli-cut as the noun. You doo-pli-kate a container to create a doo-pli-cut container.

[@bySterling]

Dooplikate is a good way to remember

[@leighvanderhamm]

whatever... i like how ferdy says it!

[@michaelsimmons3614]

Will Elementor templates still work?