Inner Section inside the Inner Section inside the Inner Section... no plugin, no Elementor PRO

[@ellio7346]

Well, that was a really out of the box.

[@JoeGator23]

Thanks, You're solving problems before we even need the solutions... impressive next-level channel. More tuts please, particularly CSS, you're a pro!

[@OoohBoi]

More to come!

[@Azmarine13]

You should be hired by elementor ... You literally made my life easy.. even after buying elementor pro..XD

[@OoohBoi]

Thanks buddy!

[@benjaminroot6270]

This so saved me from all kids of grief (and a sleepless night). THANKS! Using this process I was able to create a header with a 2-column title (logo + title) above a single-column Nav bar and have them act as a single sticky scroll object. This kind of design/construction issue has flustered me for a long time...Now I have the secret technique. (I don't know why Elementor doesn't just make it work on it's own)

[@OoohBoi]

Glad to read it helped!!!

[@DendySutrisna]

1:48 "... The trick is very simple : it's based upon the fact that elementor allows you to copy paste the column with all the content including the inner section widget itself being a part of the content. So simply copy the column that houses the inner section widget, from the section number two (the helper section), and paste into the existing inner section widget of the first outermost section .... " Thank you for your explanation. 🙏🏻

[@DruShockley]

Thanks SO much for sharing this!! I had found a plugin that makes this possible, but your solution is genius. I'd like to know why Elementor doesn't allow for this natively. I'm sure construction could get out of hand. It would be nice if there was a setting in wp-config that would turn off this limitation or allow it to be adjusted.

[@linda_sue]

This is very tricky of you! Thanks!

[@UsuallyNormal5523]

Holy cow! Nice one mate, so glad that you found a way to do it! Thanks, this is really, really helpful! Subscribed :)

[@OoohBoi]

Awesome, thank you for the feedback!

[@BretTkacs]

INCREDIBLE! Thank you so much, this has helped immensely.

[@vBailey]

Echoing Martin's appreciation... REALLY, REALLY helpful! :)

[@OoohBoi]

Glad you think so!

[@IgorPinheiro]

man, you just resolve all my problems that i had with elementor. Thanks!

[@fmitsinc9146]

Excellent. Thanks for posting. I contacted Elementor regarding this problem and they haven't get back to me with a solution or workaround.

[@AntGeezer]

Very useful. The times I’ve wanted to add an inner section to an inner section and been unable to. Thanks 🙏

[@OoohBoi]

Glad it was helpful!

[@CalvinLewis868]

Thank you! Really an impressive solution to this problem

[@thereddeath12]

Absolute life and time saver. Thank you!

[@nawafgantare9194]

GOAT. Very simple but amazing.

[@clevergrrl27]

Thank you! I have tried to figure this out for over a year. :P

[@olegvolkov7420]

Thank you! 🙏

[@mybcn]

Love your little pieces of ingeniousness. 😍 Slightly off-topic. When creating the Section (as well as Singles and more) you can assign an HTML Tag to the Section. The Elementor documentation gives very few hints on when to use what beyond the obvious ones. What are they for, he should you use what, like Div, Section and Article. How important are they? 🤷🏻‍♂️🤔 //Matt

[@OoohBoi]

Well, the DIV and the SECTION are more general in the context of HTML, while the ARTICLE is used in forum, blog, or news posts. However, none of them doesn't render as anything special in a browser.

[@mybcn]

@@OoohBoi Thanks for taking the time to answer this. There is nothing written or recorder about this. Seems like most people don't care and just leave it at . The only practical use of having it set to anything else is for the Table of Content. With setting it to you can filter it to only use the Headings in that tag, or any other you choose. Will setting it to help in nesting optimisation (don't know what to call it)? When Elementor tries to clean up redundant divs?

[@PeterWinter]

Nice, but as an beginner - could y explain maybe with some examples what for y would use this????

[@OoohBoi]

First thing that I can think of is multiple backgrounds. Next, it allows you to group widgets which is even more important when dealing with complex layouts.

[@dontopa128]

its for complex layout mostly, this tutorial really helpful if you have complex layout.

[@swingsprite]

This is an excellent hack! Seems like Elementor should be officially supporting this, though. Other page-builders do.

[@romandasaleknavicius2677]

It seems, like padding is also adding up. How to remove it. Use minus margin for nested elements?

[@matthewdufty606]

It made me happy to watch this

[@TilorneMadrid]

Hi oohboi, Love all your videos. Great channel. I have one question, is there a way to keep inner section boxed into a full width section with two columns? Thanks.

[@OoohBoi]

From now on, you can align Inner Sections one next to another by setting up a custom width (flex or units). These controls are now part of "Breaking Bad" extension which is a part of "Steroids for Elementor" add-on that I made a while ago. It's free, just ask Google about.

[@masharibali8212]

Thanks Dude, really appreciated your help!

[@timvanoosten432]

I have a question and I hope that you can answer it, cause it's very frustrating me. I don't see the inner section widget in my widget menu. What can be the reason of this?

[@zipitrik1]

You always find a way to solve a problem I had at some point. Thank you !!!!!!!!!!!!!!!!!!

