Elementor Tutorial: Immersive Hero Section Design and Slider for 2020
Вставка
- Опубліковано 2 жов 2024
- I was testing some Elementor Pro features for a new video, and I got an idea.
What if I'll show you how to create a hero section like this, and a slider, for any WordPress website, with the free version of Elementor?
Then save it as a section template and re-use it any time you want.
Follow this Elementor tutorial until the end, to learn how to use the subtle zooming effect for your background slider and get this immersive visual experience.
Do you have something specific you want to learn about Elementor?
Let's chat about that in the comments section below.
How to make a website with Neve & Elementor: • Elementor Tutorial For...
Other great resources and tools for WordPress:
🖥 Professional WordPress hosting from Siteground, with discount* - bit.ly/WPHostin...
⚙ Elementor: bit.ly/Download...
📸 Stock Photos: mystock.themei...
🔆 Free Icons: themeisle.com/...
💡 Domain Wheel - domainwheel.com/
⌛ Image optimization service by Optimole - bit.ly/Optimole
🔧 Orbit FOX - bit.ly/OrbitFOX
Keep in touch:
Our website → themeisle.com
Our blog → themeisle.com/...
Our Facebook page → / themeisle
*Affiliate Disclosure: Some of the links above are affiliate links meaning we may earn a commission if you click through and make a purchase. However, this does not generate an additional cost for you.
#Elementor #WordPress #HeroSection
Do you have something specific you want to learn about Elementor?
Let's chat about that in the comments section below.
Hello Robert, thx for the video. I'd like to know if you know a way to make this kind of interactive circuit with Elementor in the Slider : grandtour.myswitzerland.com/fr . Thx !
Hi! I don't know if my question is Elementor strictly related, so forgive me. I'd like to ask you if there is a chance to use different themes in different pages. I mean I have Astra theme used for my Hompage, but I have a Portfolio page where I'd love to use another specific theme, different from Astra. Is that possible? If yes, how could I do? Would you make a video explaining that? Thanks for all your great useful videos.
@@AngeloTullio Hey, Angelo. You can only have one theme active on the site. I think it would be better to look for a template to use on that specific page. With Elementor you can create or recreate almost any design you can imagine.
@@RobertPeterK Thanks a lot Robert, a template is a good idea, I am so stupid to not having thought about it. :D Thanks so much and congratulations for your videos!
@@jackermans8465Hey, Jack. Good question.
Although Elementor allows you to create hover effects over images, and click on them, I think it's hard to get the same results.
The map on that website is a really complex work of design and hard coding.
Who in their right mind could possibly give this video a thumbs down?
The video delivers exactly what the author stated with very clear instructions.
I really appreciate your feedback, thank you 👍
How can we do the replacement text in your first example at 00:10 ? I'm very interested in that.
Hi, have you managed to figure this out
Great tutorial Robert!!!, thanks for share it ; ) ... little question, how you done the slider text (where show MORE WIDGETS, MORE FEATURES...in the beginning of the video)?
The only reason I watched this is to see how he did the changing of slider text too and he didn't even mention it.
How to set different text for different images in the background of carousel?
Thank you so much, is there any way to add different text for each slider?
Nope, you can't do that with this slider option of Elementor
@@RobertPeterK Hello and thank you Robert, in the beginning of your video, a part of the text is dynamic (words changes) how do you do that please ?
How to create Sub categories button type icon like men or women with image in button like big rectangular button..
Not sure what you want to achieve
Hi! I am trying to create a website for my yoga business. I offer online as well as in person, group classes as well as individual yoga therapy. So I want to create an interactive part asking the visitors "do you want to practice alone or in a group" when they choose then ask "do you want to practice online or in person" and then lead them to a page only containing the e.g. online individual sessions... Is there something for this in Elementor?
Hi. Great video. I'd like to know how to create a stick menu. Can you help me?
Hey, DJ Jon. You can do that either with Elementor or by using a theme like Neve Pro.
Fabulous! Absolutely Fabulous - I went step by step - following in another tab - A little tip - I noticed that all your images were on the Dark Side - Mine were both Light and Dark - so that the Text/Header would be washed out in brighter pictures - so I chose the "Screen Mode" - However - your mode and chose of either Dark or Light - will make your setting more seamless.
Ok, cool. I got that.
dear Robert, images in the carousel wont "shrink" for mobile, am I right? I don't find it responsive in that sense. What to you think?
You can optimize those background images separately for mobile
like store page clicks, inside we have a clickable banner section of the various brand names or products like perfume, clothing and etc. any video on that
Not yet, maybe I will do that on my channel, I am done here
thanks for the reply if you have an mail id i can send you the image of it..
How to add arrow or dot navigation???????????
How to change the Hero section and add a menu to it.
Wow! All I can say is thank you soooooo very much. So much easier than trying to use any of the free sliders. The one you made came out beautiful. Now I'm going to try and do the same. God bless you!
It is by far my favorite way to use a slider. Simple, effective and good looking.
Thank you, god bless you. Stay safe 😷
Yikes,,,, I think this creator has abandoned this channel,
no replies from Peter in 3 months...
I have many questions, but feel they will go unanswered,, { pitty }
Peter are you here?????
Wonderful Elementor Hero section tutorial. Thank you.
I appreciate your feedback, thanks.
Hi how to do the word animation?
I need help. The hero section looks horrible on a mobile phones. Any time I adjust on mobile phone change view on desktop and tablet view. Please could you help me? My title is too long for the phone I cut it short but change any place else as well.
Awesome, thank you! 🙏🏽🙏🏽🙏🏽 I followed along and it turned out great! Just one question...regarding your scrolling words, how do I get that to work? You didn’t go over that part. It’s one of the main things I wanted for my header?
Hi, Judith. For that, you would have to use the animated headline widget of Elementor Pro: bit.ly/DownloadElementor
Robert Peter Thanks for your response. As soon as I saw it, I happened to click on something in my builder section called EA fancy text...and voila! It’s close enough if you want to take a look. I guess at some point I had activated the EA plugin, but in trying to fake being a web designer, I haven’t figured it out yet. Thanks to people like you and those who mastermind in the comments, I’m slowly but surely finding my way around. 🙏🏽🙏🏽🙏🏽
Great!🤩TX!!
1920 x 1080
Awesome!
Thank you sir. What about a 360 image as background on hero section. Thanks
can i ask .. did you make any adjustments to the images from pixabay before use in the slideshow ?
Matchless wonderful
Thank you.
Thank you so much Mr. Robert！This is exactly what I was looking for!
Very very informational 👍🏾Thanks for sharing this knowledge. You have a new subscriber here!
where is the menu? can you add transparent mega menu to this template? +1
Wonderful Video ! A beautiful Hero section created ! How shall we Add a logo and a Menu overlay this image slideshow , a top menu on these images would look great
ive used this in a coming soon temp. Much better than the standard offerings
Thanks Robert this video save my web design life.
Excellent video, thank you.
Very useful video. Thank you!
Awesome little video, helped me out big time...
EXCELENT
Thanks, amazing result!
I know, thank you too 👍
Glad it helped!
Great tip! Thanks Robert.
Simple and amazing
Glad you think so!
Great, thanks for making this. Just built a new customer website with Elementor for the first time based on this :)
Love this tutorial 👏🏽👏🏽👏🏽
Very informative.
Awesome! Thanks!
Thank you for this sir!