Support » Theme: Twenty Twelve » Creating a sidebar menu

  • Hi people,

    Maybe you can help me with some CSS or whatever.
    I created a vertical navigation menubar in sidebar.php but I can not figure it out why it is placed below the contentbox instead of the sidebar. When I create a widget in the sidebar then it shows up the way I want it to be.

    First I did was the transformation of the sidebar to the left side and the content box to the right side. After this first step I created a sidebar menu.

    Help please 😀 Thank you in forward!

    functions.php

    // This theme uses wp_nav_menu() in two locations.
    register_nav_menus( array(
          'sidebarmenu' => __( 'Navigation menu left sidebar', 'twentytwelve' ),   
    ) );

    In sidebar.php

    <!-- Add a vertical menu in the sidebar -->
    
        <?php if ( has_nav_menu( 'sidebarmenu' ) ) : ?>
          <nav role="navigation" class="sidebarmenu">
                <?php wp_nav_menu( array( 'theme_location' => 'sidebarmenu' ) ); ?>
          </nav>
    	<?php endif; ?>
    
    	<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
            
            <div id="secondary" class="widget-area" role="complementary">
    			<?php dynamic_sidebar( 'sidebar-1' ); ?>
    		</div><!-- #secondary -->
    	<?php endif; ?>
    

    CSS style.

    /* = Second custom left sidebar
    -------------------------------------------------------------- */
    /*-- Move sidebar to the left --*/
    @media screen and (min-width: 600px) {
        .site-content {
            float: right;
    	width: 800px;
        }
        .widget-area {
    	float: left;
    	width: 200px;
        }
    
    /*-- Sidebar navigation --*/
    
    .sidebarmenu {
    	display: block;
    	width: 200px;
    	float:left;	
    }
    
    .sidebarmenu ul {
    	width: 200px;
    }
    
    .sidebarmenu li {
    	padding: 0px 0px 5px 0px;
    	width: 200px;
     }
    
    .sidebarmenu li a {
    	color: green;
    	line-width: 200px;
    	font-weight: normal;
    	border-bottom: thin solid #000;
    	width: 200px;
    	
    }
    .sidebarmenu li a:hover {
    	color:#ccc;
    }
    
    }
     

    The navigation bar aligns under the contentbox. I made the website 1000px wide.
    Also the width of the sidebar is 200px and contentbox is now 800px.

    Gojero

    • This topic was modified 3 years, 5 months ago by Gojero.
Viewing 3 replies - 1 through 3 (of 3 total)
  • I think it has something to do with this message in sidebar.php:

    * If no active widgets are in the sidebar, hide it completely.

    How can I make the sidebar static?
    or is there another way to add a navigation bar in sidebar.php.

    Hi Gojero,

    I would add a menu to a sidebar using the standard widget ‘Custom Menu’.

    Did you try that?

    Hi Andrea,
    Thanks you for your reply.

    I certainly tried this, but I do not like the styles.
    So I was thinking of adding my own menu. Appearentely it is more difficult than I thought it would be.

    But now am I thinking.
    Maybe it is possible to change the style of this widget ‘custom menu’?

    I have found here a page of manually changing styles of widgets.
    Add styles to widgets

    Let’s give it a try! 😀

    Peace all!

    • This reply was modified 3 years, 5 months ago by Gojero.
Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Creating a sidebar menu’ is closed to new replies.