MyBB

flick · **Condition and vbnavbar for 1.4.11**

For those wondering what this is, this code modification allows your MyBB forum to have a vBulletin-style feature, drop down navigation, for both the search box and the User CP.

The original plugin - Conditional and vb navbar for 1.20 - was released by Lapsetur and all I have done here is to tidy it up and tweak it a little so that it looks and works fine for MyBB 1.4.4+.

In other words, the actual code released by Lapsetur that drives the plugin *still* works in MyBB 1.4.4+. The only difference is the additional modifications to bring it up to date - display wise and link edits - for MyBB 1.4.4+.

Files that you need

Std files for 1.4.x.zip
functions.php
class_templates.php

You can find all the files at the end of this post, but this is what you need to do with them:

Upload functions.php to /inc
Upload class_templates.php to /inc
Extract the contents of the zip file to your local drive
Upload the 4 .gif image files in /images to /images
Upload the 2 .js files in /jscripts to /jscripts

The next step is to edit the template of your theme. I have used the default theme for my example, but hopefully it should work with other themes as well. Replace the contents of each template with the code below:

Header Templates / header

Code:

<script language="Javascript" type="text/javascript">

var newpm_prompt = "{$lang->newpm_prompt}";

var quickdelete_confirm = "{$lang->quickdelete_confirm}";

</script>

<div id="container">

<a name="top"id="top"></a>

<div id="header">

<div class="logo" style="background:#fff url('$theme[imgdir]/logobg.gif');"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" border="0" /></a></div>

<br />

<!-- breadcrumb, login, pm info -->

<table class="tborder" cellpadding="$theme[tablespace]" cellspacing="$theme[borderwidth]" border="0" width="100%" align="center">

<tr>

<td class="trow1" width="100%">

<table cellpadding="0" cellspacing="0" border="0">

<tr valign="bottom">

<td>&nbsp;</td>

<td width="100%"><navigation></td>

</tr>

</table>

</td>

<if condition=$mybb->user['uid']> 0 <then>

<td class="trow1" valign="top" nowrap="nowrap">

<div class="smalltext">

$lang->welcome_back<br />

<a href="private.php">$lang->welcome_pms</a> $lang->welcome_pms_usage<br />

$lang->welcome_current_time

</div>

</td>

<else />

<td class="trow1" nowrap="nowrap" style="padding:0px">

<!-- login form -->

<form action="member.php" method="post">

<table cellpadding="0" cellspacing="3" border="0" class="trow1">

<tr>

<td class="smalltext">$lang->username</td>

<td><input type="text" name="username" size="10" title="$lang->username" value="Username" onfocus="this.value=''" /></td>

</tr>

<tr>

<td class="smalltext">$lang->password</td>

<td><input type="password" name="password" size="10" title="$lang->password" value="$lang->password" onfocus="this.value=''" /></td>

<td><input type="submit" class="smalltext" style="font-weight:normal" value="OK" /></td>

</tr>

</table>

<input type="hidden" name="action" value="do_login" />

<input type="hidden" name="url" value="" />

</form>

<!-- / login form -->

</td>

</if>

</tr>

</table>

<!-- / breadcrumb, login, pm info -->

<table cellpadding="5" cellspacing="0" border="0" width="100%" class="tvbnav" align="center">

<tr>

<td class="tcat" align="center">{$welcomeblock}</td>

<td class="tcat" align="center"><a href="{$mybb->settings['bburl']}/index.php"><strong>Index</strong></a></td>

<td class="tcat" align="center">

<a href="{$mybb->settings['bburl']}/search.php" id="search" onclick="return openMenu(this)" class="popup_button">{$lang->toplinks_search}<img src="images/popup_down.gif" border="0" /></a></td>

<td class="tcat" align="center"><a href="{$mybb->settings['bburl']}/memberlist.php"><strong>{$lang->toplinks_memberlist}</strong></a></td>

<td class="tcat" align="center"><a href="{$mybb->settings['bburl']}/calendar.php"><strong>{$lang->toplinks_calendar}</strong></a></td>

<td class="tcat" align="center"><a href="{$mybb->settings['bburl']}/misc.php?action=help"><strong>{$lang->toplinks_help}</strong></a></td>

$admincplink

$modcplink

<if condition=$mybb->user['uid']> 0 <then>

<td class="tcat" align="center"> <a href="{$mybb->settings['bburl']}/member.php?action=logout&amp;logoutkey={$mybb->user['logoutkey']}"><strong>$lang->welcome_logout</strong></a></td><else /></if>

