Using Nested Pages

Installation & Requirements

Nested Pages requires WordPress version 3.8 or higher, and PHP version 5.3 or higher. 

Nested Pages for WordPress Installation Folder

  1. Upload wp-nested-pages to the wp-content/plugins/ directory
  2. Activate the plugin through the Plugins menu in WordPress
  3. Click on the Pages Menu item to begin ordering pages. Nested Pages replaces the default Page management screen.
  4. To access the default the pages screen, select Default Pages located in the Pages submenu, or on the Nested Pages screen

Generated Menu

The generated menu is available for use with the name nestedpages.

Important: Any changes made to this menu on the Appearance > Menus interface will be overwritten by Nested Pages during its next sync. To hide pages or give them custom titles, use the custom fields provided by Nested Pages on the Quick Edit interface.


wp_nav_menu(array( 
	‘menu’ => ‘nestedpages’)
);

Toggling the Page Tree

Nested Pages for WordPress Tree View TogglePages are nested underneath parent pages. If a page has 1 or more children a toggle arrow appears to the left of the name. To toggle the child pages in and out of view, click this arrow. To quickly expand and collapse all pages, click the button in the upper right corner of the Nested Pages Screen. This will quickly display a tree-like structure of your entire site.


Theme Use

Page ordering in Nested Pages is saved just like native pages. To order by nested pages ordering in your theme, just use the menu_order order option in your queries

Additionally, the generated menu is available for use, with the name nestedpages. Use this menu just like you would any other. See the section titled “Menu Sync” for details on how this menu is saved.


Hiding Pages from the Tree View

One-off pages like disclaimers and landing pages can be hidden from the page tree view. This keeps the interface clean and clutter-free.

To hide a page from the tree view, open the quick edit form by clicking the “Quick Edit” button for the page. Select the option to “Hide in Nested Pages” and click Update to save the change. Pages hidden from the tree view are not shown by default. 

To toggle the page back into view, click the “Show Hidden Pages” link at the top of the screen. The hidden pages are now visible, and can be re-edited to not be hidden.


Sorting Pages

To sort pages, hover over the page row. A menu icon (three lines) will appear. Click (or tap) this icon and drag to reorder within the menu. To drag a page underneath another, drag the page to the right and underneath the target parent. Visual indication is provided with an indentation. The drag and drop functionality works similarly to WordPress menus.

screenshot-3


Menu Sync

After installing Nested Pages, a new menu will be available with the name “nestedpages.” This menu is available for use in your theme just like any other WordPress menu. By default, menu syncing is enabled. To disable the sync, uncheck “Sync Menu” at the top of the Nested Pages screen. Recheck the box to enable it again and to run the sync. 

Saving Performance: If your site has a very large number of pages, disabling page sync may help speed up the save time when using Nested Pages.

Editing the generated menu: Any manual changes made to the menu outside of the Nested Pages interface will be overwritten after the synchronization runs.

Hiding Pages in the Menu: To hide a page from the nestedpages menu, click “Quick Edit” on it’s row, select “Hide in Nav Menu”, and click “update”. If menu sync is disabled, enable it now to sync the setting. Hidden pages are marked “(Hidden)”. If a page with child pages is hidden from the menu, all of it’s child pages will also be hidden. 

Additional Menu Item Options
As of Nested Pages v1.1.1, additional options are available to customize the generated nav menu items. These correspond to the native WordPress menu settings: 

Navigation Label: The menu text (over-rides page title)
Title Attribute: Optional HTML title attribute applied to the generated <a> tag
CSS Classes: Optional css classes applied to the menu list item tag.
Link Target: Optional setting to open the link in a new menu

To access the additional menu options, select “Quick Edit” in the appropriate row, then select “Menu Options” to open the additional fields:

Nested Pages for WordPress custom menu options

Viewing the Menu: The generated menu is available under Appearance > Menus. The menu name is “nestedpages”.


Adding Child Pages

Nested Pages for WordPress Add Child ButtonTo add a child page, hover over the parent page’s row, and click the button titled “Add Child”. This item links to the new page form, with the parent pre-selected.