Mini Mods - Header Rework 4

This is a brand new version of Advanced Header V2 Rework



This is for vB4.1 & Up. So lets get started.

Upload Plugin: plugin-header-avatar.xml

Edit Template: header

Find

			<ul class="isuser">
				<li><a href="login.php?{vb:raw session.sessionurl}do=logout&amp;logouthash={vb:raw bbuserinfo.logouthash}" onclick="return log_out('{vb:rawphrase sure_you_want_to_log_out}')">{vb:rawphrase log_out}</a></li>
				<vb:if condition="$show['registerbutton']">
				<li><a href="register.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase register}</a></li>
				</vb:if>
				<li><a href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase control_panel}</a></li>
				<li><a href="{vb:link member, {vb:raw bbuserinfo}}">{vb:rawphrase your_profile}</a></li>
				<vb:if condition="$notifications_total">
				<li class="popupmenu notifications" id="notifications">
					<a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase your_notifications}: <span class="notifications-number"><strong>{vb:raw notifications_total}</strong></span></a>
					<ul class="popupbody popuphover">
						{vb:raw notifications_menubits}
					</ul>
				</li>
				<vb:else />
				<li class="popupmenu nonotifications" id="nonotifications">
					<a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase your_notifications}</a>
					<ul class="popupbody popuphover">
						<li>{vb:rawphrase no_new_messages}</li>
						<li><a href="private.php{vb:raw session.sessionurl_q}">{vb:rawphrase inbox}</a></li>
					</ul>
				</li>
				</vb:if>
				<li class="welcomelink">{vb:rawphrase welcome_x_link_y, {vb:raw bbuserinfo.username}, {vb:link member, {vb:raw bbuserinfo}}}</li>
				<vb:if condition="$vboptions['enablefacebookconnect']">
					{vb:raw facebook_header}
				</vb:if>
			</ul>
            {vb:raw template_hook.header_userinfo}
			<vb:comment><p>{vb:rawphrase last_visited_x_at_y, {vb:raw pmbox.lastvisitdate}, {vb:raw pmbox.lastvisittime}}</p></vb:comment>

Replace with...

<div class="top-header-info">
<table border="0">
  <tr>
    <td width="66" valign="top" style="padding-top: 0px; padding-bottom: 10px; font-size: 11px;">
<vb:if condition="$vboptions['enablefacebookconnect']">
<vb:if condition="$show['facebookuser']">
<a id="fb_link" href="http://www.facebook.com/profile.php?id={vb:raw bbuserinfo.fbuserid}" target="_blank" style="outline: none;"><img id="fb_squarepic" width="70" height="70" style="border: 2px solid #a2c1de; margin-right: 10px; outline: none; margin-bottom: 0px; background-color: #FFF;" alt="{vb:raw bbuserinfo.fbname}" src="https://graph.facebook.com/{vb:raw bbuserinfo.fbuserid}/picture?type=square" /><img id="fb_icon" width="14" height="14" alt="Facebook Connected: {vb:raw bbuserinfo.fbname}" src="{vb:stylevar imgdir_misc}/facebook.gif" /></a>
<vb:else />
{vb:raw header_avatar}
</vb:if>
</vb:if>
</td>
<td valign="top" align="left" style="padding-left: 8px; float: left;">
			<div style="float: left; margin-left: -5px;"><ul class="isuser">
<li class="popupmenu nonotifications" id="nonotifications">
					<a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}" style="background-color: #2f4456; outline: none;">{vb:raw bbuserinfo.username}</a>
					<ul class="popupbody popuphover" style="position: absolute !important;
left: -65px !important;">
<vb:if condition="$vboptions['enablefacebookconnect']">
<vb:if condition="$show['facebookuser']">
<vb:else />
<li><a id="fb_loginbtn" href="#" class="fbpp-link">Login with Facebook</li>
</vb:if>
</vb:if>
<vb:if condition="$notifications_total">
						{vb:raw notifications_menubits}
