Remove "menu and widgets" text from sidebar

• 

  ryancuria · Member · Apr 7, 2016 at 2:24 pm

  • Copy link
  • Add topic to favorites

  My blog currently has the text “menu and widgets” displaying on the sidebar. I’d like to remove the text while still having the menu symbol (3 horizontal dashes on top of each other) available. Is this possible? I am using the Ecto theme.

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

• 

  thesacredpath · Member · Apr 8, 2016 at 12:09 am

  • Copy link

  Hi, give this a try and see what you think.

  .has-header-image .navbar .slide-menu-toggle {
      color: rgba(0, 0, 0, 0);
      width: 45px;
      font-size: 10px;
      height: 38px;
  }
  .navbar .slide-menu-toggle::before {
      color: #fff;
      float: right;
  }
  .has-header-image .navbar .slide-menu-toggle:hover {
      color: transparent;
  }
  .navbar .slide-menu-toggle:hover::before {
      color: #000;
  }

• 

  ryancuria · Member · Apr 8, 2016 at 11:24 am

  • Copy link

  This is awesome help, thank you! One further question. If this isn’t doable, your help above is still great.

  Now, when I click on the menu icon, the slide menu comes out and “menu & widgets” is displaying in small gray letters. If I unclick the menu it goes away though. Is there a way to remove the text at that level?

  Before the “menu & widgets” text there is a small “x” I would like to keep as is if possible. That should be helpful for visitors to navigate back.

• 

  ryancuria · Member · Apr 8, 2016 at 3:24 pm

  • Copy link

  After another thought, remove the “menu & widgets” as well as the small “x” would be great. I think it would look better without it.

  And is there a way for visitors to click anywhere on the main screen to push the slide menu back to the right? As of now they have to click that same icon. I’d like for them to be able to click anywhere toward the left side of the page.

• 

  thesacredpath · Member · Apr 8, 2016 at 8:47 pm

  • Copy link

  Hi, I’ve made a few adjustments throughout and added a bit more. Replace the CSS I gave you with the following.

  .has-header-image .site-header::before {
      background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  }
  .has-header-image .navbar .slide-menu-toggle {
      color: rgba(0, 0, 0, 0);
      font-size: 10px;
      height: 38px;
      width: 45px;
      text-indent: -9999px;
  }
  .navbar .slide-menu-toggle::before {
      color: #fff;
      float: right;
      text-indent: 0;
  }
  .has-header-image .navbar .slide-menu-toggle:hover {
      color: transparent;
  }
  .navbar .slide-menu-toggle:hover::before {
      color: #000;
  }
  .js .sidebar-open .navbar .slide-menu-toggle::before {
      color: #000;
  }

  And is there a way for visitors to click anywhere on the main screen to push the slide menu back to the right?

  No, that isn’t possible. It would require changes to the theme php/javascript files, and we cannot edit those at WordPress.com.

• 

  ryancuria · Member · Apr 9, 2016 at 11:49 am

  • Copy link

  This is awesome. Thanks so much for your help.

• 

  thesacredpath · Member · Apr 9, 2016 at 6:32 pm

  • Copy link

  You are welcome.