How to display the parent page from the header navigation
Permalink Browser Info Environment
Is there a way to display "portfolio" from the header navigation?
The child page (portfolio / project-1) can be viewed from the accordion menu, but I don't know how to view the "portfolio" page directly.
We apologize for the inconvenience, but thank you for your understanding.
The child page (portfolio / project-1) can be viewed from the accordion menu, but I don't know how to view the "portfolio" page directly.
We apologize for the inconvenience, but thank you for your understanding.
| Type: | Ticket |
|---|---|
| Status: | Archived |
I should also mention that if you have installed the sample content with this theme, you can use the "Portfolio Item" page type for your portfolio child pages. You might find this a bit easier, as "exclude from nav" will already be selected. In Full Sitemap, click on "Portfolio" (your portfolio parent page) > Add Page > "Portfolio Item"
If you haven't installed sample content, then you can create a page type for your portfolio pages if you wish. Instructions are here:
https://documentation.concrete5.org/user-guide/editors-reference/das...
If you haven't installed sample content, then you can create a page type for your portfolio pages if you wish. Instructions are here:
https://documentation.concrete5.org/user-guide/editors-reference/das...
Thank you for your reply.
With the method you taught me, the parent page of the portfolio is displayed, but the child page is not displayed in the accordion menu.
Attribute → Exclude from navigation
Is there a way to access the parent page of the navigation menu and display the child page as an accordion other than turning on or off?
I'm sorry many times, but thank you.
With the method you taught me, the parent page of the portfolio is displayed, but the child page is not displayed in the accordion menu.
Attribute → Exclude from navigation
Is there a way to access the parent page of the navigation menu and display the child page as an accordion other than turning on or off?
I'm sorry many times, but thank you.
Hello
We use a Bootstrap menu, and with this menu, the parent links are not navigable if there is a dropdown menu. Bootstrap uses this menu behaviour as it is touch device friendly. The menu is described on page 6 of the documentation (see below).
ABOUT THE TOP MENU
The top navigation menu is a "fixed" menu, which means that it sticks to the top of the page enabling the user to always be able to easily access the navigation. When the menu is viewed on a smaller device, such as a mobile, a collapsible menu will show.
One thing to bear in mind with this menu is that if you have any subpages below a page, the top page will show a dropdown arrow to navigate to the subpages. If you have subpages, the top menu page will be a placeholder only, not a page that users can navigate to. For example, if you had a top menu item called "Products" with subpages "Product A" and "Product B", the user would see "Products" with an arrow next to it in the top menu. When the user clicked on the arrow, a submenu would show. They could navigate to "Product A" and "Product B" but NOT the "Products" page, as this is just a placeholder page. You will see later on in the Blog and Portfolio sections that we can exclude subpages from navigation so that the user can navigate to the top menu page.
On our demo site, we have added a page list block to the parent Portfolio page which has links to the child portfolio pages.
Please see this example:
http://juniper.pilipalawebdesign.com/index.php/portfolio/three-colu...
We wouldn’t recommend changing the behaviour of the Bootstrap menu, as it may make it less touch device friendly. However, if you do want to change it so that the parent link is navigable when there is a dropdown, you can try adding the javascript code below to the end of the functions.js file in the Juniper package folder. This file is located at juniper/themes/juniper/js
Please note that you will need to save the original functions.js file and the modified file locally. If you update your Juniper theme in the future, you will need to manually upload the modified functions.js file again.
This code and other suggestions for changing the Bootstrap menu may be found here:
https://stackoverflow.com/questions/19935480/bootstrap-3-how-to-make...
Thanks,
Jennifer
We use a Bootstrap menu, and with this menu, the parent links are not navigable if there is a dropdown menu. Bootstrap uses this menu behaviour as it is touch device friendly. The menu is described on page 6 of the documentation (see below).
ABOUT THE TOP MENU
The top navigation menu is a "fixed" menu, which means that it sticks to the top of the page enabling the user to always be able to easily access the navigation. When the menu is viewed on a smaller device, such as a mobile, a collapsible menu will show.
One thing to bear in mind with this menu is that if you have any subpages below a page, the top page will show a dropdown arrow to navigate to the subpages. If you have subpages, the top menu page will be a placeholder only, not a page that users can navigate to. For example, if you had a top menu item called "Products" with subpages "Product A" and "Product B", the user would see "Products" with an arrow next to it in the top menu. When the user clicked on the arrow, a submenu would show. They could navigate to "Product A" and "Product B" but NOT the "Products" page, as this is just a placeholder page. You will see later on in the Blog and Portfolio sections that we can exclude subpages from navigation so that the user can navigate to the top menu page.
On our demo site, we have added a page list block to the parent Portfolio page which has links to the child portfolio pages.
Please see this example:
http://juniper.pilipalawebdesign.com/index.php/portfolio/three-colu...
We wouldn’t recommend changing the behaviour of the Bootstrap menu, as it may make it less touch device friendly. However, if you do want to change it so that the parent link is navigable when there is a dropdown, you can try adding the javascript code below to the end of the functions.js file in the Juniper package folder. This file is located at juniper/themes/juniper/js
$('li.dropdown').on('click', function() { var $el = $(this); if ($el.hasClass('open')) { var $a = $el.children('a.dropdown-toggle'); if ($a.length && $a.attr('href')) { location.href = $a.attr('href'); } } }); $(function() { $(".dropdown").hover( function(){ $(this).addClass('open') }, function(){ $(this).removeClass('open') } ); });
Please note that you will need to save the original functions.js file and the modified file locally. If you update your Juniper theme in the future, you will need to manually upload the modified functions.js file again.
This code and other suggestions for changing the Bootstrap menu may be found here:
https://stackoverflow.com/questions/19935480/bootstrap-3-how-to-make...
Thanks,
Jennifer
Attention: Since there has been no activity on this issue for two weeks, this issue has been automatically archived.
To re-open this issue, reply to this message.
To re-open this issue, reply to this message.
Attention: Since there has been no activity on this issue for two weeks, this issue has been automatically archived.
To re-open this issue, reply to this message.
To re-open this issue, reply to this message.
Apologies for the delay in replying. In Full Sitemap view, click on the portfolio pages, e.g. "Project 1" and choose "Attributes". Select "Exclude from Nav" on the left and tick the checkbox on the right beside "Exclude from Nav". When the children pages are excluded from navigation, you will be able to navigate to the parent (Portfolio).
For more info, please see the documentation in the Juniper theme folder, or herehttp://juniper.pilipalawebdesign.com/application/files/9014/8725/58...
page 25 "Add portfolio or other pagelist"
Thanks, Jennifer