</vb:if>
<li><a href="private.php{vb:raw session.sessionurl_q}">{vb:rawphrase inbox}</a></li>
<li><a href="{vb:link member, {vb:raw bbuserinfo}}">{vb:rawphrase your_profile}</a></li>
<li><a href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase control_panel}</a></li>
<li><a href="login.php?{vb:raw session.sessionurl}do=logout&amp;logouthash={vb:raw bbuserinfo.logouthash}" onclick="return log_out('{vb:rawphrase sure_you_want_to_log_out}')">{vb:rawphrase log_out}</a></li>
					</ul>
				</li>
<li class="welcomelink">Welcome, </li></ul></div>
			{vb:raw template_hook.header_userinfo}
<p style="font-size: 11px; margin-top: 10px; float: left; text-align: left; margin-bottom: 10px;">
<b>Post Count:</b> {vb:raw bbuserinfo.posts}<br><br><b>Last Visit:</b> {vb:raw pmbox.lastvisitdate} @ {vb:raw pmbox.lastvisittime}
</p>
</td></tr></table>
</div>

Add the following css code on the bottom of : vbulletin.css

.top-header-info{
position:absolute;
z-index: 2000;
top:0px;
right:-20px;
padding-left: 12px;
padding-top: 8px;
padding-right: 6px;
padding-bottom: 0px;
margin-top: -0px;
height: auto;
width:320px;
color:#FFFFFF;
background: #7192A8 url(images/gradients/gradient-grey-down.png) top left repeat-x;
font: 12px verdana;
-webkit-border-bottom-left-radius: 8px;
-moz-border-radius-bottomleft: 8px;
border-bottom-left-radius: 8px;
border-left: 2px solid #a2c1de;
border-right: 0px solid #a2c1de;
border-bottom: 2px solid #a2c1de;
-moz-box-shadow: 0 0 0px #888;
-webkit-box-shadow: 0 0 0px#888;
box-shadow: 0 0 0px #888;
}

#fb_icon {
margin-right: 11px !important;
margin-top: -17px !important;
margin-bottom: 2px !important;
z-index: 10000 !important;
}


.fbpp-link {
background-color: #3b5998 !important;
outline: none; color: #FFF !important; 
text-decoration: none !important; 
text-align: center !important;
}

.fbpp-link:hover {
background-color: #627aad !important;
}

.fbpp-link:active {
background-color: #2a4280 !important;
}

---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------

If you have facebook integration disabled.

Part 1

Replace the following in header template

<vb:if condition="$vboptions['enablefacebookconnect']">
<vb:if condition="$show['facebookuser']">
<a id="fb_link" href="http://www.facebook.com/profile.php?id={vb:raw bbuserinfo.fbuserid}" target="_blank" style="outline: none;"><img id="fb_squarepic" width="70" height="70" style="border: 2px solid #a2c1de; margin-right: 10px; outline: none; margin-bottom: 0px; background-color: #FFF;" alt="{vb:raw bbuserinfo.fbname}" src="https://graph.facebook.com/{vb:raw bbuserinfo.fbuserid}/picture?type=square" /><img id="fb_icon" width="14" height="14" alt="Facebook Connected: {vb:raw bbuserinfo.fbname}" src="{vb:stylevar imgdir_misc}/facebook.gif" /></a>
<vb:else />
{vb:raw header_avatar}
</vb:if>
</vb:if>

With...

{vb:raw header_avatar}

Part 2

Find & Remove the following in header template

<vb:if condition="$vboptions['enablefacebookconnect']">
<vb:if condition="$show['facebookuser']">
<vb:else />
<li><a id="fb_loginbtn" href="#" class="fbpp-link">Login with Facebook</li>
</vb:if>
</vb:if>

[Hikarin]

Originally Posted by UDieckmann

I like this mod. But the users not connected to facebook must have an avator picture which is equal on height and width. Is it possible to have the box stretched to the real size of the avatar image?

