Code for centering buttons on navbar?

[fluffmama]

Hiya...

wondering if you can tell me where and what code to add to center my buttons in the navbar.  They are all at the left, leaving a space at the right.

I've researched, and also looked intently at my index.template.php file to find where the align is set, but not seeing anything at all.

Any help would be appreciated.  Tks. 

[Faevilangel]

index.template.php

scroll down a little from the code below and you will see the code for buttons

Code Select Expand


// Show the menu up top. Something like [home] [help] [profile] [logout]...
function template_menu()
{


[fluffmama]

Right...i know where that is...but what I am asking is what code to I enter to center my buttons?

[Antechinus]

SMF 1.1.x or 2.0?

[Faevilangel]

ah right i thought you said i want to add buttons lol

what smf version are you using? (always add this when asking for help as they have different code)

smf rc2 http://garethgillman.co.uk/wordpress/archives/17
smf 1.1 http://garethgillman.co.uk/wordpress/archives/15

btw thats my test blog for a smf tut site 

[fluffmama]

Thank you for those links 

it is smf 1.1 


Oh and...this is what mine says.....

Code Select Expand

// Show the start of the tab section.
   echo '
         <ul>';


and this is what they are suggesting at that link....

Code Select Expand

Find: In style.css of the theme

// Show the start of the tab section.
echo '
<table style="margin-left: 10px;" border="0" cellspacing="0" cellpadding="0">

Replace With:

// Show the start of the tab section.
echo '
<table border="0" cellspacing="0" cellpadding="0" align="center">


Does the <ul>;' screw up anything?

[Antechinus]

ah right i thought you said i want to add buttons lol

what smf version are you using? (always add this when asking for help as they have different code)

smf rc2 http://garethgillman.co.uk/wordpress/archives/17

Wont work. That code is not in style.css.

Anyway there is a better way of centering list based menus that gives a perfect result regardless of the number of tabs, which means it will appear centered to both guests and logged in members and can use the full width of the page if 50% is not enough.

http://matthewjamestaylor.com/blog/beautiful-css-centered-menus-no-hacks-full-cross-browser-support

If you put that on your blog it would be cool to credit the original source.   

[Antechinus]

Thank you for those links 

it is smf 1.1 


Oh and...this is what mine says.....

Code Select Expand

// Show the start of the tab section.
   echo '
         <ul>';


and this is what they are suggesting at that link....

Code Select Expand

Find: In style.css of the theme

// Show the start of the tab section.
echo '
<table style="margin-left: 10px;" border="0" cellspacing="0" cellpadding="0">

Replace With:

// Show the start of the tab section.
echo '
<table border="0" cellspacing="0" cellpadding="0" align="center">


Does the <ul>;' screw up anything?

Ok, so you're running a custom theme with a list-based menu. You should try the method suggested in my last post.

[Faevilangel]

ah right i thought you said i want to add buttons lol

what smf version are you using? (always add this when asking for help as they have different code)

smf rc2 http://garethgillman.co.uk/wordpress/archives/17

Wont work. That code is not in style.css.

Anyway there is a better way of centering list based menus that gives a perfect result regardless of the number of tabs, which means it will appear centered to both guests and logged in members and can use the full width of the page if 50% is not enough.

http://matthewjamestaylor.com/blog/beautiful-css-centered-menus-no-hacks-full-cross-browser-support

If you put that on your blog it would be cool to credit the original source.   

damn it your right, its in index.css :p

[Antechinus]

No, it is in index.template.php.

[Faevilangel]

Thank you for those links 

it is smf 1.1 


Oh and...this is what mine says.....

Code Select Expand

// Show the start of the tab section.
   echo '
         <ul>';


and this is what they are suggesting at that link....

Code Select Expand

Find: In style.css of the theme

// Show the start of the tab section.
echo '
<table style="margin-left: 10px;" border="0" cellspacing="0" cellpadding="0">

Replace With:

// Show the start of the tab section.
echo '
<table border="0" cellspacing="0" cellpadding="0" align="center">


Does the <ul>;' screw up anything?

the code their is for the default themes, could you post your code for your menu 

[Faevilangel]

No, it is in index.template.php.

i haven't done much theme work for 2.0! its shows eh 

[fluffmama]

okie dokie....here is the code from my index.template.php file right from my theme folder....sorry it's lots, but wanted you to be able to see the whole code since it doesn't look normal? *shrugs*

Code Select Expand

// Show the start of the tab section.
echo '
<ul>';

// Show the [home] button.
echo '<li', $current_action == 'home' ? ' class="chosen"' : '', '><a href="', $scripturl, '"><span>' , $txt[103] , '</span></a></li>';

// Show the [help] button.
echo '<li', $current_action == 'help' ? ' class="chosen"' : '', '><a href="', $scripturl, '?action=help"><span>' , $txt[119] , '</span></a></li>';



Ok...and here is part from the style.css file in the themes folder.....

Code Select Expand

/* The template menu */
#tab
{
width:100%;
height:51px;
background: #FFFFFF url(./images/img/bmid_028.gif);
margin:0;
border:0;
}
#tab
{
margin:0 0 0 0;
top:0;
}
#tab ul
{
margin:0;
padding:0;
list-style:none;
float:left;

[Faevilangel]

i didn't explain well, could i see the part where the index.template calls the menu template e.g.

Code Select Expand

template_menu();

[fluffmama]

First you guys rock for being so patient with me....and not sure how much you need...but here's a chunk:  (please let me know if it's not enough) 

Code Select Expand

// Show the menu up top. Something like [home] [help] [profile] [logout]...
function template_menu()
{
global $context, $settings, $options, $scripturl, $txt;

// Work out where we currently are.
$current_action = 'home';
if (in_array($context['current_action'], array('admin', 'ban', 'boardrecount', 'cleanperms', 'detailedversion', 'dumpdb', 'featuresettings', 'featuresettings2', 'findmember', 'maintain', 'manageattachments', 'manageboards', 'managecalendar', 'managesearch', 'membergroups', 'modlog', 'news', 'optimizetables', 'packageget', 'packages', 'permissions', 'pgdownload', 'postsettings', 'regcenter', 'repairboards', 'reports', 'serversettings', 'serversettings2', 'smileys', 'viewErrorLog', 'viewmembers')))

[Faevilangel]

First you guys rock for being so patient with me....and not sure how much you need...but here's a chunk:  (please let me know if it's not enough) 

Code Select Expand

// Show the menu up top. Something like [home] [help] [profile] [logout]...
function template_menu()
{
global $context, $settings, $options, $scripturl, $txt;

// Work out where we currently are.
$current_action = 'home';
if (in_array($context['current_action'], array('admin', 'ban', 'boardrecount', 'cleanperms', 'detailedversion', 'dumpdb', 'featuresettings', 'featuresettings2', 'findmember', 'maintain', 'manageattachments', 'manageboards', 'managecalendar', 'managesearch', 'membergroups', 'modlog', 'news', 'optimizetables', 'packageget', 'packages', 'permissions', 'pgdownload', 'postsettings', 'regcenter', 'repairboards', 'reports', 'serversettings', 'serversettings2', 'smileys', 'viewErrorLog', 'viewmembers')))

okay i will try again  i need the code from the index that calls the function

could you post all of your index.template and i will find the code

[fluffmama]

KK sorry...i'm a big dummy when it comes to this stuff. 

[Antechinus]

Please do not post php templates as .txt files. It's a nuisance for testing because it means they have to be re-saved as php for easier checking of syntax. It also means that you can't just upload them to a live site for testing.

Best way to do it is to download the file via ftp so it stays as a php file with the correct name. Much less messing around.

[Faevilangel]

in the #tab of the css change margin:0 0 0 0; to margin:auto; and add width:50%;

so it should be

Code Select Expand


#tab {
margin:auto;
width:50%;
top:0;


[Antechinus]

Should be margin: 0 auto; to keep the zero margin top and bottom.