Fixed Sidebar On All Pages (left side)

This modification provides a fixed sidebar on the left side of your forums.

In IE7 and Firefox, the sidebar scrolls to remain stationary on the page. However, in IE6 it works as a normal sidebar and moves with the content.

Installation instructions are in the attached text file.




FAQ's

I've got it installed, how do I edit it?
In the header template you will find the main body of the column. This is in a tabular format consistant with all content in vBulletin.
By default I have included one (1) heading and eight (8) content rows.
To edit these locate the text Heading in the header template and replace it with whatever you wish to have it say. Repeat the process for the content.

It's too wide, can I make it narrower?
It's too narrow, can I make it wider?
Yes this is possible. However, it requires a few changes to the code not just tot he table with in the header template.
Start by changing the with in your header template, then in the additional CSS definitions change the 160 in the navigation section to the same as your width of your table, and the 165 in the content section to the width of your table plus 5.

The top of the column overlaps my header.
The top of my column is not in line with my navbar.
In the additional CSS definitions find

top:105px;

Change the number as appropriate for your style. You may need to experiment with this. The default value is correct for on the default vBulletin style.
Remember that the lower down the page your column sits, the less content you can place in it (see why do I need to watch the height of my content?).

Why do I need to watch the length of my content?
Because this sidebar stays in place when the forums scroll, it is important to pay attention to the length of the content. If you fill your side column with content based on your screen resolution, then anything at the bottom will be hidden from users with a smaller resolution. In total, the length of your column plus the top margin (default 105) should not exceed 580px. This is to allow for users with an 800x600 screen resolution.

Can you release this as a plugin/product?
No. Due to the additional CSS definitions requirements it is not possible to release this as a product or plugin. I have no intention of attempting this further in the near future.

So you are not releasing it as a product. Does that mean that someone else can?
Can I translate this modification?
Can I redistribute this modification?
Any ports of this modification to other versions or to be a product will be carried out by myself. No permission is given for ports, translations, or distributions. The only exception to this is translation for release at vBHacks-Germany.org

Are there any plans for a right sided version?
Yes. However, due to current time restraints (and current lack of internet access) this will not happen until later in the year. Please don't keep asking about it, when I have done it you will all know about it.

This is released for 3.6.2 but I run 3.x.x. Can I still use it?
This has been tested only on 3.6.2 but as it is a template modification, there is no reason why it shouldn't work on any site running vBulletin 3.x.x



Thats all the boring stuff out of the way.

If you use this modification please click install. By clicking install you will be notified of any updates, bug fixes, and other important information relating to this release.

If you like this modification, please click nominate for modification of the month. It might only be a little template mod, but I'm quite proud of this one.



The attached screenshots are taking in FF 1.5.x and IE6. IE7 has been tested and displays the same as FF. I've left the top of the browser intact for identification between each one.


A big thanks goes to [name]mikeylikesitz[/name] for his help testing in IE7

Finally, if someone could let me have a link to use as a live demo, it would be appreciated.


Enjoy it, and have fun.

[Mecho]

Originally Posted by djlotus

I really love this hack, BUT since it connaot be displayed below the navbar, I cannont use it.:hurt: Any suggestions on how to/where to find an identical hack, that works below the navbar.

yea . i need it too .

Thanks

[Ronak]

anyway to disable the scrolling effect ??

[MAME]

Ok well I added the menu and I see the text perfectly. How do I make it link to pages now. Im sorry. Im very new to this. I dont even know what language this is to learn. lol. From the text below, can you describe whic portion is used for what and where I would put a link to another page pleeease.

My Menu
</td>
</tr> <-- do I add a link in here? eg. <a href="http://wwww..blah..com>?
<tr>
<td class="alt1"> <----whats this mean?
News
</td>
</tr>
<tr>
<td class="alt1">
Gameplay Tips

[peterska2]

The language used for this is HTML

In a table (which is what is used here) you have two main parts. A tr is a row across the table and a td is a cell in that table.

Your content needs to go between a <td> and an </td>

To add a link use <a href="YOUR LINK HERE">text here</a>

[swatkins]

Originally Posted by Ronak

anyway to disable the scrolling effect ??

I was wondering this also.. I sure could use the space to place a few more boxes but can't because of the scroll..

Thanks for the great mod !

[peterska2]

Originally Posted by Ronak

anyway to disable the scrolling effect ??

Originally Posted by swatkins

I was wondering this also.. I sure could use the space to place a few more boxes but can't because of the scroll..

Thanks for the great mod !

Have a look in my profile for the left column on forumhome only

