CODEWITHSUNDEEP
wordpresscontent-management-systemnavigationstructure
Riaz
Riaz

Reputation: 433

Is it navigation style possible in WordPress?

Can anyone please let me know if a dual navigation style is easily achievable or not possible. A WordPress developer I'm in touch with is telling me it's not.

Basically, we would like the navigation to be via links at the top of the web page (the chairs in the attached picture) but also introduce a sub-navigation on the left side of the page (the vertical tabs in the attachment).

So if you were on the HOME section, you'd have 3 tabs on the left, breaking HOME down into 3 sub parts. If you clicked on another top link and went to section XYZ, the tabs on the left would vary to offer sub-sections of XYZ.

I know it can obviously be done from a HTML point of view but the guy is saying it's not possible to do this and at the same time, keep the content editable within WordPress as Pages etc.

I would like all the main pages and their sub content editable via WordPress CMS.

Possible? Thanks

screenshot

Upvotes: 0

Views: 75

Answers (2)

Nick
Nick

Reputation: 1177

Your top menu can be a standard wordpress menu without any other links (no dropdowns or sub links) then query and get all immediate children of the current page you are on and display those pages as links. You can use this code in a side bar and include it on all template pages that have side navigation.

<?php $args = array(
'child_of' => $post->ID, //get all children of current page
'sort_order' => 'ASC',
'sort_column' => 'post_title',
'parent' => $post->ID,  //get all children that have a parent of the current page.  This will return only the children pages not grandchildren.
'post_type' => 'page',
'post_status' => 'publish'
);

$sub_pages = get_pages( $args ); 
//then loop through the $sub_pages array and display the links as needed
?>

Upvotes: 0

Ajay Patel
Ajay Patel

Reputation: 5418

You can create 2 custom menu header & side bar. For each child of header menu give different class. Now based on active page ID using jQuery enable class of sub menu to display it.

Upvotes: 1

Related Questions