Adding Search Bar to Main Menu in Expound

• 

  2w2n · Member · Jun 22, 2016 at 6:04 pm

  • Copy link
  • Add topic to favorites

  Hi All,

  Very much appreciate all the help I’ve received so far. Revisiting this topic:

  https://en.forums.wordpress.com/topic/adding-search-icon-to-nav-bar-in-expound?replies=4#post-2619608

  Thanks to @thesacredpath, I’ve added the search bar to the nav menu. However, I’m having problems hiding the sidebar search widget on all pages except the front page, I think because I’ve already hidden the sidebar to get the genericons (Facebook and Twitter) to show up on the nav bar. Here is the code I have now re: hiding the social media widget:

  #wpcom_social_media_icons_widget-2 {
  display: none;
  }
  .single #secondary {
  display: none;
  }

  .single #primary {
  width: 100%;
  }

  .single .site-content article, .single .comments-area {
  padding-right: 40px;
  }
  .page #secondary {
  display: none;
  }

  .page #primary {
  width: 100%;
  }

  .page .site-content article, .page .comments-area {
  padding-right: 40px;
  }

  .archive #secondary {
  display: none;
  }

  .archive #primary {
  width: 100%;
  }

  .archive .site-content article, .archive .comments-area {
  padding-right: 40px;
  }

  .search-results #secondary {
  display: none;
  }

  .search-results #primary {
  width: 100%;
  }

  .search-results .site-content article, .archive .comments-area {
  padding-right: 40px;
  }

  I know I need to hide the sidebar search widget and social media widget only, as opposed to the whole #secondary, but I can’t quite figure that out.

  Thanks,

  Kelly

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Jun 22, 2016 at 8:38 pm

  • Copy link

  You can use Widget Visibility to control where widgets are displayed. See if that doesn’t get you want you are wanting.

• 

  2w2n · Member · Jun 23, 2016 at 10:29 pm

  • Copy link

  Yes, all the widgets are set to front page only, except the social media and search widgets, which I need to load on all pages and then hide with CSS.

• 

  thesacredpath · Member · Jun 24, 2016 at 6:10 pm

  • Copy link

  This is going to be a challenge given that you have hidden the #secondary (sidebar) on pages with CSS. When that is done, all the child elements within #secondary are hidden as well and can’t be brought back with CSS. This is going to take some thinking and testing.

• 

  2w2n · Member · Jun 25, 2016 at 3:24 pm

  • Copy link

  Well, if I replace #secondary with #wpcom_social_media_icons_widget-2, like so…

  .single #secondary {
  display: none;
  }

  .single #primary {
  width: 100%;
  }

  .single .site-content article, .single .comments-area {
  padding-right: 40px;
  }

  .single #wpcom_social_media_icons_widget-2 {
  display: none;
  }

  .single #primary {
  width: 100%;
  }

  .single .site-content article, .single .comments-area {
  padding-right: 40px;
  }

  … the search bar shows up on the post page, and the sidebar is hidden except for a small section beneath the comments area. I can’t figure out how to remove that small section. I set all the widgets to front page only, just to test, but the section is still there.

  You can see it on this post:

  https://wearethemutants.com/2016/06/16/do-not-edit-pub-date-pending-a-little-human-compassion-john-carpenters-escape-from-new-york-as-anti-fascist-satire/

• 

  thesacredpath · Member · Jun 25, 2016 at 7:48 pm

  • Copy link

  You can set the background to “none” for .single #secondary by adding the following rule to your custom CSS.

  .single #secondary {
      background: none;
  }

• 

  2w2n · Member · Jul 2, 2016 at 2:28 am

  • Copy link

  Sorry about the delayed response. That cleared it, and the search bar seems to be working on all pages. Thanks!

• 

  thesacredpath · Member · Jul 2, 2016 at 2:29 am

  • Copy link

  Awesome, and you are welcome!