Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Montezuma Theme (http://forum.bytesforall.com/forumdisplay.php?f=53)
-   -   One row on second Menu in breadcrumb (http://forum.bytesforall.com/showthread.php?t=22714)

lordi Aug 12, 2014 12:07 AM

One row on second Menu in breadcrumb
 
Hello Sir,

I just add second menu on breadcrumb, using this some code , when I made a research in this forum, really helpful forum :)

this :

PHP Code:

<div id="breadcrumbs1-bg">
    <nav id="breadcrumbs1" class="breadcrumbs lw">
<!-- STYLE SECONDARY MENU-->
<?php wp_nav_menu                     
              

            
'container' => 'nav'
            
'container_class' => 'menu-wrapper col7'
            
'container_id' => 'menu2-wrapper'
            
'menu_id' => 'menu2'
            
'menu_class' => 'cf menu'
            
'theme_location' => 'menu2'
            
'fallback_cb' => 'bfa_cat_menu' 
        
) ); ?>       
  </nav>
</div>

and result is that the category menu with 2 row , as you can see in the below pic :

http://i58.tinypic.com/261gums.jpg

I need to make those category menu into single row, as you can see on the red box I just draw on screenshoot.

how to do that? please help me, this is my first time using montezuma, ehehehe

thanx you

juggledad Aug 12, 2014 04:34 AM

1 Attachment(s)
ok, it's time for you to do some thinking and learning. Hopefully you have read the 'on screen' documentation and know that Montezuma uses a grid system and that there are multiple 'columns' for each page. You have copied some code but don't 'know' what it does and now need to figure out what is going on.

1) you shoud get and install the FireBug extension for FireFox
2) view your page and ativate FireBug
3) select the inspection tool and click on our new menu
Attachment 2587
4) navigate to the container you have added (you might want to Google 'wp_nav_menu' and read what is in the WordPress Codex says about it) and look at it's CSS

What does the CSS say? How much space are you allowing it to have?

lordi Aug 12, 2014 08:31 AM

hello Sir,
btw, I just follow your guidelines, and bingo, found col17 width in CSS tab, which I try to change it wider, and it works,
I try this

PHP Code:

.col7 {
    
width700px;


yep, my background is not programmer, but I really willing to learn web programming :), since I love web so much
thanx for your hint Sir,

juggledad Aug 12, 2014 09:44 AM

Instead of changing the width of col7 you should use col12 instead ie use more columns. Changing the width of a single column may cause weird issues later.

lordi Aug 13, 2014 10:17 AM

oh so I need to change to another container class? am I correct?
okay i'll try it, :)

CrouchingBruin Aug 15, 2014 09:14 AM

Yes. Go to Appearance > Montezuma Options > CSS Settings and read the documentation there. Montezuma's design is based on a 12 column grid layout. On the default layout, the width of the content area is 960px, which means each column is 80px wide (960 / 12) (you can also select a 100% layout instead of the 960px layout). For the 960px layout, each column class (colx) is a multiple of 80px, so a class of col5 will be 400px wide (5 x 80).

For the responsiveness to work properly, the data elements going across a "row" should have classes which add up to 12, so the elements fill up the 960px width. In the default header, the logo area has a class of col5 and the menu has a class of col7. 5 + 7 = 12, which translates to 400px + 560px = 960px. If you are using a 100% grid instead of a 960px grid, then the logo area will take up 5/12 of the width, and the menu will take up 7/12 of the width.

So for your menu, since you've moved it to a separate line, you should give it a class of col12. You should also adjust the classes of any elements in the row from which you removed the menu. That is, you should probably change the logo area's class to col12 as well since it will be alone in that top row.


All times are GMT -6. The time now is 04:48 PM.

Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.