{"id":2188,"date":"2024-08-22T14:18:34","date_gmt":"2024-08-22T21:18:34","guid":{"rendered":"https:\/\/www.hmc.edu\/communications\/?page_id=2188"},"modified":"2026-01-23T08:49:52","modified_gmt":"2026-01-23T16:49:52","slug":"parent-menu-placement","status":"publish","type":"page","link":"https:\/\/www.hmc.edu\/communications\/wordpress-how-tos\/parent-menu-placement\/","title":{"rendered":"WordPress: Menus and Page Parent"},"content":{"rendered":"\n<p>If you create a new page, you will usually want to position it within the site hierarchy. There are two configurations to consider:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Page parent<\/li>\n\n\n\n<li>Menu placement<\/li>\n<\/ol>\n\n\n\n<h2 class=\"wp-block-heading\">Page Parent<\/h2>\n\n\n\n<p>When you create a new page, by default in the site hierarchy it sits one level below your particular site&#8217;s parent page. If that is where you would like the page to be positioned, no further action is required.<\/p>\n\n\n\n<p>Take for example the <a href=\"https:\/\/www.hmc.edu\/about\/history\/\">History of Harvey Mudd College<\/a> page. It is located on the <a href=\"http:\/\/hmc.edu\/about\">About<\/a> section of the website and appears in the breadcrumbs as a child of the About home page:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full border\"><img loading=\"lazy\" decoding=\"async\" width=\"1860\" height=\"442\" src=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/about-history.png\" alt=\"\" class=\"wp-image-2189\" srcset=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/about-history.png 1860w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/about-history-300x71.png 300w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/about-history-1024x243.png 1024w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/about-history-768x183.png 768w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/about-history-1536x365.png 1536w\" sizes=\"auto, (max-width: 1860px) 100vw, 1860px\" \/><figcaption class=\"wp-element-caption\">You can see that &#8220;History&#8221; is a child of the About page. This is the default position when you create a new page.<\/figcaption><\/figure>\n\n\n\n<p>In the next example below, a page has been placed further down the hierarchy. The board members page is a child page of the college governance page, which in turn is in the default position of one level below the site home (in this case the president&#8217;s office):<\/p>\n\n\n\n<figure class=\"wp-block-image size-full border\"><img loading=\"lazy\" decoding=\"async\" width=\"2246\" height=\"454\" src=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/board-child-page.png\" alt=\"\" class=\"wp-image-2190\" srcset=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/board-child-page.png 2246w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/board-child-page-300x61.png 300w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/board-child-page-1024x207.png 1024w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/board-child-page-768x155.png 768w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/board-child-page-1536x310.png 1536w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/board-child-page-2048x414.png 2048w\" sizes=\"auto, (max-width: 2246px) 100vw, 2246px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Setting Page Parent<\/h3>\n\n\n\n<p>If you determine that a page you have created needs placing as a child of a page other than the site&#8217;s home, then you must set the parent accordingly.<\/p>\n\n\n\n<p>On the right of the page is the settings sidebar.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-style-alignleft border\"><img loading=\"lazy\" decoding=\"async\" width=\"560\" height=\"1082\" src=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/page-sidebar.png\" alt=\"\" class=\"wp-image-2191\" srcset=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/page-sidebar.png 560w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/page-sidebar-155x300.png 155w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/page-sidebar-530x1024.png 530w\" sizes=\"auto, (max-width: 560px) 100vw, 560px\" \/><\/figure>\n\n\n\n<ol class=\"wp-block-list\">\n<li>If you don&#8217;t see the settings sidebar click the settings button<\/li>\n\n\n\n<li>Make sure the <strong>Page<\/strong> tab is selected<\/li>\n\n\n\n<li>Select the <strong>None<\/strong> button next to Parent<\/li>\n<\/ol>\n\n\n\n<p class=\"clear\">A box will pop up allowing you to search for and select the parent page:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized clear border is-style-default\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"678\" src=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/select-page-parent-1-1024x678.png\" alt=\"\" class=\"wp-image-2194\" style=\"width:600px\" srcset=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/select-page-parent-1-1024x678.png 1024w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/select-page-parent-1-300x199.png 300w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/select-page-parent-1-768x509.png 768w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/select-page-parent-1.png 1072w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Menu Placement<\/h2>\n\n\n\n<p>For users to be able to navigate to your page, it needs to be added to the dropdown menu. <\/p>\n\n\n\n<p>Hover over the site name in the admin bar and select <strong>Menus<\/strong>:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1120\" height=\"394\" src=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/select-menu.png\" alt=\"\" class=\"wp-image-2196\" srcset=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/select-menu.png 1120w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/select-menu-300x106.png 300w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/select-menu-1024x360.png 1024w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/select-menu-768x270.png 768w\" sizes=\"auto, (max-width: 1120px) 100vw, 1120px\" \/><\/figure>\n\n\n\n<p>You will be taken to a representation of the menu with each menu item a separate bar that can be dragged and dropped into the desired position.<\/p>\n\n\n\n<p>Follow these steps (the numbers correspond to markup on the images below):<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Make sure you are viewing the <strong>Section Menu<\/strong> of the site (in this example it is from the Giving site). If necessary, select it from the dropdown.<\/li>\n\n\n\n<li>Locate your page in the <strong>Add menu items section<\/strong>. New pages will automatically be at the top of the <strong>Recents<\/strong> list. In this example, a page called <strong>New Page<\/strong> is shown.<\/li>\n\n\n\n<li>Check the box next to the page(s) you wish to add to the menu.<\/li>\n\n\n\n<li>Select <strong>Add to menu<\/strong>.<\/li>\n\n\n\n<li>Your page(s) will be added to the bottom of the <strong>Menu structure<\/strong> tree on the right.<\/li>\n\n\n\n<li>Drag and drop the menu item to the desired location.\n<ul class=\"wp-block-list\">\n<li><strong>Note:<\/strong> if you have set a parent for the page you have added to the menu, make sure you indent it underneath the parent item. This will ensure it is a sub-menu item when viewed on the front-end (refer to <a href=\"#indented\">Indented Menu Items Example<\/a>).<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Select <strong>Save Menu<\/strong> before exiting.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-full border\"><img loading=\"lazy\" decoding=\"async\" width=\"1772\" height=\"1540\" src=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/add-to-menu.png\" alt=\"\" class=\"wp-image-2197\" srcset=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/add-to-menu.png 1772w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/add-to-menu-300x261.png 300w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/add-to-menu-1024x890.png 1024w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/add-to-menu-768x667.png 768w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/add-to-menu-1536x1335.png 1536w\" sizes=\"auto, (max-width: 1772px) 100vw, 1772px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full border\"><img loading=\"lazy\" decoding=\"async\" width=\"1212\" height=\"782\" src=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/added-to-menu.png\" alt=\"\" class=\"wp-image-2198\" srcset=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/added-to-menu.png 1212w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/added-to-menu-300x194.png 300w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/added-to-menu-1024x661.png 1024w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/added-to-menu-768x496.png 768w\" sizes=\"auto, (max-width: 1212px) 100vw, 1212px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full border\"><img loading=\"lazy\" decoding=\"async\" width=\"1250\" height=\"1540\" src=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/positioned-in-menu.png\" alt=\"\" class=\"wp-image-2199\" srcset=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/positioned-in-menu.png 1250w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/positioned-in-menu-244x300.png 244w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/positioned-in-menu-831x1024.png 831w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/positioned-in-menu-768x946.png 768w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/positioned-in-menu-1247x1536.png 1247w\" sizes=\"auto, (max-width: 1250px) 100vw, 1250px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"indented\">Indented Menu Items Example<\/h3>\n\n\n\n<p>The images below show how menu items indented on the menu admin page appear when viewed on the front-end.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full border\"><img loading=\"lazy\" decoding=\"async\" width=\"986\" height=\"670\" src=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/indented-menu-items.png\" alt=\"\" class=\"wp-image-2202\" srcset=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/indented-menu-items.png 986w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/indented-menu-items-300x204.png 300w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/indented-menu-items-768x522.png 768w\" sizes=\"auto, (max-width: 986px) 100vw, 986px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full border\"><img loading=\"lazy\" decoding=\"async\" width=\"762\" height=\"484\" src=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/sub-menu-front-end.png\" alt=\"\" class=\"wp-image-2203\" srcset=\"https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/sub-menu-front-end.png 762w, https:\/\/www.hmc.edu\/communications\/wp-content\/uploads\/sites\/19\/2024\/08\/sub-menu-front-end-300x191.png 300w\" sizes=\"auto, (max-width: 762px) 100vw, 762px\" \/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>If you create a new page, you will usually want to position it within the site hierarchy. There are two [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":995,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-2188","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.hmc.edu\/communications\/wp-json\/wp\/v2\/pages\/2188","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hmc.edu\/communications\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.hmc.edu\/communications\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.hmc.edu\/communications\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hmc.edu\/communications\/wp-json\/wp\/v2\/comments?post=2188"}],"version-history":[{"count":5,"href":"https:\/\/www.hmc.edu\/communications\/wp-json\/wp\/v2\/pages\/2188\/revisions"}],"predecessor-version":[{"id":2646,"href":"https:\/\/www.hmc.edu\/communications\/wp-json\/wp\/v2\/pages\/2188\/revisions\/2646"}],"up":[{"embeddable":true,"href":"https:\/\/www.hmc.edu\/communications\/wp-json\/wp\/v2\/pages\/995"}],"wp:attachment":[{"href":"https:\/\/www.hmc.edu\/communications\/wp-json\/wp\/v2\/media?parent=2188"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}