[dadu911]

How do i add a block or edit the current block? Can't seem to find in header template where the code is for the block?

[peterska2]

Look in the code you added to the header template for Heading and Content. I included 1 heading and 8 content sections as default.

[needtheend]

I do all changes correctly but something is wrong There is a problem like in the picture below. How can i fix it?



My header:

<!-- logo -->
<a name="top"></a>
<!-- main table --><table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center" class="maintable">
<tr>
	<td><!-- content table --><table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
<tr>
	<td class="header-row"><table border="0" cellspacing="0" cellpadding="0" class="header-table" width="100%">
	<tr>
		<td align="$stylevar[right]" width="9"><img src="$stylevar[imgdir_misc]/logo_left.gif" width="9" height="92" border="0" alt="" /></td>
		<td align="$stylevar[left]" class="header-table-row"><a href="$vboptions[forumhome].php$session[sessionurl_q]"><img src="$stylevar[titleimage]" border="0" height="92" alt="$vboptions[bbtitle]" /></a></td>
		<td align="$stylevar[right]" valign="bottom" width="100%" style="padding: 5px" nowrap="nowrap" class="header-table-row">

		<if condition="$show['member']">
		<div class="smallfont">
			<strong><phrase 1="$bbuserinfo[username]">$vbphrase[welcome_x]</phrase></strong><br />
			<phrase 1="$pmbox[lastvisitdate]" 2="$pmbox[lastvisittime]">$vbphrase[last_visited_x_at_y]</phrase>
			<if condition="$show['pmstats']"><br /><phrase 1="$vbphrase[unread_x_nav_compiled]" 2="$vbphrase[total_x_nav_compiled]" 3="$session[sessionurl_q]">$vbphrase[private_messages_nav]</phrase></if>
			<if condition="$show['pmwarning']"><br /><strong><phrase 1="$vbphrase[pmpercent_nav_compiled]">$vbphrase[your_pm_box_is_x_full]</phrase></strong></if>
		</div>
		<else />
		<!-- login form -->
		<form action="login.php?do=login" method="post" onsubmit="md5hash(vb_login_password, vb_login_md5password, vb_login_md5password_utf, $show[nopasswordempty])">
		<script type="text/javascript" src="clientscript/vbulletin_md5.js?v=$vboptions[simpleversion]"></script>
		<table cellpadding="0" cellspacing="$stylevar[formspacer]" border="0">
		<tr>
			<td class="smallfont"><label for="navbar_username">$vbphrase[username]</label></td>
			<td><input type="text" class="bginput" style="font-size: 11px" name="vb_login_username" id="navbar_username" size="10" accesskey="u" tabindex="101" value="$vbphrase[username]" onfocus="if (this.value == '$vbphrase[username]') this.value = '';" /></td>
			<td class="smallfont" colspan="2" nowrap="nowrap"><label for="cb_cookieuser_navbar"><input type="checkbox" name="cookieuser" value="1" tabindex="103" id="cb_cookieuser_navbar" accesskey="c" />$vbphrase[remember_me]</label></td>
		</tr>
		<tr>
			<td class="smallfont"><label for="navbar_password">$vbphrase[password]</label></td>
			<td><input type="password" class="bginput" style="font-size: 11px" name="vb_login_password" id="navbar_password" size="10" tabindex="102" /></td>
			<td><input type="submit" class="button" value="$vbphrase[log_in]" tabindex="104" title="$vbphrase[enter_username_to_login_or_register]" accesskey="s" /></td>
		</tr>
		</table>
		<input type="hidden" name="s" value="$session[sessionhash]" />
		<input type="hidden" name="do" value="login" />		
		<input type="hidden" name="vb_login_md5password" />
		<input type="hidden" name="vb_login_md5password_utf" />
		</form>
		<!-- / login form -->
		</if>	

		</td>
		<td width="9" align="$stylevar[right]" class="header-table-row"><img src="$stylevar[imgdir_misc]/logo_right.gif" width="9" height="92" border="0" alt="" /></td>
	</tr>
	</table></td>
</tr>
<!-- /logo -->
<!-- peterska2 fixed sidebar header edit start -->
<div class="page">
<span>
<div id="navigation">
<table width="160" cellspacing="$stylevar[cellspacing]" cellpadding="$stylevar[cellpadding]" border="0" class="tborder">
<tr>
<td class="tcat">
Heading
</td>
</tr>
<tr>
<td class="alt1">
Content
</td>
</tr>
<tr>
<td class="alt1">
Content
</td>
</tr>
<tr>
<td class="alt1">
Content
</td>
</tr>
<tr>
<td class="alt1">
Content
</td>
</tr>
<tr>
<td class="alt1">
Content
</td>
</tr>
<tr>
<td class="alt1">
Content
</td>
</tr>
<tr>
<td class="alt1">
Content
</td>
</tr>
<tr>
<td class="alt1">
Content
</td>
</tr>
</table>
</div>
</span>
<div id="content">
<!-- peterska2 fixed sidebar header edit end -->