[@OoohBoi]

Glad to help!

[@PaulHerzlich-xo8ox]

Thanks. Restrictions? I think you might find that you can't move any of the nested inner sections in the navigator.

[@OoohBoi]

Oh yes, that's a good catch! I forgot to try to move layers in the Navigator. It looks like you could resolve that by copying the target Column to the Helper Section, do the re-arrangement of Inner Sections and then copy-paste the Column back to its place.

[@PaulHerzlich-xo8ox]

@@OoohBoi Good workaround. Thanks.

[@selenefroehlich9138]

thanks a lot! this solved my problem in just a couple seconds :)

[@lassestube]

This is amazing, and a nuisance that Elementor should remove the limitation. Thank you

[@adeelplay]

now there is no limitation with the new version which is flex box containers

[@learndigitalskills8932]

That's awesom. Thanks buddy,

[@roblilley2343]

Been looking for a way to do this for a long time :) Thank you!

[@OoohBoi]

Glad I could help!

[@salakhundov5746]

Nice, thanks! I wonder what might have been the reason for the Elementor devs to disable the nesting below the first level? Any thoughts?

[@OoohBoi]

I wish I know the answer... all I can tell is that for some reason it has been disabled in the core code of Elementor.

[@2ndActSuccess]

Thank you so much for this video! You solved a problem I was having.

[@OoohBoi]

Great to hear!

[@heppylifestyle]

excellent vid -- thank you!

[@baliflorent6971]

You are simply the best. You are a wizard.

[@alexzzz5932]

Massive! Thank you man.

[@adnanhakim6866]

Absolutely Fantastic!!!

[@enosunim]

Cool, thanks! You saved my day!

[@ShubhamSingh-xt9ft]

Amazing. The same thing I was looking for.

[@OoohBoi]

Glad I could help!

[@ShubhamSingh-xt9ft]

@@OoohBoi is there any community under your guidance? Ok Iike Facebook group or something

[@constancephoto6512]

Thank you. As always - very informative video!

[@OoohBoi]

My pleasure!

[@teunbraber]

This is amazing, thanks.

[@nubenegra809]

NIce! i ve been using it this way for a while, thought it was a bug that that actually works for me :)

[@OoohBoi]

There you go! Why didn't you spread the word somehow?

[@nubenegra809]

@@OoohBoi sorry :( did not thought that it was important... and did not knew how to explain it

[@franktielemans6624]

I knew that trick but I don't use it because I have your Elementor steriods for Elementor plugin. If I want 10 rows in 1 section , I simply make 1 section with ten 100% width columns . (breaking bad extension)

[@OoohBoi]

This should be handy when in need to group widgets and you have no other choice. I've been there a few times lately and it helped a lot. It's more like a backup plan and it feels OK to have one - just in case.

[@thepeguesfamily]

I've been trying to create a custom element, not custom widget. My goal is to have a custom element (like a custom inner section) to accept other widgets. One purpose is to create a custom accordion wrapper that I can drag and drop widgets inside of. I've learned that widgets cannot accept another widget. After playing around with code I think it is possible, but the elementor code is unnecessarily complex. For the elementor rows and inner section, it is built into the core, unlike their widgets. Do you have any suggestions? Ideas? Have you been able to accomplish this yourself? Seems as though a lot of people want to do the same thing, and there is no response from the elementor dev team.

[@OoohBoi]

Simply put together, you're about to group Widgets. In that case you need the container. There are currently two available: the Column and the Inner Section widget. Believe me, you don't need the third one. But what's actually bugging you is the limitation of existing widgets, such as Slides or Accordion, you can't build their content out of widgets. That's exactly why I have created Glider. The entire concept of Widgets in Elementor is wrong. Ppl should be able to "convert" basic containers into something more complex, such as Slider, Toggle, Carousel, etc. rather than experiencing limitations of an instant solution.

[@RandomNoise]

Another very useful tip. thank you Boi :-)

[@OoohBoi]

Happy to help!

[@Yann-81]

I don't know if I will you use it, but thanks for the trick !

[@OoohBoi]

Yeah, it's good to know that it can be done without an extra plugin. It's like a backup plan.

[@aishaahmad7212]

Wow thank you so much man 🥰

[@jordanjchavez2378]

yeah boi! thanks for the solution!

[@jdyoutube8229]

Really nice tutorial! Can you make a tutorial about multi line buttons? So a button with a bigger 'head text' and some smaller text blow?

[@OoohBoi]

That's awesome idea!

[@jdyoutube8229]

@@OoohBoi Would be amazing. I am wondering how big of a challenge it will be for you

[@milesmungo]

Whoa, thank you! Can you solve world hunger next? 😉

[@ammarasif7751]

Thanks Buddy Great Job Welldone

[@OoohBoi]

Thanks for watching Ammar!

[@JamesGough1]

Thanks dude.

[@ShakstudiosAu]

you saved me, thanks bro :D

[@Zim_88]

cool! thanks. I can not understand why Elementor doesn't made Inner Section multi-insideble

[@OoohBoi]

Neither do I but the fact is that they did it in the code. Maybe one day nested section will suddenly become one of the brand new, awesome Elementor features. And if that happens many of us will know it's bullshit.

[@ruipedrosa2936]

Thank you your a live saviour

[@NoorTV101]

Nice.. Kindly make a video on RSS feed and its css (Design)

[@OoohBoi]

OK ... could you please be more specific? I'm not sure I got the point...

[@markroynellobre]

Oooh Boi is really good. thank you for this

[@OoohBoi]

Glad you like it!

[@omayedabdullah9062]

Thanks Buddy

[@tafmakura]

Brilliant, it works!

[@bluefuzecom]

Wow, nice work!

[@OoohBoi]

Thanks!

[@Creative-jg6gq]

Hi - usefull tutorial, but how do i nest 2 inner section one below the other in the same column? I dont want to nest inner section INTO another inner section. for e.g Main section has 2 columns. One column has an inner section with 2 columns and i need one more inner section just below the first inner section also with 2 columns

[@OoohBoi]

I don't see the problem here... you just drag two Inner Section widgets to the same column and they will fall one atop another by the default. That's how all widgets sit inside the column - unless you make them Inline positioned.

[@Creative-jg6gq]

Yes I Know, but the column i need to drag the 2 inner sections is also part of an inner section. The thing is that i have a 3 column main section and it is not giving me the right order when i reverse columns in Mobile responsive view, hence I need to make my main section 2 columns and nest an inner section and then 2 more inner sections one on top of the other in one of the columns. Phew!

[@OoohBoi]

@@Creative-jg6gq You can use the "Breaking Bad" extension from my plugin (Steroids for Elementor) and arrange columns at will via the Column Order option. Forget about Elementor's reverse columns, it's not useful at all.

[@thenomandesigns]

why don't you apply at elementor for the tech lead post

[@OoohBoi]

I'm not interested, I prefer to be "free".

[@heisenberg9616]

is there a way to add a revolution slider in the bottom and then add a search in a new column on the top. I have been working on this for days and can't get it to work.

[@dontopa128]

thanks for useful tips. be patient for mobile editing with this tips thou 😂

[@OoohBoi]

Ok, ok if you say so...

[@RomanCzujko]

thank you bro

[@andonisr]

That's a neat trick...Oooh Boi....:-)

[@OoohBoi]

Thanks!

[@davidsots558]

Thank you a fortune!

[@OoohBoi]

You're welcome!

[@itookaonabookanyway7385]

you stopped me from going to an insane asylum, why on earth does this not exist

[@AlfianSabriTanjung]

Awesome. Thanks

[@OoohBoi]

You're welcome!

[@TareqHassan]

What the fucking awesome tricks it is !!!!!

[@re_styles]

Inner space travel....wow, thanks

[@OoohBoi]

You bet!

[@arashd1381]

Can we have something like what HappyAddons offer for nesting inner sections inside Steroids in the future?

[@OoohBoi]

Maybe! It would be great to have it, that's for sure, so I'll give my best to make it happen.

[@arashd1381]

@@OoohBoi Thanks, man. I know you will.

[@mauricioguerra2151]

Nice, thanks

[@OoohBoi]

Welcome

[@bilalmajid8241]

Omg omg thank you sir

[@hariskhan3590]

Amazing Content

[@antenkonio]

Innerseption 🤯

[@serusok]

what is it for?

[@OoohBoi]

Mostly for grouping widgets, multiple backgrounds, etc...

[@alexandruvalentin2035]

Legend!

[@_mzkr_]

That was actually really confusing. The Inner Section block is so limiting. I think I'll wait for the Flexbox container block to kick the inner section straight to the bin..

[@diegofernandonarvaezerazo2844]

Te amo bro!

[@gieselman]

Anyone unable to get this working with recent updates? I can't drag an inner section into an intersection...

[@OoohBoi]

I just gave it a shot and all looks good. The only thing that doesn't look right lately is Elementor itself, I feel like I'm hitting one bug after another...

[@gieselman]

@@OoohBoi - thanks for looking ... I'll take another try. ))

[@clintongallagher]

May break responsive expectations ainna?

[@OoohBoi]

Did you catch one yet? If true, I'd love to know under which condition it occurred - if you're willing to share that info, of course.

[@avetisdiseno1506]

genial

[@connectadnan4669]

I just got Stunned 😅😅.......really

[@OlaNordmann123]

This is how I've been doing it, and I thought maybe I'm dumb and don't know how to properly do this. But nope lol

[@sachucoinage3533]

kindly make a fresh tutorial on all the ooohboi addon elements if possible

[@OoohBoi]

Oh, that would be good idea! Will do it for sure.

[@alexanderengl1067]

thanks for the solution but this video is sooo hard to follow...

[@OoohBoi]

Don't follow, simply drag the Inner Section to the column, right mouse click one the column, "Copy" and then "Paste" back inside the Inner Section.

[@chimastudios]

This should never be a problem in the first place, except for Elementor being clowns. WPBakery allows you create unlimited inner sections, why not Elementor?

[@Overblazeinnitmate]

Brain.exe stopped working

[@OoohBoi]

🤖

[@InfinityVideo7]

Thank you very much!