Experimenting with the NESTED TABS and LOOP GRID - Elementor Wordpress Tutorial Flex Container
HTML-код
- Опубликовано: 7 авг 2024
- This was a tough one although it does not seem so from the video. The Nested Tabs widget is quite buggy at the time of filming this video, I really hope that a more stable version comes out soon because this will be such an asset. Until then, enjoy this video :)
CODE: www.notion.so/CODE-Nested-tab...
Code for the horizontal scroll on mobile from: element.how/elementor-tabs-mo... thanks for this @elementhow691 :)
Timestamps:
00:00 Intro
01:17 Designing our tabs
07:38 Building the first tab container with the Loop Grid widget
12:37 Making it responsive
15:43 Outro
Thank you for watching!
🟠 SUBSCRIBE TO THE NEWSLETTER:
newsletter.studioegli.com/
🟠 TRY ELEMENTOR
be.elementor.com/visit/?bta=2...
🟠 TRY HOSTINGER
hostinger.com?REFERRALCODE=1ANDREEA61
🟠 WORK WITH ME
www.studioegli.com/
🟠 YOU CAN FIND ME HERE TOO
TWITTER - @AndreeaEgli
LINKEDIN - / egliandrea
INSTAGRAM - / egliandrea.studios
🟠 FOR BUSINESS ENQUIRIES
contact@studioegli.com
Disclaimer - Some links in my videos' description box may be affiliate links, meaning I will make a commission on purchases you make through my link. This is at no extra cost to you to use my links/codes, it's just one more way to support me and my channel! :)
#elementortutorial #elementorpagebuilder #elementortipsandtricks
Let's agree that the nested tabs widget is still WIP
Definitely
Horizontal scroll is now included in the nested tabs options, under additional settings. Just make sure to set Breakpoints to none to get it to work on mobile.
Perfect your tutorials, keep it up. Congratulations!!! 👏👏👏
Thank you 😊
Amazing tutorial thanks 👍
Thank you, Ahmed! I will make a followup as soon as the nested tab and loop grid widgets are stable 🤓 have you used these widgets yet?
Underrated channel fr 🙌
Thank you so much, Naweed! I really appreciate it!
Thanks for the tutorial, very well explained and instructive.
Thank you, Dani! I'm very happy that it was helpful
Awesome tutorial as always. For some reason i have the horizontal scrollbar on mobile. I didnt do anything special just added the tabs widget and some content inside each tab. I'm using three tabs
Thank you, John! Hmm, that is strange, maybe adding visibility: none or display: none would do the trick. Let me have a look and I will send you the exact code these days...
Helllo
Could you find any way to make tabs sticky to top while scrolling?
thanks
Quality content 🤤
Thank you😃
How can we make it to scroll to content, when we click the tab title please?
I haven't tried that but I'm curios to why you would want to? If it scrolls to content, it defeats the purpose of reading the content inside the tab...no?
That's strange, did you inspect the page wih the devtools to see what's going on?
That padding must coming from somewhere. Do you have a URL?
The gap on mobile might be because of the thickness of scrollbar? Maybe set thickness to zero via CSS?
Ghost padding? I didn't, here's the link tuts.egliandreastudios.com/index.php/nested-tabs/ Also, why did the title not show after saving the template? That is equally strange. You get a shoutout in the next video if you solve the padding mystery
you`re a magician
nobody has called me that but I’ll take it😅 thank you!
@@andreaegli we need more stunning tutorials @andrea egl
Thank u so much
You’re welcome 😉
I have watched many videos on RUclips, especially about Elementor, your videos have made a lot of things easy for me. I really appreciate what you do and share with us.
Hope you post more and more videos about Elementor.
Thank you
Nice video 👍🏼, Do you like to make also Crocoblock video’s with Elementor.
Or video’s for a dynamic website
Thanks 🙏 I haven’t made any yet but I might in the future. Anything specific you would like to see?
What do you mean by that?
I mean, can you give me an example of a website? To be honest I’m more focused on static websites
@@andreaegli More smart websites. Dynamic posts, search option and more like that.
Just basics nothing else in the video. You need to practice more on tabs so that you can make it more beautiful and responsive. Nice video :)
What’s basic to you, could be less basic to someone else, even very helpful. Just look at the comments under this video. You need to think about that when you comment. If there’s something that’s easy to you, move on, no need to be so passive-aggressive. If you think you’re better than all of us here, share your work with us, let us see how beautiful your ‘tabs’ are. Jeez!
Im having struggle on mobile screen alignment in each phone its different alignment i cant make it proper helpp
Are you struggling with aligning the tabs?
Do you know how to insert ARIA in the title of the tabs?
I think you could insert aria as attribute. I will check that out and get back to you soon
Hi andrea, I've dm you on instagram.
Got it!