<!-- nav buttons bar -->
<script type="text/javascript">
<!--
function log_out()
{
	ht = document.getElementsByTagName("html");
	ht[0].style.filter = "progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)";
	if (confirm('$vbphrase[sure_you_want_to_log_out]'))
	{
		return true;
	}
	else
	{
		ht[0].style.filter = "";
		return false;
	}
}
//-->
</script>

<tr>
	<td style="border: none; padding: 0;"><table border="0" cellspacing="0" cellpadding="0" width="100%">
	<tr>
		<td width="9" align="right" valign="bottom"><img src="$stylevar[imgdir_misc]/nav_top_left.gif" width="9" height="2" border="0" alt="" /></td>
		<td width="100%" class="navbar-top-row"><img src="$vboptions[cleargifurl]" width="1" height="2" border="0" alt="" /></td>
		<td width="9" align="left" valign="bottom"><img src="$stylevar[imgdir_misc]/nav_top_right.gif" width="9" height="2" border="0" alt="" /></td>
	</tr>
	</table></td>
</tr>
<tr>
	<td class="navbar-row" align="center"><table cellpadding="$stylevar[cellpadding]" cellspacing="0" border="0" width="100%" align="center" class="navbar-row-table">
	<tr align="center" class="vbmenu_dark">
		<td width="9" align="right" style="padding: 0;"><img src="$stylevar[imgdir_misc]/nav_left.gif" width="9" height="21" border="0" alt="" /></td>
		<if condition="$show['member']">
			<td class="vbmenu_control"><a href="usercp.php$session[sessionurl_q]">$vbphrase[user_cp]</a></td>
		</if>
		<if condition="$show['registerbutton']">
			<td class="vbmenu_control"><a href="register.php$session[sessionurl_q]" rel="nofollow">$vbphrase[register]</a></td>
		</if>
		<td class="vbmenu_control"><a href="faq.php$session[sessionurl_q]" accesskey="5">$vbphrase[faq]</a></td>
		<td class="vbmenu_control"><a href="memberlist.php$session[sessionurl_q]">$vbphrase[members_list]</a></td>
		<td class="vbmenu_control"><a href="calendar.php$session[sessionurl_q]">$vbphrase[calendar]</a></td>
		<if condition="$show['popups']">		
			<if condition="$show['searchbuttons']">
				<if condition="$show['member']">
				<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></td>
				<else />
				<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></td>
				</if>
				<td id="navbar_search" class="vbmenu_control"><a href="search.php$session[sessionurl_q]" accesskey="4" rel="nofollow">$vbphrase[search]</a> <if condition="$show['quicksearch']"><script type="text/javascript"> vbmenu_register("navbar_search"); </script></if></td>
			</if>
			<if condition="$show['member']">
				<td id="usercptools" class="vbmenu_control"><a href="$show[nojs_link]#usercptools">$vbphrase[quick_links]</a> <script type="text/javascript"> vbmenu_register("usercptools"); </script></td>		
			</if>
		<else />		
			<if condition="$show['searchbuttons']">
				<td class="vbmenu_control"><a href="search.php$session[sessionurl_q]" accesskey="4">$vbphrase[search]</a></td>
				<if condition="$show['member']">
				<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></td>
				<else />
				<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></td>
				</if>
			</if>
			<td class="vbmenu_control"><a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a></td>
			<if condition="$show['member']">			
				<td class="vbmenu_control"><a href="#" onclick="window.open('misc.php?$session[sessionurl]do=buddylist&amp;focus=1','buddylist','statusbar=no,menubar=no,toolbar=no,scrollbars=yes,resizable=yes,width=250,height=300'); return false;">$vbphrase[open_buddy_list]</a></td>			
			</if>			
		</if>
		<if condition="$show['member']">
			<td class="vbmenu_control"><a href="login.php?$session[sessionurl]do=logout&amp;logouthash=$bbuserinfo[logouthash]" onclick="return log_out()">$vbphrase[log_out]</a></td>
		</if>
		<td width="9" align="left" style="padding: 0;"><img src="$stylevar[imgdir_misc]/nav_right.gif" width="9" height="21" border="0" alt="" /></td>
	</tr>
	</table></td>
