{"id":36982,"date":"2022-09-21T07:00:58","date_gmt":"2022-09-21T14:00:58","guid":{"rendered":"https:\/\/dhblog.dream.press\/blog\/?p=36982"},"modified":"2025-05-26T05:53:23","modified_gmt":"2025-05-26T12:53:23","slug":"tutorial-wp-menu-setup","status":"publish","type":"post","link":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/","title":{"rendered":"How to Set Up Your WordPress Menus (In 3 Steps)"},"content":{"rendered":"\n<p>Your WordPress menus are important elements. They provide the fastest way for your users to find your content and navigate your site. Consequently, using poorly organized or unwieldy menus can be detrimental to your UX and, in turn, damage your search engine rankings.<\/p>\n\n\n\n<p>Fortunately, WordPress includes a menu editing system that\u2019s easy for all users to grasp. For instance, you can select the location of your menu and the pages you want to display. The location can vary depending on your theme, although most WordPress themes include several options.<\/p>\n\n\n\n<h2 id=\"h-an-introduction-to-wordpress-menus-and-why-you-need-them\" class=\"wp-block-heading\"><b>An Introduction to WordPress Menus (And Why You Need Them)<\/b><\/h2>\n\n\n\n<p>Menus are <a href=\"https:\/\/crocoblock.com\/blog\/wordpress-menu-navigation\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">navigational tools<\/a> that enable your users to find content on your site. This makes them essential to your site\u2019s overall organization and <a href=\"https:\/\/www.dreamhost.com\/blog\/what-is-user-experience\/\" target=\"_blank\" rel=\"noopener\">user experience<\/a>:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1024\" height=\"452\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/dropdown-mega-menu-1024x452.jpg\" alt=\"dropdown menu\" class=\"wp-image-36988 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/dropdown-mega-menu-1024x452.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/dropdown-mega-menu-300x132.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/dropdown-mega-menu-768x339.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/dropdown-mega-menu-600x265.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/dropdown-mega-menu-1200x529.jpg.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/dropdown-mega-menu-730x322.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/dropdown-mega-menu-784x346.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/dropdown-mega-menu-877x387.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/dropdown-mega-menu.jpg.webp 1249w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/452;\" \/><\/figure><\/div>\n\n\n<p>For example, if a reader discovers your site through a search engine, they may not always land on your home page. To learn more about your site, they will need to know how to explore your other content. Out of habit, they will look for your menus to get a feel for what else there is to explore.<\/p>\n\n\n\n<p>WordPress menus can improve your site\u2019s Search Engine Optimization (SEO). Search engines reward relevant content, so making sure your menus are clear can help <a href=\"https:\/\/www.dreamhost.com\/blog\/how-to-rank-higher-seo-trends\/\" target=\"_blank\" rel=\"noopener\">increase your rankings<\/a>.<\/p>\n\n\n\n<p>There are a few other ways that menus can <a href=\"https:\/\/www.dreamhost.com\/blog\/boost-seo-wordpress-website\/\" target=\"_blank\" rel=\"noopener\">boost your SEO<\/a>, such as:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><b>Improved <\/b><b>UX<\/b><b>:<\/b> If your readers have a pleasant UX, they are likely to spend more time on your site. This means lower bounce rates for you.<\/li>\n\n\n\n<li><b>Sitelinks for <\/b><a href=\"https:\/\/www.techtarget.com\/whatis\/definition\/search-engine-results-page-SERP\" target=\"_blank\" rel=\"noopener\"><b>Search Engine Results Pages (SERPS)<\/b><\/a><b>:<\/b> Search engines results will display the main page and links to internal pages if the site and its navigation are well organized.<\/li>\n\n\n\n<li><b>Easier crawling by search engines:<\/b> Search engines use bots to crawl through your site and index your pages. Having well-organized navigation that clearly shows what content is available for each menu topic makes it easier for bots to find and index your content.<\/li>\n<\/ul>\n\n\n\n<p>The key is to have well-organized menus in a prominent location. While the perks of better SEO are awesome, menus also make it easy for your readers to find the content you\u2019ve crafted for them.<\/p>\n\n\n\n<h2 id=\"h-how-to-set-up-your-wordpress-menus-in-3-steps\" class=\"wp-block-heading\"><b>How to Set Up Your WordPress Menus (In 3 Steps)<\/b><\/h2>\n\n\n\n<p>In WordPress, menus are an inherent element. Additionally, many themes come with predefined menus and locations.<\/p>\n\n\n\n<p>However, it is also important for you to understand the best way to incorporate menus on your site. We recommend you create a sitemap (or at least a <a href=\"https:\/\/www.dreamhost.com\/blog\/5-rules-structuring-your-website\/\" target=\"_blank\" rel=\"noopener\">navigational strategy<\/a>) <i>before<\/i> you start adding menus to your site.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-step-1-create-a-new-menu-in-wordpress\"><b>Step 1:<\/b><b> Create a New Menu in WordPress<\/b><\/h3>\n\n\n\n<p>Once you\u2019ve made a navigational plan or sitemap, you\u2019re ready to create your menus. Within WordPress, navigate to <i>Appearance &gt; Customize<\/i>, then click on <i>Menus<\/i>:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1024\" height=\"574\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-create-new-menu-1024x574.jpg\" alt=\"WordPress menu\" class=\"wp-image-36990 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-create-new-menu-1024x574.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-create-new-menu-300x168.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-create-new-menu-768x431.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-create-new-menu-600x336.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-create-new-menu-730x409.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-create-new-menu-784x440.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-create-new-menu-877x492.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-create-new-menu.jpg.webp 1061w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/574;\" \/><\/figure><\/div>\n\n\n<p>If you don&#8217;t have a menu set up yet, you can simply select <i>Create New Menu<\/i> to get started. You&#8217;ll be given the option to name your menu and choose where it will appear:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1024\" height=\"574\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-menu-customizer-1024x574.jpg\" alt=\"create a new menu in WordPress\" class=\"wp-image-36994 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-menu-customizer-1024x574.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-menu-customizer-300x168.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-menu-customizer-768x431.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-menu-customizer-600x336.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-menu-customizer-730x409.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-menu-customizer-784x440.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-menu-customizer-877x492.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-menu-customizer.jpg.webp 1061w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/574;\" \/><\/figure><\/div>\n\n\n<p>Keep in mind that the locations for your menu will vary depending on your theme. When you&#8217;ve made your choices, click on <i>Next<\/i> and select the <i>Add Items<\/i> button. Now, it\u2019s time to start building your menu!<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-step-2-add-your-navigation-items\"><b>Step 2:<\/b><b> Add Your Navigation Items<\/b><\/h3>\n\n\n\n<p>For each new menu you add to WordPress, you\u2019ll be able to include any of your pages, posts, and other content. You\u2019ll see each of your site\u2019s elements separated into various sections, and they\u2019re all selectable. Just click on an item to add it to your menu:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1024\" height=\"574\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-customizer-menu-location-1024x574.jpg\" alt=\"adding new pages to your WordPress menu\" class=\"wp-image-36991 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-customizer-menu-location-1024x574.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-customizer-menu-location-300x168.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-customizer-menu-location-768x431.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-customizer-menu-location-600x337.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-customizer-menu-location-1200x673.jpg.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-customizer-menu-location-730x410.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-customizer-menu-location-784x440.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-customizer-menu-location-877x492.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-customizer-menu-location.jpg.webp 1205w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/574;\" \/><\/figure><\/div>\n\n\n<p>Once selected, you\u2019ll see the item show up in the left-hand column. If you make a mistake, you can select the red <i>X<\/i> icon to delete an entry. You can even create new content here and immediately add it to your menu. For example, to add a new page, you simply need to type a name for it in the box at the bottom of the <i>Pages<\/i> section, then select the <i>Add<\/i> button.<\/p>\n\n\n\n<p>As you add items, you should see them appear on your site in the preview panel. This useful feature lets you see what your menu looks like as you\u2019re building it. Once you\u2019ve selected everything you want to include in your menu, it\u2019s time to start organizing it.<\/p>\n\n\n\n<div class=\"article-newsletter article-newsletter--gradient\">\n\n\n<h2>Get Content Delivered Straight to Your Inbox<\/h2><p>Subscribe now to receive all the latest updates, delivered directly to your inbox.<\/p><form class=\"nwsl-form\" id=\"newsletter_block_\" novalidate><div class=\"messages\"><\/div><div class=\"form-group\"><label for=\"input_newsletter_block_\"><input type=\"email\"name=\"email\"id=\"input_newsletter_block_\"placeholder=\"Enter your email address\"novalidatedisabled=\"disabled\"\/><\/label><button type=\"submit\"class=\"btn btn--brand\"disabled=\"disabled\"><span>Sign Me Up!<\/span><svg width=\"21\" height=\"14\" viewBox=\"0 0 21 14\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n<path d=\"M13.8523 0.42524L12.9323 1.34521C12.7095 1.56801 12.7132 1.9304 12.9404 2.14865L16.7241 5.7823H0.5625C0.251859 5.7823 0 6.03416 0 6.3448V7.6573C0 7.96794 0.251859 8.2198 0.5625 8.2198H16.7241L12.9405 11.8535C12.7132 12.0717 12.7095 12.4341 12.9323 12.6569L13.8523 13.5769C14.072 13.7965 14.4281 13.7965 14.6478 13.5769L20.8259 7.39879C21.0456 7.17913 21.0456 6.82298 20.8259 6.60327L14.6477 0.42524C14.4281 0.205584 14.0719 0.205584 13.8523 0.42524Z\" fill=\"white\"\/>\n<\/svg>\n<\/button><\/div><\/form><\/div>\n\n\n<h3 class=\"wp-block-heading\" id=\"h-step-3-organize-your-menu-s-structure\"><b>Step 3:<\/b><b> Organize Your Menu\u2019s Structure<\/b><\/h3>\n\n\n\n<p>This is arguably the easiest part of setting up your WordPress menus. Organizing your menu items is as simple as dragging and dropping them into place.<\/p>\n\n\n\n<p>To do so, hover over any menu item you\u2019ve added. You\u2019ll see your cursor turn into a crosshair. From here, simply drag and drop the item up or down to reorder it:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1024\" height=\"569\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-menu-custom-links-1024x569.jpg\" alt=\"reorder menu items in WordPress\" class=\"wp-image-36993 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-menu-custom-links-1024x569.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-menu-custom-links-300x167.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-menu-custom-links-768x426.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-menu-custom-links-600x333.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-menu-custom-links-1200x666.jpg.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-menu-custom-links-730x405.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-menu-custom-links-784x435.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-menu-custom-links-877x487.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-menu-custom-links.jpg.webp 1311w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/569;\" \/><\/figure><\/div>\n\n\n<p>If you\u2019d like to create a menu hierarchy using submenus, you can do that here as well. Just drag an item to the right, and it will automatically become a sub-element of the menu item right above it.<\/p>\n\n\n\n<p>When you\u2019re ready to move on, click on the <i>Publish<\/i> button at the top of the page to preserve your changes. Alternatively, you can select <i>Save Draft<\/i> or <i>Schedule<\/i> if you don\u2019t want your new menu implemented quite yet.<\/p>\n\n\n\n<p>The <a href=\"https:\/\/wordpress.org\/support\/article\/appearance-customize-screen\/\" target=\"_blank\" rel=\"noopener\">Live Customizer<\/a> is usually the best way to set up your menus since you can see your changes while you make them. However, it\u2019s worth noting that you can create menus through a similar process in the <i>Appearance &gt; Menus<\/i> section of your dashboard:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"800\" height=\"416\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-create-menu.jpg\" alt=\"WordPress menus\" class=\"wp-image-36989 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-create-menu.jpg.webp 800w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-create-menu-300x156.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-create-menu-768x399.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-create-menu-600x312.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-create-menu-730x380.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-create-menu-784x408.jpg.webp 784w\" data-sizes=\"(max-width: 800px) 100vw, 800px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 800px; --smush-placeholder-aspect-ratio: 800\/416;\" \/><\/figure><\/div>\n\n\n<p>If you\u2019re good with code, you can also <a href=\"https:\/\/www.dreamhost.com\/blog\/learn-css\/\" target=\"_blank\" rel=\"noopener\">use CSS<\/a> to change your menu\u2019s placement using <a href=\"https:\/\/code.tutsplus.com\/tutorials\/adding-custom-hooks-in-wordpress-custom-actions--cms-26454\" target=\"_blank\" rel=\"noopener\">hooks and filters<\/a>. If you go down this route, however, you\u2019ll want to follow your theme\u2019s documentation to avoid issues with your site\u2019s layout.<\/p>\n\n\n\n<h2 id=\"h-how-to-add-additional-menus-using-the-wordpress-menu-widget\" class=\"wp-block-heading\"><b>How to Add Additional Menus Using the WordPress Menu Widget<\/b><\/h2>\n\n\n\n<p>If you\u2019d like to include additional menus elsewhere on your site (within your footer, for example), you can use WordPress\u2019 menu widgets to get the job done. To add menus to these areas, you\u2019ll need to return to <i>Appearance &gt; Customize<\/i> in WordPress. This time, you\u2019ll want to visit the <i>Widgets<\/i> section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1024\" height=\"574\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-edit-footer-widgets-1024x574.jpg\" alt=\"WordPress menu Widgets\" class=\"wp-image-36992 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-edit-footer-widgets-1024x574.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-edit-footer-widgets-300x168.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-edit-footer-widgets-768x431.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-edit-footer-widgets-600x337.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-edit-footer-widgets-1200x673.jpg.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-edit-footer-widgets-730x410.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-edit-footer-widgets-784x440.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-edit-footer-widgets-877x492.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-edit-footer-widgets.jpg.webp 1205w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/574;\" \/><\/figure><\/div>\n\n\n<p>Here, you\u2019ll see a list of preset widget areas, which will vary depending on your theme, but they\u2019re usually located in your sidebars and\/or footer. Choose the area where you want your menu to be placed, and you\u2019ll be presented with a number of widget options.<\/p>\n\n\n\n<p>To add a new widget, you\u2019ll want to search for one called <i>Navigation<\/i> <i>Menu<\/i>. If it isn\u2019t already in place, you can select <i>Add a Widget<\/i>, search for it, then click to add it to your widget area:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" width=\"1024\" height=\"406\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-navigation-menu-widgets-1024x406.jpg\" alt=\"add a new WordPress Widget\" class=\"wp-image-36995 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-navigation-menu-widgets-1024x406.jpg 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-navigation-menu-widgets-300x119.jpg 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/wordpress-navigation-menu-widgets-768x304.jpg 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-navigation-menu-widgets-600x238.jpg.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-navigation-menu-widgets-730x289.jpg.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-navigation-menu-widgets-784x311.jpg.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-navigation-menu-widgets-877x347.jpg.webp 877w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/smush-webp\/2022\/09\/wordpress-navigation-menu-widgets.jpg.webp 1030w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/406;\" \/><\/figure><\/div>\n\n\n<p>Next, expand the widget by clicking on it. You\u2019ll get the chance to add a title (which is optional), and also select the menu you\u2019d like to display. If you haven\u2019t created any menus yet, you\u2019ll be given the option to do so now. Widgets provide you with yet another way to display menus on your website and will be especially helpful if you\u2019re short of suitable locations within your chosen theme.<\/p>\n\n\n\n<h2 id=\"h-create-your-first-wordpress-menu-today\" class=\"wp-block-heading\"><b>Create Your First WordPress Menu Today<\/b><\/h2>\n\n\n\n<p>When it comes to creating a great UX, easy-to-follow navigation should be one of your highest priorities. Just as importantly, your search engine rankings also benefit from well-organized content that\u2019s easy for readers to find.<\/p>\n\n\n\n<p>Fortunately, WordPress makes it super easy to add menus to your site. You can select the items you want to display, re-arrange their order, and choose a location for your menu.<\/p>\n\n\n\n\n\n<div\n\tclass=\"article-cta-shared article-cta-small\"\n>\n    <div class=\"tr-img-wrap-outer jsLoading\"><img decoding=\"async\" class=\"js-img-lazy \" src=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/lazy-loading-transparent.webp\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/article-small-ad-cta-placeholder.webp 1x, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/article-small-ad-cta-placeholder-x2.webp 2x\"  alt=\"Ad background image\" \/><\/div>\n\n\n\n\n  <div class=\"content-btm\">\n    <h2\n      class=\"h2--md\"\n    >\n      Do More with DreamPress\n    <\/h2>\n    <p\n      class=\"p--md\"\n    >\n      DreamPress Plus and Pro users get access to Jetpack Professional (and 200+ premium themes) at no added cost!\n    <\/p>\n\n            <a\n            href=\"https:\/\/www.dreamhost.com\/wordpress\/managed\/\"\n                        class=\"btn btn--white-outline btn--sm btn--round\"\n                                    target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            >\n                            Check Out Plans                    <\/a>\n\n  <\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Your WordPress menus are important elements. They provide the fastest way for your users to find your content and navigate your site. Consequently, using poorly organized or unwieldy menus can be detrimental to your UX and, in turn, damage your search engine rankings. Fortunately, WordPress includes a menu editing system that\u2019s easy for all users [&hellip;]<\/p>\n","protected":false},"author":1062,"featured_media":36986,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_yoast_wpseo_metadesc":"Menus are navigational tools that enable your users to find content on your site. Fortunately, WordPress makes menus easy to manage.","toc_headlines":"[[\"h-an-introduction-to-wordpress-menus-and-why-you-need-them\",\"<b>An Introduction to WordPress Menus (And Why You Need Them)<\/b>\"],[\"h-how-to-set-up-your-wordpress-menus-in-3-steps\",\"<b>How to Set Up Your WordPress Menus (In 3 Steps)<\/b>\"],[\"h-how-to-add-additional-menus-using-the-wordpress-menu-widget\",\"<b>How to Add Additional Menus Using the WordPress Menu Widget<\/b>\"],[\"h-create-your-first-wordpress-menu-today\",\"<b>Create Your First WordPress Menu Today<\/b>\"]]","hide_toc":false,"footnotes":""},"categories":[13119,550,696],"tags":[],"class_list":["post-36982","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-getting-started","category-tutorials","category-wordpress"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.3 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>How to Set Up Your WordPress Menus - DreamHost<\/title>\n<meta name=\"description\" content=\"Menus are navigational tools that enable your users to find content on your site. Fortunately, WordPress makes menus easy to manage.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Set Up Your WordPress Menus (In 3 Steps)\" \/>\n<meta property=\"og:description\" content=\"Menus are navigational tools that enable your users to find content on your site. Fortunately, WordPress makes menus easy to manage.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/\" \/>\n<meta property=\"og:site_name\" content=\"DreamHost Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/DreamHost\/\" \/>\n<meta property=\"article:published_time\" content=\"2022-09-21T14:00:58+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-05-26T12:53:23+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/WordPress-Menus-Tutorial-Social.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"628\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Jason Cosper\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@dreamhost\" \/>\n<meta name=\"twitter:site\" content=\"@dreamhost\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jason Cosper\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to Set Up Your WordPress Menus - DreamHost","description":"Menus are navigational tools that enable your users to find content on your site. Fortunately, WordPress makes menus easy to manage.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/","og_locale":"en_US","og_type":"article","og_title":"How to Set Up Your WordPress Menus (In 3 Steps)","og_description":"Menus are navigational tools that enable your users to find content on your site. Fortunately, WordPress makes menus easy to manage.","og_url":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/","og_site_name":"DreamHost Blog","article_publisher":"https:\/\/www.facebook.com\/DreamHost\/","article_published_time":"2022-09-21T14:00:58+00:00","article_modified_time":"2025-05-26T12:53:23+00:00","og_image":[{"width":1200,"height":628,"url":"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/WordPress-Menus-Tutorial-Social.jpg","type":"image\/jpeg"}],"author":"Jason Cosper","twitter_card":"summary_large_image","twitter_creator":"@dreamhost","twitter_site":"@dreamhost","twitter_misc":{"Written by":"Jason Cosper","Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/#article","isPartOf":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/"},"author":{"name":"Jason Cosper","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/person\/2273b8bf7336df78f6d99a89c17253c4"},"headline":"How to Set Up Your WordPress Menus (In 3 Steps)","datePublished":"2022-09-21T14:00:58+00:00","dateModified":"2025-05-26T12:53:23+00:00","mainEntityOfPage":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/"},"wordCount":1265,"publisher":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/#primaryimage"},"thumbnailUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/WordPress-Menus-Tutorial-Feature.jpg","articleSection":["Getting Started","Tutorials","WordPress"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/","url":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/","name":"How to Set Up Your WordPress Menus - DreamHost","isPartOf":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/#primaryimage"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/#primaryimage"},"thumbnailUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/WordPress-Menus-Tutorial-Feature.jpg","datePublished":"2022-09-21T14:00:58+00:00","dateModified":"2025-05-26T12:53:23+00:00","description":"Menus are navigational tools that enable your users to find content on your site. Fortunately, WordPress makes menus easy to manage.","breadcrumb":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/#primaryimage","url":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/WordPress-Menus-Tutorial-Feature.jpg","contentUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/09\/WordPress-Menus-Tutorial-Feature.jpg","width":901,"height":598,"caption":"how to set up WordPress menus"},{"@type":"BreadcrumbList","@id":"https:\/\/www-dev.dreamhost.com\/blog\/tutorial-wp-menu-setup\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/dhblog.dream.press\/blog\/"},{"@type":"ListItem","position":2,"name":"How to Set Up Your WordPress Menus (In 3 Steps)"}]},{"@type":"WebSite","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#website","url":"https:\/\/www-dev.dreamhost.com\/blog\/","name":"DreamHost Blog","description":"","publisher":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www-dev.dreamhost.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization","name":"DreamHost","url":"https:\/\/www-dev.dreamhost.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/dhblog.dream.press\/blog\/wp-content\/uploads\/2019\/01\/dh_logo-blue-2.png","contentUrl":"https:\/\/dhblog.dream.press\/blog\/wp-content\/uploads\/2019\/01\/dh_logo-blue-2.png","width":1200,"height":168,"caption":"DreamHost"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/DreamHost\/","https:\/\/x.com\/dreamhost","https:\/\/www.instagram.com\/dreamhost\/","https:\/\/www.linkedin.com\/company\/dreamhost\/","https:\/\/www.youtube.com\/user\/dreamhostusa"]},{"@type":"Person","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/person\/2273b8bf7336df78f6d99a89c17253c4","name":"Jason Cosper","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/02\/IMG_4807-scaled.jpeg","url":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/02\/IMG_4807-scaled.jpeg","contentUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2022\/02\/IMG_4807-scaled.jpeg","caption":"Jason Cosper"},"description":"Jason is DreamHost\u2019s WordPress Product Advocate, based out of Bakersfield, CA. He is currently working on making our DreamPress product even better. In his free time, he likes to curl up on the couch and watch scary movies with his wife Sarah and three very small dogs. Follow him on Twitter.","url":"https:\/\/www-dev.dreamhost.com\/blog\/author\/jasoncosper\/"}]}},"lang":"en","translations":{"en":36982,"es":36998,"de":50820,"ru":50825,"pt":53017,"pl":53021,"uk":53024,"it":68025,"fr":69696,"nl":72626},"pll_sync_post":[],"_links":{"self":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/36982","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/users\/1062"}],"replies":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/comments?post=36982"}],"version-history":[{"count":9,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/36982\/revisions"}],"predecessor-version":[{"id":61517,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/36982\/revisions\/61517"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/media\/36986"}],"wp:attachment":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/media?parent=36982"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/categories?post=36982"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/tags?post=36982"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}