</tr></table>

<hr class="hidden" />

</div>

<hr class="hidden" />

<div id="content">

            {$pm_notice}

            {$bannedwarning}

            {$bbclosedwarning}

            {$unreadreports}

<!-- header quick search form -->

<div class="menupop" id="search-popup" style="display:none">

<table cellpadding="4" cellspacing="1" border="0">

<tr>

<td class="tcat">Search</td>

</tr>

<tr>

<td class="row">

<form method="post" action="$settings[bburl]/search.php">

<input type="hidden" name="action" value="do_search" />

<input type="hidden" name="postthread" value="1" />

<input type="hidden" name="forums" value="all" />

<input type="hidden" name="showresults" value="threads" />

<input type="text" name="keywords" value="" />

$gobutton

</form>

</td>

</tr>

<tr>

<td class="menu_row"><a href="search.php">Advanced Search</a></td>

</tr>

</table>

</div>

<!-- / header quick search form -->

<br />

Header Templates / header_welcomeblock_guest

Code:

<a href="{$mybb->settings['bburl']}/member.php?action=register"><strong>{$lang->welcome_register}</strong></a>

Header Templates / header_welcomeblock_member

Code:

<a href="usercp.php" id="usercp" onclick="return openMenu(this)" class="popup_button">User CP<img src="images/popup_down.gif" border="0" /></a>

<!-- user cp tools menu -->

<div class="menupop" id="usercp-popup" style="display:none">

<table cellpadding="4" cellspacing="1" border="0">

<tr><td class="tcat">Quick Links</td></tr>

<tr><td class="menu_row"><a href="search.php?action=getnew" title="View New Posts">{$lang->welcome_newposts}</a></td></tr>

<tr><td class="menu_row"><a href="{$mybb->settings['bburl']}/search.php?action=getdaily" title="View Today's Posts">{$lang->welcome_todaysposts}</a></td></tr>

<tr><td class="menu_row"><a href="misc.php?action=markread" title="Mark All Forums Read">Mark All Forums Read</a></td></tr>

<tr><td class="menu_row"><a href="#" onclick="MyBB.popupWindow('{$mybb->settings['bburl']}/misc.php?action=buddypopup', 'buddyList', 350, 350);" title="Open Buddy/Ignore List">Buddy/Ignore List</a></td></tr>

<tr><td class="tcat"><a href="{$mybb->settings['bburl']}/usercp.php" title="User Control Panel">User Control Panel</a></td></tr>

<tr><td class="menu_row"><a href="usercp.php?action=editsig" title="Change Signature">Change Signature</a></td></tr>

<tr><td class="menu_row"><a href="usercp.php?action=avatar" title="Change Avatar">Change Avatar</a></td></tr>

<tr><td class="menu_row"><a href="usercp.php?action=profile" title="Edit Profile">Edit Profile</a></td></tr>

<tr><td class="menu_row"><a href="usercp.php?action=options" title="Edit Options"">Edit Options</a></td></tr>

<tr><td class="tcat">Miscellaneous</td></tr>

<tr><td class="menu_row"><a href="private.php" title="View Private Messages">Private Messages</a></td></tr>

<tr><td class="menu_row"><a href="usercp.php?action=subscriptions" title="Subscribed Threads">Subscribed Threads</a></td></tr>

<tr><td class="menu_row"><a href="member.php?action=profile&amp;uid={$mybb->user['uid']}" title="View Profile">View Profile</a></td></tr>

</table>

</div>

Header Templates / header_welcomeblock_member_admin

Code:

<td class="tcat" align="center"><a href="{$mybb->settings['bburl']}/{$config['admin_dir']}/index.php"><strong>{$lang->welcome_admin}</strong></a></td>

Header Templates / header_welcomeblock_member_moderator

Code:

<td class="tcat" align="center"><a href="{$mybb->settings['bburl']}/modcp.php"><strong>{$lang->welcome_modcp}</strong></a></td>

Ungrouped Templates / headerinclude

Code:

<link rel="alternate" type="application/rss+xml" title="{$lang->latest_threads} (RSS 2.0)" href="{$mybb->settings['bburl']}/syndication.php" />

<link rel="alternate" type="application/atom+xml" title="{$lang->latest_threads} (Atom 1.0)" href="{$mybb->settings['bburl']}/syndication.php?type=atom1.0" />

<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />

<meta http-equiv="Content-Script-Type" content="text/javascript" />

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/prototype.js?ver=1400"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/general.js?ver=1400"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1400"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/menu.js"></script>

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/mybb.js"></script>