</tr>

<!-- content table -->
$spacer_open

$_phpinclude_output

my footer:

<br />
<div class="smallfont" align="center">$vbphrase[all_times_are_gmt_x_time_now_is_y]</div>
<br />

$spacer_close
<!-- /content area table -->
<!-- peterska2 fixed sidebar footer edit start -->
</div>
</div>
<!-- peterska2 fixed sidebar footer edit end -->
<tr>
<form action="$vboptions[forumhome].php" method="get" style="display: inline;">
	<td class="footer-row"><table cellpadding="$stylevar[cellpadding]" cellspacing="0" border="0" width="100%" class="page" align="center">
<tr>
	<if condition="$show['quickchooser']">
		<td class="tfoot">
			<select name="styleid" onchange="switch_id(this, 'style')">
				<optgroup label="$vbphrase[quick_style_chooser]">
					$quickchooserbits
				</optgroup>
			</select>
		</td>
	</if>
	<if condition="$show['languagechooser']">
		<td class="tfoot">
			<select name="langid" onchange="switch_id(this, 'lang')">
				<optgroup label="$vbphrase[quick_language_chooser]">
					$languagechooserbits
				</optgroup>
			</select>
		</td>
	</if>
	<td class="tfoot" align="$stylevar[right]" width="100%">
		<div class="smallfont">
			<strong>
				<if condition="$show['contactus']"><a href="$vboptions[contactuslink]" rel="nofollow">$vbphrase[contact_us]</a> -</if>
				<if condition="$vboptions['hometitle']"><a href="$vboptions[homeurl]">$vboptions[hometitle]</a> -</if>
				<if condition="$show['admincplink']"><a href="$admincpdir/index.php$session[sessionurl_q]">$vbphrase[admin]</a> -</if>
				<if condition="$show['modcplink']"><a href="$modcpdir/index.php$session[sessionurl_q]">$vbphrase[mod]</a> -</if>
				<if condition="$vboptions['archiveenabled']"><a href="archive/index.php">$vbphrase[archive]</a> -</if>
				<if condition="$vboptions[privacyurl]"><a href="$vboptions[privacyurl]">$vbphrase[privacy_statement]</a> -</if>
				<a href="#top" onclick="self.scrollTo(0, 0); return false;">$vbphrase[top]</a>
			</strong>
		</div>
	</td>
</tr>
</table><!-- / footer table --></td>
</tr>
</table><!-- / content table --></td>
</tr>
</table><!-- / main table -->

<br />

<div align="center">
	<div class="smallfont" align="center">
	<!-- Do not remove this copyright notice -->
	Design by <a href="http://www.stsoftware.biz">Vjacheslav Trushkin</a>.<br />
	$vbphrase[powered_by_vbulletin]
	<!-- Do not remove this copyright notice -->
	</div>
	
	<div class="smallfont" align="center">
	<!-- Do not remove $cronimage or your scheduled tasks will cease to function -->
	$cronimage
	<!-- Do not remove $cronimage or your scheduled tasks will cease to function -->
	
	$vboptions[copyrighttext]
	</div>
</div>

</form>

<if condition="$show['dst_correction']">
<!-- auto DST correction code -->
<form action="profile.php?do=dst" method="post" name="dstform">
	<input type="hidden" name="s" value="$session[sessionhash]" />
	<input type="hidden" name="do" value="dst" />
</form>
<script type="text/javascript">
<!--
	var tzOffset = $bbuserinfo[timezoneoffset] + $bbuserinfo[dstonoff];
	var utcOffset = new Date().getTimezoneOffset() / 60;
	if (Math.abs(tzOffset + utcOffset) == 1)
	{	// Dst offset is 1 so its changed
		document.forms.dstform.submit();
	}
//-->
</script>
<!-- / auto DST correction code -->

</if>


<script type="text/javascript" src="$stylevar[imgdir_misc]/scripts.js"></script>
<if condition="THIS_SCRIPT == 'index'">
<script type="text/javascript" src="$stylevar[imgdir_misc]/scripts_index.js"></script>
</if>

<script type="text/javascript">
<!--
	// Main vBulletin Javascript Initialization
	vBulletin_init();
//-->
</script>

[peterska2]

Sorry, the difference is the custom coded header with the navbar in. Without seeing the whole style, (and preferably an export of it) then I couldn't even start trying to work it out.

I would try putting it lower down in the header template, after your navbar stuff, but it's just a suggestion and I cannot guarentee that it will work.