- This topic has 18 replies, 2 voices, and was last updated 11 years, 2 months ago by
.
-
Posts
-
Yes, me again.
I have a page with posts http://encounternewfoundland.com/blog/ and the single posts that belong to that page http://encounternewfoundland.com/july-1st-in-newfoundland-celebration-or-remembrance/ for example
I would like to not display the primary and secondary menus, and show a custom menu, but I’m having trouble making it happen.
What I tried was to add a custom menu in the Header Widget Area, and then showing that particular widget via widget_logic plugin with is_page(xxx) etc. This works on those pages by changing my Custom Widget Widths to 100;35,35,4,24; but then why I visit a page that doesn’t display the new menu of course that falls apart, as the next 4 widgets that should be using 35,35,4,24; get jammed into the 100; slot.
Obviously, I’m going about this the wrong way. So, how should I being approaching this?
P.S. I did fix the Header Widget Area/Custom Widget Widths up as @scrambler suggested, thank-you.
I am no clear about what you are trying to do.
Do you want the regular (primary & secondary) menus on the blog page, but not on the single post pages?
if so, do you want the custom menu in the single post pages in the same place as the primary / secondary?
Is that custom menu the same on all single post pages?
Primary & Secondary to be hidden on both blog page and single posts.
Custom menu in the same place as second menu (Dining Accommodations Destinations etc.)
Custom Menu is the same for blog page and single posts.
To hide menus in the post page use the hide menu option.
To hide menus in the single post pages, add the rule below in Main Options > Fonts & Custom > Custom CSS Rule box
.single-post #nav-primary, .single-post #nav-secondary {display:none;}
To create a custom Menu in these pages right above the header widget area, Put an extra menu shortcode of your custom menu in the header HTML area, then add the rules below in the Custom CSS Rule box so that it only shows on these pages
#header-html {display:none;}
.page-id-xxx #header-html, .single-post #header-html {display:block;}replacing xxx by the page ID # of your blog page
Actually a better methid may be to do what you had done, which is add the extra menu shortcode in a widget in the header widget area using the
100;35,35,4,24;
Then we can hide that widget with custom CSS using the rules below
#widgetID {display:none;}
.single-post #widgetID, .page-id-xxx #widgetID {display:block;}We will just need to inspect the page to find the widget ID
You were right the first time. 😉 The second method is how I tried to do it, but the 100; part of the 100;35,35,4,24; stays around even though the widget is hidden, and that’s why I thought my approach to the problem was not going to be the solution.
That is 1/2 of the puzzle solved, and where I was truly stumped. Thanks a billion. 🙂
I also have other some single posts that need to have the Custom Menu hidden, and the Primary + Secondary menus visible.
So, what I did was add +#extra-x1 {display:none;} for those and,
+#nav-primary, #nav-secondary {display:none;} to the Per Post Style, and it worked like a charm.I’m much appreciative of your help scrambler in getting this project completed, thanks again. 🙂
Note: I haven’t implemented all of these changes on the above posts yet, so it might look incorrect until I get them tidied up.
The second method I gave you would work, but not using a plugin to hide the widget, you need to use custom CSS to hide it after it is generated by the theme.
If you want to try it, add the menu in a top widget in the header widget area, do not do anything else, and post back so I can give you the exact CSS to hide it on all pages except blog and single post pages
Of course, I hadn’t thought of the order of CSS being rendered as an issue! I might try the above, but there still remains the issue of some single posts needing to display the Custom Menu and other single posts hiding the Custom Menu. I don’t think this can be done with CSS? Correct me if I’m wrong; I’m no css expert atm.
Possibly with some PHP, but I’m just a noob to PHP. Another possibility is that it could be accomplished with custom post types, but I/we are bit far along with said project to explore that option…this new section was added as an after thought.
I should add to the above line:
“I don’t think this can be done with CSS?”
Well, yes it can be done with post-1, post-2, etc. but the issue then is having to go to Custom CSS screen and add the new post ID every time a new post is made.
For now, I can live with having to add a bit of code to the Per Post Style box. Of course, if you have some CSS wizadry that can make it happen, then I’m all ears.
Adding the CSS to the per post style box is the same as putting a full CSS rule in the The Custom CSS Rule box. It just makes it easier and more organized to be in the post editing page.
LOL, there is always something. The hamburger menu for Custom Menu displays on Tablets and Phones when it should not be hidden. An easy fix…just thought I’d make you aware of that @scrambler.
One final comment/insight on this. It also has the same problem of adding an unwanted menu to archive pages on tablet and phone.
Somewhat of a solution was to switch from ‘standard’ to ‘horizontal’ for the Custom Menu style. It solves the extra hamburger menu issue; however, it is meh on phones with the menu being displayed horizontally.
“The hamburger menu for Custom Menu displays on Tablets and Phones when it should not be hidden“
This does not make sense as display and not hidden are the same thing…
Did you mean that you actually want the mobile version of the custom menu you added on the blog page and single post pages to be hidden? If so there would be no menu then.
Please elaborate
“not be hidden” should read be hidden…ooops
http://encounternewfoundland.com/ has no Custom Menu, but on Tablet and Phone there is one showing. That is the case for all pages, posts and archives where there is to be no Custom Menu showing.
For http://encounternewfoundland.com/blog/ and all of its associated post, pages and archives the Custom Menu is active and works as it should. See what I’m saying?
To help troubleshoot the issue, I did thus: “Somewhat of a solution was to switch from ‘standard’ to
‘horizontal’ for the Custom Menu style. It solves the extra hamburger
menu issue; however, it is meh on phones with the menu being displayed
horizontally.”But I’m not liking being stuck with that Custom Menu display for the http://encounternewfoundland.com/blog/ section on phone with ‘horizontal’ display; however, perhaps it’s a cluse as to why the menu is not playing nice?!
- You must be logged in to reply to this topic.