{$stylesheets}

<script type="text/javascript">

<!--

    var cookieDomain = "{$mybb->settings['cookiedomain']}";

    var cookiePath = "{$mybb->settings['cookiepath']}";

    var cookiePrefix = "{$mybb->settings['cookieprefix']}";

    var deleteevent_confirm = "{$lang->deleteevent_confirm}";

    var removeattach_confirm = "{$lang->removeattach_confirm}";

    var loading_text = '{$lang->ajax_loading}';

    var saving_changes = '{$lang->saving_changes}';

    var use_xmlhttprequest = "{$mybb->settings['use_xmlhttprequest']}";

    var my_post_key = "{$mybb->post_code}";

    var imagepath = "{$theme['imgdir']}";

// -->

</script>

{$newpmmsg}

Forum Bit Templates / forumbit_depth2_forum

Code:

<tr>

<td class="{$bgcolor}" align="center" valign="middle" width="1"><img src="{$theme['imgdir']}/{$lightbulb['folder']}.gif" alt="{$lightbulb['altonoff']}" title="{$lightbulb['altonoff']}" class="ajax_mark_read" id="mark_read_{$forum['fid']}" /></td>

<td class="{$bgcolor}" valign="middle">

<strong><a href="{$forum_url}">{$forum['name']}</a></strong>{$forum_viewers_text}<div class="smalltext">{$forum['description']}{$modlist}{$subforums}</div>

</td>

<td class="{$bgcolor}" valign="middle" align="center" style="white-space: nowrap">{$threads}{$unapproved['unapproved_threads']}</td>

<td class="{$bgcolor}" valign="middle" align="center" style="white-space: nowrap">{$posts}{$unapproved['unapproved_posts']}</td>

<td class="{$bgcolor}" valign="middle" align="right" style="white-space: nowrap">{$lastpost}</td>

</tr>

Navigation Templates / nav

Code:

<div class="navigation">

<img style="vertical-align:bottom;" src="$theme[imgdir]/nav_start.gif" />{$nav}{$activesep}{$activebit}

</div>

Navigation Templates / nav_sep

Code:

&gt;

Navigation Templates / nav_sep_active

Code:

<br /><img style="vertical-align:bottom;" src="$theme[imgdir]/nav_end.gif" />

The next step is to create a new .css file to add to your theme.

Quote:Click on Themes->Name of your theme, e.g. Default->Add Stylesheet

Filename: vbnavbar.css
Attached to: Globally and Write my own content

vbnavbar.css

Code:

/* Popup Menus */

.popup_button {

color: #FFFFFF;

text-align: right;

font-weight: bold;

padding: 3px;

margin-top: 3px;

margin-bottom: 3px;

margin-left: 3px;

}

a.popup_button:link,

a.popup_button:visited,

a.popup_button:active,

a.popup_button:hover {

text-decoration: none;

color: #FFFFFF;

}

.popup_menu {

position: absolute;

border: 1px solid #000;

background: #ccc;

}

.popup_menu ul

{

margin:0px;

padding:0px;

list-style-type:none;

}

.popup_menu li

{

background: #fff;

margin: 1px;

padding: 0;

}

.popup_menu ul li a

{

display: block;

padding: 3px;

color: #000;

text-decoration: none;

}

* html .popup_menu ul li a {

display: block;

width: 100%;

}

.popup_menu a:hover {

background: #C7DBEE;

text-decoration: none;

color: #000;

}

.menupop {

background: #FFFFFF;

color: #000000;

border: 1px solid #0B198C;

}

/* Navbar Menu */

.tvbnav {

background: #81A2C4;

width: 100%;

margin: auto auto;

border-top: 0px;

border-left: 1px solid #0F5C8E;

border-right: 1px solid #0F5C8E;

border-bottom: 1px solid #0F5C8E;

}

Any corrections are welcome so please let me know if this works or doesn't work for you.

Some screenshots of the code modification in action can be seen below:
Guest view:

Admin view:

Admin/Member CP view:

Admin/Member Search view:

Condition and vbnavbar live samples
Screenshots and links to sites that use this code modification on their forums. Thanks to okitai for his permission to allow us to feature his forum here!

Admin: okitai
Forum URL: http://www.ithelp.co.il/forum/
Comments: okitai has actually extended the functionality of the code modification by adding icons for each item in the navigation menu and customising the sub-menus as well, which you can read about here.

