- Видео 128
- Просмотров 2 934 862
Make Dream Website
Добавлен 1 мар 2020
One stop solution for creating any kind of WordPress Website. You also get regular tutorial on WordPress Tips and Tricks.
Make this INCREDIBLE Animated Side Menu in Elementor | WordPress Advanced Navigation Menu Design
In this video, I'll show you how to make this INCREDIBLE Animated Side Menu in your Elementor website and design a WordPress Advanced Navigation.
✅Get Elementor Pro:
makedreamwebsite.com/elementor-pro
✅Get code snippet for Animated Side Menu:
makedreamwebsite.com/make-this-incredible-animated-side-menu-in-elementor/
✅Get this as Ready Template (✨1 CLICK INSTALL✨):
templatish.com/template/elementor-animated-side-menu/
This is not just an usual hamburger menu. When you click on the button, here is an incredible animation. You can see the cool transition of the button and the items. Also here are some nice hover effect with arrows and underlies.
If you want, you can get this as a ready made templat...
✅Get Elementor Pro:
makedreamwebsite.com/elementor-pro
✅Get code snippet for Animated Side Menu:
makedreamwebsite.com/make-this-incredible-animated-side-menu-in-elementor/
✅Get this as Ready Template (✨1 CLICK INSTALL✨):
templatish.com/template/elementor-animated-side-menu/
This is not just an usual hamburger menu. When you click on the button, here is an incredible animation. You can see the cool transition of the button and the items. Also here are some nice hover effect with arrows and underlies.
If you want, you can get this as a ready made templat...
Просмотров: 8 599
Видео
Elementor Playing Card Image Hover Effect with Animated Popup/Lightbox | Expanding Image Gallery
Просмотров 4,8 тыс.Месяц назад
In this video, I'll show you how to make an Elementor Playing Card Image Hover Effect with Animated Popup/Lightbox and create this Expanding Gallery. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet for Playing Card Effect: makedreamwebsite.com/elementor-playing-card-image-hover-effect-with-animated-popup-lightbox/ ✅Get this as Ready Template (✨1 CLICK INSTALL✨): templat...
Make this Team Member Slider/Carousel with Reveal Animation in Elementor | FREE Image Slider
Просмотров 4,2 тыс.2 месяца назад
In this video, I'll show you how to make this Team Member Slider/Carousel with Reveal Animation in Elementor and create a FREE Image Carousel. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet for Team Member Image Slider: makedreamwebsite.com/make-this-team-member-slider-carousel-with-reveal-animation-in-elementor/ ✅Get this as Ready Template (✨1 CLICK INSTALL✨): templat...
Create this Table Image Hover Effect in Elementor | WordPress Creative and Cool Portfolio Section
Просмотров 3,3 тыс.2 месяца назад
In this video, I'll show you how to create this Table Image Hover Effect in Elementor and make a WordPress Creative and Cool Portfolio Section. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet for Table Image Hover Effect: makedreamwebsite.com/create-this-table-image-hover-effect-in-elementor/ ✅Get this as Ready Template (✨1 CLICK INSTALL✨): templatish.com/template/eleme...
Create this Social Menu with Stagger Animation in Elementor | WordPress Creative Menu Hover Effects
Просмотров 11 тыс.8 месяцев назад
Today, I'll show you how to create this Social Menu with Stagger Animation in Elementor and make WordPress Creative Menu Hover Effects. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet for Advanced Social Menu: makedreamwebsite.com/create-this-social-menu-with-stagger-animation-in-elementor/ ✅Get this as Ready Template (✨1 CLICK INSTALL✨): templatish.com/template/element...
Make this Stacked Card Scrolling Effect/Animation in Elementor | WordPress Creative Text Box Design
Просмотров 49 тыс.10 месяцев назад
Today I'll show you, how to make this Stacked Card Scrolling Effect/Animation in Elementor and Design this WordPress Creative Text Box. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet for Stacked Card Scrolling Effect: makedreamwebsite.com/make-this-stacked-card-scrolling-effect-animation-in-elementor ✅Get this as Ready Template (✨1 CLICK INSTALL✨): templatish.com/templ...
Elementor Creative Portfolio Page with Text Reveal Animation | Card/Image Reveal Effect
Просмотров 27 тыс.11 месяцев назад
Today, I'll show you how to make Elementor Creative Portfolio Page with Text Reveal Animation and create a Card/Image Reveal Effect. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet for Creative Portfolio Page: makedreamwebsite.com/elementor-creative-portfolio-page-with-text-reveal-animation/ ✅Get this as Ready Template (✨1 CLICK INSTALL✨): templatish.com/template/elemen...
Make this Cool Card Hover Effect with Background Image in Elementor | Creative Stagger Animation
Просмотров 19 тыс.Год назад
Today, I'll show how to make this Cool Card Hover Effect with Background Image in Elementor and create a Creative Stagger Animation. ✅Get Elementor free version: makedreamwebsite.com/elementor ✅Get code snippet for Cool Card Effect: makedreamwebsite.com/make-this-cool-card-hover-effect-with-background-image-in-elementor/ ✅Get this as Ready Template (✨1 CLICK INSTALL✨): templatish.com/template/e...
Elementor Full Width Navigation Menu with Images on Hover | WordPress Hamburger Popup Menu Animation
Просмотров 34 тыс.Год назад
Today I'll show you how to design Elementor Full Width Navigation Menu with Images on Hover and make a WordPress Hamburger Popup Menu Animation. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet for Menu with Images: makedreamwebsite.com/elementor-full-width-navigation-menu-with-images-on-hover/ ✅Get this READY-MADE template on TEMPLATISH: templatish.com/template/elemento...
Make an Elementor Image Gallery with Animated Lightbox/Popup | WordPress Creative Portfolio Section
Просмотров 11 тыс.Год назад
Today I'll show you how to make an Elementor Image Gallery with Animated Lightbox/Popup and design an WordPress Creative Portfolio Section. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet for Image Lightbox with Gallery: makedreamwebsite.com/make-an-elementor-image-gallery-with-animated-lightbox-popup/ ✅Get this READY-MADE template on TEMPLATISH: templatish.com/template...
Make an Orbiting Circle Image Hover Effect/Animation in Elementor | Cool Team Member Section Design
Просмотров 24 тыс.Год назад
Today I'll show you how to make an Orbiting Circle Image Hover Effect/Animation in Elementor and design a Cool Team Member Section. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet for Image Circle Hover Animation: makedreamwebsite.com/make-an-orbiting-circle-image-hover-effect-animation-in-elementor/ ✅Get this READY-MADE template on TEMPLATISH: templatish.com/template/e...
Make this Bouncing Ball Image Effect in Elementor/WordPress Website | Image Moving Animation
Просмотров 8 тыс.Год назад
In this tutorial, I'll show you how to make this Bouncing Ball Image Effect in Elementor/WordPress Website and create an Image Moving Animation. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get Domain & Webhosting(SAVE 50%): makedreamwebsite.com/bluehost ✅Get code snippet for Bounce Effect: makedreamwebsite.com/make-this-bouncing-ball-image-effect-in-elementor-wordpress-website/ ✅Get...
Create an Auto Sliding/Scrolling Image Effect in Elementor | Infinite Scrolling Image Slider
Просмотров 42 тыс.Год назад
In this tutorial, I'll show you how to create an Auto Sliding/Scrolling Image Effect in Elementor and make this Infinite Scrolling Image Slider. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet for Auto Sliding Image Effect: makedreamwebsite.com/create-an-auto-sliding-scrolling-image-effect-in-elementor/ ✅Get this READY-MADE template on TEMPLATISH: templatish.com/templat...
Make this Icon Navigation Menu Bar like an App in Elementor/WordPress | Magic Menu Indicator
Просмотров 75 тыс.Год назад
Today we will see how to make this Icon Navigation Menu Bar like an App in Elementor/WordPress website. Let's just create a Magic Menu Indicator. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet for Elementor Icon Menu: makedreamwebsite.com/make-this-icon-navigation-menu-bar-like-an-app-in-elementor-wordpress/ ✅Get this READY-MADE template on TEMPLATISH: templatish.com/t...
How to Create a STUNNING Contact Us Page in Elementor Pro/WordPress | Contact Form Design Tutorial
Просмотров 32 тыс.Год назад
Today, I'll show you how to Create a STUNNING Contact Us Page in Elementor Pro/WordPress. This is a Contact Form Design Tutorial. ✅Get Elementor Pro: makedreamwebsite.com/elementor-pro ✅Get code snippet and Image for Stunning Contact Page: makedreamwebsite.com/how-to-create-a-stunning-contact-us-page-in-elementor-pro-wordpress/ ✅Get this READY-MADE template on TEMPLATISH: templatish.com/templat...
Elementor Repeat Image Hover Effect | Elementor Tips and Tricks
Просмотров 9 тыс.Год назад
Elementor Repeat Image Hover Effect | Elementor Tips and Tricks
Smooth Background Color Change on Scroll in Elementor | Scrolling Background Effect/Animation
Просмотров 27 тыс.Год назад
Smooth Background Color Change on Scroll in Elementor | Scrolling Background Effect/Animation
Slide Anything in Elementor/WordPress? Advanced Custom Carousel/Slider with Templates (NO PLUGIN)
Просмотров 87 тыс.Год назад
Slide Anything in Elementor/WordPress? Advanced Custom Carousel/Slider with Templates (NO PLUGIN)
Elementor Animated Circle Background Effect | Mouse/Cursor Image Hover Animation in WordPress
Просмотров 20 тыс.Год назад
Elementor Animated Circle Background Effect | Mouse/Cursor Image Hover Animation in WordPress
Make a Portfolio Gallery with Live Preview Box in Elementor | Portfolio for Web Designer/Developer
Просмотров 25 тыс.Год назад
Make a Portfolio Gallery with Live Preview Box in Elementor | Portfolio for Web Designer/Developer
Make an Image Hotspot with Text in your WordPress Website using Elementor Pro Hotspot Widget
Просмотров 9 тыс.Год назад
Make an Image Hotspot with Text in your WordPress Website using Elementor Pro Hotspot Widget
Elementor WOW Entrance Animation/Effect with Image and Text | WordPress Cool/Creative Banner Design
Просмотров 47 тыс.Год назад
Elementor WOW Entrance Animation/Effect with Image and Text | WordPress Cool/Creative Banner Design
Elementor Advanced Slider with Card Carousel | WordPress Custom Slider Design with Text and Image
Просмотров 404 тыс.Год назад
Elementor Advanced Slider with Card Carousel | WordPress Custom Slider Design with Text and Image
How to Embed YouTube Shorts Video in WordPress/Elementor Website - (SUPER EASY)
Просмотров 18 тыс.Год назад
How to Embed RUclips Shorts Video in WordPress/Elementor Website - (SUPER EASY)
[3D] Make a 360 Degree Image Rotation Effect in Elementor Website | WordPress 3D Object/Model Viewer
Просмотров 57 тыс.Год назад
[3D] Make a 360 Degree Image Rotation Effect in Elementor Website | WordPress 3D Object/Model Viewer
Elementor Liquid Button Hover Effects/Animation | Cool and Creative Button Design Ideas (NO ADDON)
Просмотров 6 тыс.Год назад
Elementor Liquid Button Hover Effects/Animation | Cool and Creative Button Design Ideas (NO ADDON)
Can you Make this Blur Card Hover Effects with Zoom Animation in Elementor? - Image Hover Effects
Просмотров 7 тыс.Год назад
Can you Make this Blur Card Hover Effects with Zoom Animation in Elementor? - Image Hover Effects
Animating Video Popup with a Play Button in Elementor/WordPress Website (Custom Video Player)
Просмотров 12 тыс.Год назад
Animating Video Popup with a Play Button in Elementor/WordPress Website (Custom Video Player)
Make a 3D Cube Slider Effects with Text in WordPress/Elementor | Creative Animated Image Carousel
Просмотров 6 тыс.Год назад
Make a 3D Cube Slider Effects with Text in WordPress/Elementor | Creative Animated Image Carousel
How to Create a WordPress Website using Elementor Cloud
Просмотров 4,8 тыс.Год назад
How to Create a WordPress Website using Elementor Cloud
Wish this worked but I pasted in the CSS code snippet on Main Section and it did nothing. Might be because there are grids and containers now?
Have you put the class name properly and did everything accurately?
@@MakeDreamWebsite I didn't see you add a class name. What is the name? Thanks
Suggestion: Can you make a tutorial about making a Poll in Elementor pro, so it's possible to add it in a Gutenberg blog post? Really love your videos btw, you're a absolute hero
If you want it to support on Gutenberg blog then it needs to be made as Gutenberg block or shortcode, as Elementor widget or section is not supported on Gutenberg blog. Thank you for your appreciation btw.
Is it possible to use this on mobile and use a mega menu, so you can expand?
Hello there, I purchased this template. it's working fine on CANVAS mode but when I switch to full width, It doesn't work as expected. Please could you help regarding this?
You can email me your page link
Excellent tutorial♥♥ How to make pressing the switch also change the color of the button (circle) I want the button to be white for the first price and black for the second price Thanks
Hello! I have a doubt. I followed exactly as you taught, but when I put the code "CSS Code Snippet for Heading Container" it didn't work. Instead, the words were all together (the title, text and button), they were expressed and not the same as the video. Can you help me?
Have you set the overflow hidden for those containers?
@@MakeDreamWebsite yes... 🥲
I used in one of my websites landing page, it completely broken the page. Why is that?
May be that conflicts with something else on your website...
The Code snippet for Blur Hover Effects doesn't work
hey thanks a lot for all the great tutorials! I have a question about a small bug i have come across. the scrolling animation works perfectly, but sometimes the images dont load/are invisible until I hover them with my mouse. Do you know why this could be?
May be your image size is so big or you have lazy load enabled.
@@MakeDreamWebsite Lazy load is not activated yet and the image size is only 159 KB. I just sent you a email with the website if you feel like taking a look at it. Anyway, thanks for the fast answer!
how you managed page content with this scrolling bar ? at my website it ome above the page content
this is great but no ideal for menus with sub menus. or is there a way around it?
Lot of you requested for the submenu version. So, I will add it with the template very soon!
Thanks♥ Excellent guide
You're welcome!
@@MakeDreamWebsiteHow to make pressing the switch also change the color of the button (circle) I want the button to be white for the first price and black for the second price Thanks
Great Video! But the arrow buttons aren’t working for me. I put the css class but if I click, it just jumps to the top of my page… anyone knows why?
after putting the js code why nothing is happening for me? should i do any thing special?
May be you have not put the class correctly on the right place or do any mistake. Can you please do it again carefully from scratch?
Do I need to adjust something in the admin? I can't really show the video in elementor. Thank you
Awesome! Thank you
You're welcome!
Great work but i am getting issues with the button. as I am clicking on it. it is taking me up of the page instead of scrolling.. can you please help me
Have you added the classes and code properly?
same here. And i added the classes
hello, thank you for this tutorial ! do you know how to add a link to the whole template ?
You can place a button above the template and make it transparent.
@@MakeDreamWebsite i love you????
Truly spectacular! Thanks for posting this tutorial. I created and recreated everything several times but it doesn't work :( I'm sure I carried out all the steps correctly, I see everything perfectly, but the slider only works on the testimonial carousel, the background doesn't change, and neither does the text. please, can you help me?
You can email me...
Great Work! I bought the template at it works perfectly! I would like to add different elements in side the menu. It's that possible; heading and buttons;
Yes, you can add as many items as you want but they won't be animated.
@@MakeDreamWebsite I did that but my items are visible before i click the button. How i can make them invisible like your items?
@@Axel1665 I see. You can email me...
ONE BIG PROBLEM, how can i merge the two sections together to make a widget because i want to add it to small part of the site where it can still be fullscreen, when opened
Great Job :)
Thanks!
Hello, thank you for this tuto. It works perfectly for me, except may be the logo who disapear brutaly (not fade). Thank's a lot!
You can email me...
thank you❤
You're welcome 😊
Thank you for creating amazing content! However, my mobile view doesn't work (other devices work perfectly): It doesn't show like yours - top to bottom, mine shows like a 'side-by-side' view. I would appreciate if you could guide me through your suggestions.
May be you have missed out some step or do something wrong. Can you please recreate it again carefully?
background overlay is not working on elementor and elementor pro like a bug how to fix? i see it once and when i refresh the page background overlay doesn't work
Have you set it as background overlay?
@@MakeDreamWebsite yes i set it as background overlay
its just show nothing
after one refresh
ruclips.net/video/QebW_QBdHsA/видео.htmlsi=xCPOMtQ8pt2ibTWg this guy copying you.
thank you very much, it's an amazing effect
Glad you like it!
thanks you so much. Now how can i link the menu created in your tutorial to the real menu of my website?
You can use the nav menu widget. But the code here is not compatible to properly work with the Nav Menu widget. For that the code need to be customised. Basically, you don't have to use the original WordPress menu. You can put your pages/other link directly from here.
I purchased the template but it doesn't trigger the icons when you reach the assigned section ID. Only hovering on it will trigger it. How can I fix it?
Have you put the correct ID with your container/section's id? Make sure you don't put the id with any nested container/section. You need to put it with the top level containers/sections. If then it still doesn't work, then you can email me. I'll have a look on that issue...
Your videos are so educational! You have a real talent for explaining complex ideas in an easy-to-understand way. Your content is so informative and well-researched. I always learn something new from your videos. Thank you for sharing your knowledge with us! Your videos are a great resource for anyone looking to learn about [topic]. You have a real gift for teaching through video. Your channel is a must-watch for anyone interested in [topic]. I appreciate all the hard work you put into making such informative videos. Your dedication to providing accurate and helpful information is inspiring.
Thank you so much for such appreciation. That inspire me more!
My arrow is not working i am working on the section not on the container please help ASAP ‼️
same here ! and i added the classes
Puedes hacer uno parecido pero para un menú que tenga subcategorias ?
That need to be done with Elementor Nav Menu widget and also the code need to be changed for it! Then it will also support submenu.
I paid and downloaded your theme but that doesn't work???
You can email me. I'll have a look on the issue
@@MakeDreamWebsite ok, what's your email?
Truly good work!!!!
Thanks 🙏
don't work on safari mobile web browser (ios) :(
hey ive downloaded the template i jst cant get the overflow to hide properly when i scroll
You can email me your page link
Love your work! Do i need Elementor Pro if i buy your templates from your webpage? In the description it says so, but in the video you said that buying is an option if you dont have Elementor Pro. Thanks!
No, it's not optional. Elementor pro is required as there are testimonial widget is used and also custom css feature
i love you ❤
Thanks!
Hello, great video! For some reason though the animation of the white box does not work properly on safari browser
I have also checked it from Safari and it works well. May be you have done something wrong. Can you please recreate it again carefully without missing any steps...
@@MakeDreamWebsite Never-mind found the problem! Sorry to bother you, thank you very much again!
How to make the this menu scrollable
This menu is already scrollable, if you add more items you can scroll through them
is it scrollable or does it only have the auto scroll animation in it? Like can the user switch manually the cards?
This is always auto scrolling. It can't be controlled by user
Please make video on stacking containers on scroll...
Yes, I'll also make it very soon!
thank u ❤💚💚
You're welcome 😊
I actually started following this channel because of the GSAP content....Please give us more GSAP and elementor content.
just one word, wooowwww. Thank you..
Thanks a ton!
Thank you very much for your very comprehensive tutorial, I would like if possible that the image also scrolls alone, is this possible?
Yes, for that you need to enable autoplay option of the testimonial widget.
I am really sorry please forgiveme it was amaizing I like that
May be you're doing some wrong step that causes error. Can you please follow the steps carefully again.. BTW, this free tutorial and the paid template both are the same thing. So, if this video doesn't work for your website then, the template also will not be working. Then, I recommend you not to buy and waste your valuable money. There is nothing to scam.
Hi thank you for this beautiful tutorial, i have a request that may be an improvement to your project if you'll be so kind to answer, i was trying to add an entrance animation to the "menu" button, but i found out that the container with the class ".mdw-side-menu", that has a overlay-background will remain visible under the Menu button, i have tried to modify your code but i was only able to hide it, setting the opacity to 0 and i am not able to show again the background-overlay, so when the menu is opened there is no background color; please would you be so kind to explain how to make this work? Thanks in advance
Yes, that background overlay can be initially hidden while your entrance animation happens. Actually that needs some more lines of code.