Thank you!

Ulli

I second this. I think it's necessary for a perfect mod.

Also, my problem on the post above is yet to be answered. Has anyone had the same thing? =x

[Bulent Tekcan]

And also I need PM count on main screen

[AshenTemper]

Originally Posted by Hikarin

Okay, I finally gave in and installed the mod on the custom skin I'm making. Some things definitely need to be done though which I will list further down. But I experienced one problem.... The "settings" section won't show up although I did everything right. See here.

Can someone help me please?


Now, what I believe will benefit this mod is....

1. The dropdown box needs to look the same as the others found throughout the forum, otherwise it just seems a little off....
2. Many people use rectangular avatars rather than square ones. There needs to be something implemented so that the image doesn't get squished down to size.
3. I have done it myself thanks to the code Gemma provided, but in future versions, the mod needs to show the same background colour as the rest of the box, not the colour of the forum's background itself.
4. A number on the sidee indicating the number of notifications the user has waiting for them would be great.
5. The gap between the lines on this is too far apart that it makes it look like something's missing. It needs to be closer together like what I've photoshoped below.


This is only helpful points, so please don't take this as me being bossy or demanding because I only really want to see this mod work. ^_^ Good luck!

Was running into the same error and figured it out. It's a small change.

Look for:

<li><a href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase control_panel}</a></li>

And change it to:

<li><a href="usercp.php{vb:raw session.sessionurl_q}">{vb:rawphrase user_control_panel}</a></li>

Voila!

[ViciousCode]

sorry for the lack of updates everyone, havent used vbulletin in a long time.

i will update the code for the latest version.

[Cobro]

is anyone having problem with vbulletin version 4.2.0 patch 2 ? i am having problems

[Annonaria]

Splendid Mod and works well on vb4.2 pl2

I just wanted to make some changes:
1. I did as below, except that I got this result (see attach).
I wish the writing is white without the mouseover, but I did not find the string to change the color and remove the mouseover (since I am not a programmer, I would not do damage)

Originally Posted by Gemma

You can do either of two things.

Find

<a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}" style="background-color: #2f4456; outline: none;">{vb:raw bbuserinfo.username}</a>

You can replace the #2f4456 with what ever colour you want or you can remove the background colour altogether by replacing the above code with this

<a class="popupctrl" href="usercp.php{vb:raw session.sessionurl_q}">{vb:raw bbuserinfo.username}</a>

2. I wanted to remove "Post Count" and "Last Visit" (to put it up in the dropdown menu)

3. I wanted to change color (background) and even the style of the dropdown menu.

4. How can I put other links in the dropdown menu.

5. Thanks.

[Annonaria]

Originally Posted by Annonaria

Splendid Mod and works well on vb4.2 pl2

I just wanted to make some changes:
1. I did as below, except that I got this result (see attach).
I wish the writing is white without the mouseover, but I did not find the string to change the color and remove the mouseover (since I am not a programmer, I would not do damage)

Done.

Originally Posted by Annonaria

2. I wanted to remove "Post Count" and "Last Visit" (to put it up in the dropdown menu)

Done.

Originally Posted by Annonaria

3. I wanted to change color (background) and even the style of the dropdown menu.

Done.

Originally Posted by Annonaria

4. How can I put other links in the dropdown menu.

I'd like to get some help.

Originally Posted by Annonaria

5. Thanks.

6. What is part of code to move within a fixed topbar?

[lamur]

So how can I get "Private Messages #" displayed?

[Replicators]

This is a good mod, in fact i chose this over the vBSocial Notifications, and i think this small addon could be made to be much better than it is. I think last activity display in it is pointless myself, but i think it should be replaced with flashing icons of notifications instead.

[Replicators]

Would someone here willing to get Header Rework 4 to work with vBSocial Notifications? As much as i messed with them trying to put them underneath posts replacing last activity, it won't work right because there is a conflict i am supposing. THis mod would work great with vbsocial notifications if they could work together.