------------------------
CHANGELOG
Jan 7th 2009: Minor corrections to vbnavbar.css and headerinclude (Details in post #19)
March 26th 2009: Minor correction to header (Details in post #50)
April 26th 2009: New functions.php for MyBB 1.4.5 (Details in post #59)
July 1st 2009: New functions.php and class_templates.php uploaded for MyBB 1.4.8. Existing users do not need to change to this new version.
December 10th 2009: New functions.php uploaded for MyBB 1.4.10.

------------------------
Known Bugs
New users using IE7 (and IE6) trying to register on the Forums may experience a Passwords must match error. This is because these versions of the browser are unable to handle two sets of password boxes on the same page: one set from the registration section, and the other from this code modification.
Current known solutions are to:
1. Set up 'send random password instead of allowing users to create their own password
2. Ask new users to type the password into the topright login password box as well.

------------------------
FAQs

Q: Guests can see the 'Private messages' menu option although there is a random {1} and {2} instead of any actual values?
A: Please ensure that you download class_templates.php below and replace this file with the one in your /inc folder (clearer instructions in Step 1) The specific difference between the standard MyBB and the download below can be found in this post.

Q: How can I change the background colour of my logo header to [insert name of colour]?
A: By default, the template edits above sets the default background colour to white, so if you would like to change this (like indigored) to something else, please look for this line

Code:

<div class="logo" style="background:#fff url('$theme[imgdir]/logobg.gif');">

in Header Templates/header and change the value of background to the colour you would prefer (hex value)
An example can be found here

Q: How can I change the font or text colour of my User CP dropdown menu to [insert name of colour]?
A: The text colour is inherited from the class tcat so to override this, you will need to add a few extra lines to vbnav.css. This question came about as a user had a white font against their white background (you can find the original reply here) and the necessary change was as follows:

Code:

td.tcat td.menu_row a:link,

td.tcat td.menu_row a:visited,

td.tcat td.menu_row a:hover,

td.tcat td.menu_row a:active{

    color: #000000;

}

where the value for color: is the appropriate hex value for the colour (in this instance, black).

aglioeolio · 12-28-2008, 07:55 PM

Nice mod, thank you and happy new year Smile

okitai · (This post was last modified: 12-29-2008 10:01 AM by okitai.)

Loved it. Worked on getting it to work on my forum up to the, very, early, hours of the morning.
It does work, but:
1) your code is missing (in many places) '{' or '{}' and some other stuff (everything can be found, pretty, easily).
2) All the butty of the code (tabs and sections) are lost using copy&paste from here.
3) this code doesn't "know" how to "make itself" theme friendly if your not using the MyBB default theme. If you used "tborder" and "thead" insted of "tcat" it would have been easier.
4) everyone that use this code has to understand that if you've installed plugins that put themselves in the index (or the other parts of the template cod here), they have to find this parts and copy them into the correct place at this code.
5) the UserCP/AdminCP/ModeratorCP menu cannot use MyBB arguments (like: {$lang->marked}) instead of the text for some reason. I wanted the code to be easily transferable to other languages (some caused the menu to be shown without any text at all and other where not shown as themselves).

Hope this helps,
Ori...
P.S. Sorry for the bad English, My Hebrew is better.

adigec · 12-29-2008, 09:35 PM

When new updates are avaible, the files that you change should be also updated.

flick · (This post was last modified: 12-29-2008 11:57 PM by flick.)

(12-28-2008 07:55 PM)aglioeolio Wrote: Nice mod, thank you and happy new year

Thanks for the kind words, aglioeolio. A very happy new year to you too! Smile

(12-29-2008 09:03 AM)okitai Wrote: Loved it. Worked on getting it to work on my forum up to the, very, early, hours of the morning.
It does work, but:
1) your code is missing (in many places) '{' or '{}' and some other stuff (everything can be found, pretty, easily).
2) All the butty of the code (tabs and sections) are lost using copy&paste from here.
3) this code doesn't "know" how to "make itself" theme friendly if your not using the MyBB default theme. If you used "tborder" and "thead" insted of "tcat" it would have been easier.
4) everyone that use this code has to understand that if you've installed plugins that put themselves in the index (or the other parts of the template cod here), they have to find this parts and copy them into the correct place at this code.
5) the UserCP/AdminCP/ModeratorCP menu cannot use MyBB arguments (like: {$lang->marked}) instead of the text for some reason. I wanted the code to be easily transferable to other languages (some caused the menu to be shown without any text at all and other where not shown as themselves).

Hope this helps,
Ori...
P.S. Sorry for the bad English, My Hebrew is better.

