[ Kinh nghiệm wordpress ]

How to Design Navigation Menus for WordPress – Monday Masterclass

In this Monday Masterclass we look at the Navigation Menus (nav. menus), why we need them, and a list of the do’s and don’ts we should be considering when we design these valuable assets for our WordPress sites.

This episode covers a lot of valuable web-building information for all levels looking to learn:

The importance of navigation menus, their effect on user experience and SEO 00:23
– Ease of Navigation 01:46
– Classic nav. Menus 03:00
– Mega Menus 04:10
– Menus for responsive/mobile view 05:18
– Menu (hamburger) icons 06:14
– Sticky nav. Menus 07:55
– Popup menus 09:23
– Two-Tier menus 11:08

Read more about navigations menus and how to build them in Elementor in the in-depth post featured in this edition of Elementor’s Online Magazine:

\ EXAMPLES USED in this MASTERCLASS (in order of appearance):
▸ Gray & Company |
▸ London Youth Games |
▸ Envato Market |
▸ Microsoft News |
▸ Meredith Corporation |
▸ The New Yorker |
▸ Bloomberg |
▸ Reuters Blog |
▸ DD Design |
▸ KBS |
▸ New Age Creative |
▸ Masi Tupongato |
▸ Star Wars Menu Icon by Adam Dorling |
▸ Kocher Kitchens |
▸ The Australian Cosmetic Institute | www.australiancosmeticinstitute.com.au
▸ Wired.com |
▸ Toyota, Brazil |
▸ Official James Bond 007 |
▸ Dark Horse Comics | www.darkhorse.com
▸ Walt Disney Company |
▸ Variety.com |
▸ BBC America |
▸ Trendy Resumes |
▸ Belle and the Brave |

▸ Travel & Tour (Template Kit) |
▸ Magazine (Template Kit) |
▸ Inview by NineTheme (Template) |

Get Elementor:
Get Elementor Pro:

To learn more about designing and creating navigation menus, we recommend that you check out these videos and tutorials:
▸ How to Create & Design a Custom Navigation Menu |
▸ Create a Responsive Menu in WordPress Using Popups |
▸ Create a Responsive Menu in WordPress Using Popups |
▸ How to Create a Transparent Sticky Header in WordPress with Elementor |
▸ Create a One Page Website on WordPress – Monday Masterclass |

-Click Subscribe – Don’t miss our next Monday Masterclass!

Nguồn: https://grenadesandwich.com/

Xem thêm: https://grenadesandwich.com/kinh-nghiem-wordpress/

Tags: ,,,,,


44 Bình luận

  1. Have a question? Please comment with the relevant timecode (e.g. 02:36)

  2. On the pop up menus (9:47) we have simplye a question. When we optimize the website with plugins ass Wp-Rockets, we disable the pop ups, and we dont know why. We assume its something about JS, but we dont know how to solution this. Whould be fine if u could us how to use Wp ROcket with elementor and do not disable the pop ups. Thank you!

  3. Good lessons

  4. Very Great Tutorial MasterClass Thankyou..💥💥💥💥💥💥

  5. Why isn’t there any mention of menus that require different menus for logged in or logged out users?

  6. thank you! i learned alot!

  7. (08:30) Please do a tutorial on how to create a vertical navigation menu like this one: wee-consulting.org thank you!

  8. Please share the video how to create these navigation menu

  9. 5:43 Video starts

  10. Why are scrolling banners not popular anymore?

  11. Why are scrolling not popular anymore?

  12. How can I create a vertical menu with a diagonal style like you shown on 6:20?

  13. Lot of babble, doesn't get to the point

  14. Hi, from Argentina. Can I change the icon hamburger menu? How? Thanks

  15. You didn’t show us how to make any of these :///

  16. you use to talk more than train ,you are a verbal teacher and it is boring

  17. At this moment I can only afford Elementor free version . I have noticed that there are some features exclusively for when one approach Elementor Pro . I wonder if you have all these differences between them listed somewhere ; that I can read to safe me time building it , lol ? thank you . (e.g. 02:36)

  18. WOW ! You got me !
    I’m creating my own website following my Instincts and your tutorials , of course but this one in particular , has really inspired me to the fullest .
    Thank you so much. I’m very happy to be using elementor to creat it

  19. This was really good.. the information is spot on!

  20. Do you have a video published, or can you please make one on the step by step setup of Navigation menu buttons using Elementor. Thank You. I am using the Woocommerce Storefront theme but not sure how to add or modify the buttons.

  21. How can we create left navigation menu and place on a page?

  22. Again, a great video. Thank you. But you really should move the camera 40 cm up, so that Simon doesn't look down his nose on the viewer all the time. Doesn't look nice….

  23. cool, thank you

  24. thankyou so much ….

  25. Are these features available only for the paid pro version?

  26. Hello. Thank you for this video.

    May I ask you something about this menu topic?
    On my website I am implementing Astra, Elementor Pro and LearnDash.
    My intent is to deliver online courses but also my blog articles.

    What kind of menu is the most appropriate for that?
    Astra has a website template for LearnDash but is does not contain a Blog option on its menu. And it is a "Classic menu".

    Could you please create a template that serves both to online courses and a blog together in the same website?

    Thank you!

  27. Sir , how we can create menu or mega menu in free Elementor.

  28. WOW best Master class I've seen you guys do 2 Thumbs-up

  29. Nice tips and advices. I though have a question. Does the pop up nav menu affect negatively the SEO and Google crawlers? You know maybe because it's a pop up… Let me know.

  30. You don't talk about animistic left sided menu. For artist portfolio for example.

  31. bed quality audio and video

  32. if you already know the whats and whys of navigation menus: skip to 2:20

  33. Hello Sir,

    Your video tutorials and master classes are really helpful.

    I chose Elementor as I found out more user friendly. It's all about practice.

    The best thing is Elementor has free version for we new comers who don't know coding.

    Later we may upgrade to Pro.

    Thank you for providing such an amazing software.

    With regards,

    Vivek Kumar.

  34. Enjoyed watching, brill.

  35. Very well done. Thank you!

  36. Thanks for this masterclass. I initially created my site in 2017 and had to use the menu within the Generate press theme (which worked), but this has given me the confidence to go back in there and modernize it with these new features. Thanks!

  37. Hello, how do we make the mobile hamburger button on the bottom of the phone and always accompany the user ?, thanks

  38. I appreciate the relevancy!! Keep up the good work!

  39. Thanks for making the video. New user here. At 5:45 you showed how to create separate menus for mobile and desktop use. But it was too fast to follow. Can you point me to the Elementor documentation which can help explain how I get this done? Please.

  40. I cant find the Publish Settings. I see only the Conditions but not the Triggers and Advanced Rules.

  41. What about the transparent menu that became white when you scroll down, like this one—-> https://www.taylorstitch.com/

  42. Guys, you are AWESOME!
    I have changed my site design & continue through your Monday masterclasses.
    Excellent job!

  43. Очень! Очень! Очень! +++

  44. 11:15 I like that two-tier menu. This is very handy especially for online shop websites.

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *