Home Blog WordPress Post & Page Dropdown Menu

WordPress Post & Page Dropdown Menu

WP Dropdown

We’re in the process of building a resource of tools to help with various developer tasks and required a menu to navigate between pages. We originally built a little dropdown menu populated from an array, but the need since presented itself for another menu to list certain posts. We wrote a little shortcode snippet that would render almost any list of posts or pages with an option to apply attributes that would filter the results via query arguments. If you’re interested in seeing how we applied the feature, see this page.

Not unlike a number of other articles to filter and return certain posts, we’re using the WordPress query functions…. with the exception that, in this case, we’re returning the results in a dropdown menu.

The Result

The result as we applied the search feature on our tools page is as follows (selecting any option will redirect you to a new page):

We used the shortcode of [dropdown parent="8986"] (where 8986 is the parent page ID).

Because the wp_query class is so robust, we can build a menu based on any number of attributes. For example, if we chose to render the last 10 articles we could use [dropdown type="post" p="1" orderby="date" order="DESC" number="10" length="60"]. The result is as follows;

I’ve truncated the length of each post to 60 characters to prevent the select box from running off the screen. The alternative measure to mitigate this issue is by styling the textbox width. In the next example, we’ll apply that style and select random posts tagged with wordpress. So, [dropdown type="post" p="1" orderby="random" order="DESC" number="10" length="60" tags="20" style="height: 30px; width: 500px;" text="Select Random Post"] returns:

WordPress Shortcode

Copy and paste the WordPress function into your theme's functions.php file or, if you sensibly have one installed, your custom functions plugin. You may optionally download and install our plugin from the bottom of of the page.

If you require shortcode to work in a sidebar widget, you'll have to enable the functionality with a filter. If you're using our custom functions plugin, you'll have that feature enabled by default.

Shortcode Attributes

Given the scope of the wp_query object, there are any number of queries that might be performed. We’ve included the most relevant search parameters to filter results.


There are 8 major post statuses that WordPress uses by default. The one that is likely to be used with a dropdown is publish (default). Other custom post types may also be used.


There are several post types that are readily available to users or internally used by the WordPress installation by default. The two that are most likely to be used are post and page (default).


If displaying pages, you may nominate a parent page. Usage will display child pages.


The exclude attribute is a comma delimited list of posts or pages to exclude form results.


To display results by author, use the author ID or login username.


To limit posts by category, use the category ID.


To limit return posts by tag, use the tags ID (multiple tags may be used).


You may order by ASC or DESC.


You may order by a large number of parameters . Most common are none, ID, author, title, name (the post slug), date, and rand (random).


If you include the date in the dropdown alongside the title, you may optionally alter the date presentation. While it defaults to the format defined by you in your WP installation,
you can alter with PHP’s date formatting.


To include the date alongside the post, use date="1".


By default we’ll return all posts, limit with number="10".


Wrap the result in paragraph tags with p="1". This navigates issues with WP shrotcodes and paragraph formatting.


Alter the style with the textbox here. For example, style="height: 30px; width: 400px;".


To change the text on the select box (Select Page), use text="Text in here".


Since post lengths can be long, you may truncate them with length="60". This uses the beliefmedia_split_dropdown_string() function.


The wp_query can be an expensive operation. We cache the result for 8 hours by default. Alter in the shortcode or hardcode into the function.


  • Read more on wp_query here . Related articles here Tag: wp_query.


Title: WordPress Post & Page Dropdown Menu
Description: Displays a dropdown menu of posts or pages with shortcode. Number of parameters available to filter results.
Download: Shortcode (V0.1) | WP Plugin (V0.1) | Plugin Page

■ ■ ■

Interested in WordPress and Web Design? Subscribe to our list and we'll send you subscriber-only tools and plugins

Short URL for this post: http://shor.tt/19oA


Please enter your comment!
Please enter your name here