This is great feedback actually, really thanks a tonne okitai Smile

I find this sort of commentary very helpful!

1) I would be grateful if you wouldn't mind being a little more specific as to any missing { or {} brackets. What I had done was essentially copy what I had working on my own installation to each code part, so I could easily have missed out something important!

2) For the 'butty' do you mean the tabbed-space or spacing? If so, from a quick test that I've done (using Firefox 2.0.x) the code seems to copy across with the existing spacing from the forum post to the MyBB template editor. Please could you kindly elaborate on what method you're using here? Smile

3) I have to admit "tcat" is something brought over/inherited from the original plugin, but I had assumed (without doing any research) that this was still a commonly used table class in newer themes. I did add in a new table class tvbnav which ultimately styles the vbnav menu as after trying out thead and tborder, neither of them seemed to have the style I had in mind. Perhaps I should have pointed this out more clearly. Any further thoughts? ^^

4) Hmm... by this I think you mean plugins that automatically insert themselves into the index page? As far as I am aware, no changes have been made to the index page templates, so I am a little confused. Please could you let me know which plugin you were testing with this?

I have tested this out just using Online Today plugin which was originally released by ethernet and brought up to date by Samuel and it seems to be automatically inserting itself just fine.

5) This is something that I vaguely picked up on as well whilst editing the file and thought that it was something I was doing wrong; you are right that it should be {$lang->language} so that it can be used with any language pack, and I was intending to do this when updating the original modification, but I am clearly missing a step somewhere so will continue to look out for a solution. Thanks for highlighting it though, sometimes it's just so easy to forget that MyBB *is* a very international community, esp. having been away for so long, so apologies for the moment.

(12-29-2008 09:35 PM)adigec Wrote: When new updates are avaible, the files that you change should be also updated.

This is very true! Quite often one gets the 'Template needs to be reverted' message with new MyBB updates. Am not too sure what MyBB 1.5 will bring (or 1.6?) but hopefully the rest of the 1.4.x releases won't have any drastic template changes. I will continue to keep functions.php and class_templates.php as up to date as possible though.

okitai · 12-29-2008, 11:54 PM

I'm thinking of doing a copy&paste from the code I have now (with some changes and corrections) and attaching it to my next post. You are invited to my forum: http://www.ithelp.co.il/forum . Although its in Hebrew, I'm sure you'll understand what I changed and how it works.
If you want to view the forum with a user (for the user menu), use: tempuser and password: 12345 (its a regular user).

Ori...

flick · (This post was last modified: 12-30-2008 12:02 AM by flick.)

Looks good! Big Grin

I see you've added some icons to the menu as well - very nice! I would have loved to do it for the drop-down User CP part (never thought of it for the actual navigation menu!) but couldn't get it to work properly without extra edits.

Looking forward to seeing your changes Smile

p/s: I tried to login to your site initially using the "ברוך הבא, אורח" login box, but it gave me this error:

Quote:SQL Error:
1054 - Unknown column 'loginattempts' in 'field list'
Query:
UPDATE mybb_sessions SET `uid`='3', `loginattempts`='1' WHERE sid=''

p/s2: Would you mind me taking a screenshot to share with others?

okitai · (This post was last modified: 12-30-2008 12:33 AM by okitai.)

First: as for your request to take a picture - no problem, you can go ahead. I do sugest clicking on the forum that ends with "(Pocket PC)" - the site map works after some tinkering.

Second: thanks for telling me about the error. It seems that the sidebox plugin that I have doesn't know how to work with the changed SQL database in 1.4.4 version. I'll try to fix it (or download labrocca's one from his site).

Ori...
P.S. (no. 1) I changed the help so it pops up a window (so you can look at it with the site - not insted of it). I know it doesn't show anything - I have a problem with all functions using 'misc.php'.
P.S. (no. 2) As you saw, I added a menu that will (in the near future) have a few links in it. for now I keep it as a "place keeper".

flick · 01-01-2009, 03:49 AM

Thanks okitai! Big Grin

I will be sure to do a nice screen shot first thing on New Year's Day!
Please do keep us all posted about your progress. It would be nice if new features could be built into this code modification. Smile

p/s: Happy new year for 2009 everyone!
p/s2: Will also take a look at the Help part that you mentioned in your post.

okitai · 01-01-2009, 10:37 AM

This is lucky for me. I just got my forum back up and running. I had to change a lot as the system got "funny" some times. This is probbly do to the too many plugins I had.

Ori...