Title: change menu
Last modified: August 30, 2016

---

# change menu

 *  Resolved [mebalna](https://wordpress.org/support/users/mebalna/)
 * (@mebalna)
 * [10 years, 6 months ago](https://wordpress.org/support/topic/change-menu-5/)
 * I’m a bit new to WordPress, so sorry for (maybe) dumb question 🙂 I would like
   to change the width + opacity of the menu when expanding. How is that possible?
   I would like something like this: [http://tomvanarken.nl/](http://tomvanarken.nl/)
   
   Thank you!

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [codemovement.pk](https://wordpress.org/support/users/codemovementpk/)
 * (@codemovementpk)
 * [10 years, 6 months ago](https://wordpress.org/support/topic/change-menu-5/#post-6861189)
 * have you tried one page scroll theme it has sliding sidebar and you can set customize
   the width and height using child theme.
 *  Thread Starter [mebalna](https://wordpress.org/support/users/mebalna/)
 * (@mebalna)
 * [10 years, 6 months ago](https://wordpress.org/support/topic/change-menu-5/#post-6861325)
 * I would like to stick to boardwalk or quite similar theme.
 *  Moderator [Kathryn Presner](https://wordpress.org/support/users/zoonini/)
 * (@zoonini)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/change-menu-5/#post-6861367)
 * Certainly not a dumb question. 🙂
 * To change the width, try something like this in your custom CSS, tweaking the
   width values as you want.
 *     ```
       .site-content .sidebar {
         left: auto;
         right: 0;
         width: 25%;
       }
   
       .sidebar .sidebar-content {
         width: 400px;
       }
       ```
   
 * What kind of opacity change did you have in mind?
 * `background-color: rgba(0, 0, 0, 0.6);`
 * This is probably the basic sort of CSS you’d need, where 000 equals black and
   0.6 equals 60% opaque. You would add this line to the `.sidebar-content` declaration
   above, editing the values as you like.
 * Don’t edit the theme files directly, otherwise your changes will be overwritten
   whenever the theme is updated.
 * An easy way to add custom CSS is to install the [Jetpack plugin](http://jetpack.me/)
   and activate the [Custom CSS](http://jetpack.me/support/custom-css/) module. 
   You’ll then add your custom CSS in the new stylesheet editor that’ll appear in
   your dashboard, under Appearance > Edit CSS. You could also install a [standalone custom CSS plugin](http://wordpress.org/plugins/search.php?q=custom+css)
   if you prefer.
 *  [amandathewebdev](https://wordpress.org/support/users/amandathewebdev/)
 * (@amandathewebdev)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/change-menu-5/#post-6861368)
 * I second what Kathryn said. Also if you would like to change the opacity back
   to 100% at a certain width, like [http://tomvanarken.nl/](http://tomvanarken.nl/)
   does at 700px, you just need a media query in your custom CSS.
 * A media query tells the screen, “Hey, at this width do this.” If you add the `
   background-color: rgba(0, 0, 0, 0.6);` Kathryn suggested, then add this at the
   bottom of your custom CSS:
 *     ```
       @media only screen and (max-width: 700px) {
           .sidebar .sidebar-content {
               background-color: rgba(0, 0, 0, 1);
           }
       }
       ```
   
 * This will change it to solid black when the screen is 700px wide.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘change menu’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/boardwalk/1.0.13/screenshot.png)
 * Boardwalk
 * [Support Threads](https://wordpress.org/support/theme/boardwalk/)
 * [Active Topics](https://wordpress.org/support/theme/boardwalk/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/boardwalk/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/boardwalk/reviews/)

## Tags

 * [menu](https://wordpress.org/support/topic-tag/menu/)
 * [opacity](https://wordpress.org/support/topic-tag/opacity/)

 * 4 replies
 * 4 participants
 * Last reply from: [amandathewebdev](https://wordpress.org/support/users/amandathewebdev/)
 * Last activity: [10 years, 5 months ago](https://wordpress.org/support/topic/change-menu-5/#post-6861368)
 * Status: resolved