View Full Version : How to include avatar in header?
smoovie
03-26-2007, 09:31 PM
I'm looking for a way to place user avatars in my header when they log-in. This is the header image.
http://img341.imageshack.us/img341/726/headerimgdu1.png
You can see the spotlight on the icon. I want to remove the icon and just leave the spotlight. Right no problem there. What I can't do is code in it's place the users avatars or the default avatar if its a guest. This would allow me to remove the avatar from the navbar and really personalize the site for my members. I could have this set as the header background and use the avatars over it. That would work also.
If anyone can help me out with this I would appreciate it.
Thanks.
Gabe
smoovie
03-27-2007, 11:24 PM
I guess this should have gone in programing discussion. Sorry about that. But, if anyone has a solution I would love to hear/see it.
paul41598
03-27-2007, 11:45 PM
I would check out this hack:
https://vborg.vbsupport.ru/showthread.php?t=99498&highlight=avatar
and manipulate it a little to your fitting. Should be relatively simple
smoovie
03-28-2007, 01:01 PM
Thanks paul. That was the hack I was using originally. It worked and was easy enough to get in the header I just can't line it up under the spotlight. My knowledge of code is very poor. Right now I have align="left" but if I put in 40 or 40px (just an example) it doesn't move. Any ideas?
paul41598
03-28-2007, 01:14 PM
hard to say without looking at the code, although you could try some css, absolute positioning for example ;)
smoovie
03-28-2007, 01:37 PM
<div id="logo" align="left" valign="top"><a href="profile.php?$session[sessionurl]do=editavatar"><img src="$navbar_ava[0]" alt="Your avatar" border="0" />
If it helps. I'm assuming the CSS would go in Additional CSS section. But I really suck at this *lol*.
Can anyone help me with this alignment problem, please? I can show the rest of the code if needed. I just need to align avatars under the spotlight on that header image. Well heres the code.
header template:
<!-- set below for skin width-->
<table width="753" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" align="left" valign="top">
<div id="brd_outer">
<div id="brd_in">
<!-- begin iSkin header / logo is controlled via #logo in main CSS file -->
<div id="hdr_bdr">
<div id="hdr"><div id="logo"><a href="profile.php?$session[sessionurl]do=editavatar"><img src="$navbar_ava[0]" alt="Your avatar" border="0" /></a></div></div>
<div id="hdr_btm"></div>
</div>
<div id="nav_back">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="107" height="29" align="left" valign="top"><img src="$stylevar[imgdir_misc]/nav_ls.gif" width="107" height="29" alt="" /></td>
<td align="center">
<!-- begin navigation buttons table -->
<table width="339" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="43" height="29"><a href="$vboptions[forumhome].php$session[sessionurl_q]" accesskey="1"><img id="nav_home" src="$stylevar[imgdir_misc]/nav_home.gif" width="43" height="29" border="0" alt="" /></a></td>
<td width="67" height="29"><a href="usercp.php$session[sessionurl_q]"><img id="nav_cp" src="$stylevar[imgdir_misc]/nav_cp.gif" width="67" height="29" border="0" alt="" /></a></td>
<if condition="$show['registerbutton']">
<td width="67" height="29"><a href="register.php$session[sessionurl_q]" rel="nofollow"><img id="nav_reg" src="$stylevar[imgdir_misc]/nav_reg.gif" width="67" height="29" border="0" alt="" /></a></td>
<else />
<td width="53" height="29" id="usercptools"><a href="$show[nojs_link]#usercptools"><img id="nav_menu" src="$stylevar[imgdir_misc]/nav_menu.gif" width="53" height="29" border="0" alt="" /></a><script type="text/javascript"> vbmenu_register("usercptools", 1); </script></td>
</if>
<td width="67" height="29"><a href="memberlist.php$session[sessionurl_q]"><img id="nav_members" src="$stylevar[imgdir_misc]/nav_members.gif" width="67" height="29" border="0" alt="" /></a></td>
<td width="75" height="29"><a href="calendar.php$session[sessionurl_q]"><img id="nav_cal" src="$stylevar[imgdir_misc]/nav_cal.gif" width="75" height="29" border="0" alt="" /></a></td>
<td width="59" height="29" id="navbar_search"><a href="search.php$session[sessionurl_q]" accesskey="4" rel="nofollow"><img id="nav_search" src="$stylevar[imgdir_misc]/nav_search.gif" width="59" height="29" border="0" alt="" /></a><script type="text/javascript"> vbmenu_register("navbar_search", 1); </script></td>
<td width="35" height="29"><a href="faq.php$session[sessionurl_q]" accesskey="5"><img id="nav_faq" src="$stylevar[imgdir_misc]/nav_faq.gif" width="35" height="29" border="0" alt="" /></a></td>
<td width="2" height="29"><img id="nav_rs" src="$stylevar[imgdir_misc]/nav_rs.gif" width="2" height="29" alt="" /></td>
</tr>
</table>
<!-- End navigation buttons table -->
</td>
<td width="92" height="29" align="right" valign="top"><img src="$stylevar[imgdir_misc]/nav_rs_end.gif" width="92" height="29" alt="" /></td>
</tr>
</table>
</div>
<if condition="$show['popups']">
<!-- NAVBAR POPUP MENUS -->
<if condition="$show['searchbuttons']">
<!-- header quick search form -->
<div class="vbmenu_popup" id="navbar_search_menu" style="display:none">
<form action="search.php?do=process" method="post">
<table cellpadding="4" cellspacing="1" border="0">
<tr>
<td class="thead">$vbphrase[search_forums]</td>
</tr>
<tr>
<td class="vbmenu_option" title="nohilite">
<input type="hidden" name="do" value="process" />
<input type="hidden" name="quicksearch" value="1" />
<input type="hidden" name="s" value="$session[sessionhash]" />
<div><input type="text" class="bginput" name="query" size="25" tabindex="1001" /><input type="submit" class="button" value="$vbphrase[go]" tabindex="1004" /></div>
</td>
</tr>
<tr>
<td class="vbmenu_option" title="nohilite">
<label for="rb_nb_sp0"><input type="radio" name="showposts" value="0" id="rb_nb_sp0" tabindex="1002" checked="checked" />$vbphrase[show_threads]</label>
<label for="rb_nb_sp1"><input type="radio" name="showposts" value="1" id="rb_nb_sp1" tabindex="1003" />$vbphrase[show_posts]</label>
</td>
</tr>
<tr>
<td class="vbmenu_option"><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]:</a></td>
</tr>
<tr>
<td class="vbmenu_option"><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]:</a></td>
</tr>
<tr>
<td class="vbmenu_option"><a href="search.php$session[sessionurl_q]" accesskey="4" rel="nofollow">$vbphrase[advanced_search]</a></td>
</tr>
</table>
</form>
</div>
<!-- / header quick search form -->
</if>
<if condition="$show['member']">
<!-- user cp tools menu -->
<div class="vbmenu_popup" id="usercptools_menu" style="display:none">
<table cellpadding="4" cellspacing="1" border="0">
<tr><td class="thead">$vbphrase[quick_links]</td></tr>
<if condition="$vboptions['enablesearches']"><tr><td class="vbmenu_option"><a href="search.php?$session[sessionurl]do=getdaily">$vbphrase[todays_posts]</a></td></tr></if>
<tr><td class="vbmenu_option"><a href="forumdisplay.php?$session[sessionurl]do=markread">$vbphrase[mark_forums_read]</a></td></tr>
<tr><td class="vbmenu_option"><a href="#" onclick="window.open('misc.php?$session[sessionurl]do=buddylist&focus=1','buddylist','statusbar=no,me nubar=no,toolbar=no,scrollbars=yes,resizable=yes,w idth=250,height=300'); return false;">$vbphrase[open_buddy_list]</a></td></tr>
<tr><td class="thead"><a href="usercp.php$session[sessionurl_q]">$vbphrase[user_control_panel]</a></td></tr>
<if condition="$show['siglink']"><tr><td class="vbmenu_option"><a href="profile.php?$session[sessionurl]do=editsignature">$vbphrase[edit_signature]</a></td></tr></if>
<!--<if condition="$show['avatarlink']"><tr><td class="vbmenu_option"><a href="profile.php?$session[sessionurl]do=editavatar">$vbphrase[edit_avatar]</a></td></tr></if>-->
<tr><td class="vbmenu_option"><a href="profile.php?$session[sessionurl]do=editprofile">$vbphrase[edit_profile]</a></td></tr>
<tr><td class="vbmenu_option"><a href="profile.php?$session[sessionurl]do=editoptions">$vbphrase[edit_options]</a></td></tr>
<tr><td class="thead">$vbphrase[miscellaneous]</td></tr>
<if condition="$show['pmstats']"><tr><td class="vbmenu_option"><a href="private.php$session[sessionurl_q]" rel="nofollow">$vbphrase[private_messages]</a></td></tr></if>
<tr><td class="vbmenu_option"><a href="subscription.php$session[sessionurl_q]" rel="nofollow">$vbphrase[subscribed_threads]</a></td></tr>
<tr><td class="vbmenu_option"><a href="member.php?$session[sessionurl]u=$bbuserinfo[userid]">$vbphrase[my_profile]</a></td></tr>
<if condition="$show['wollink']"><tr><td class="vbmenu_option"><a href="online.php$session[sessionurl_q]">$vbphrase[whos_online]</a></td></tr></if>
</table>
</div>
<!-- / user cp tools menu -->
</if>
<!-- / NAVBAR POPUP MENUS -->
<!-- PAGENAV POPUP -->
<div class="vbmenu_popup" id="pagenav_menu" style="display:none">
<table cellpadding="4" cellspacing="1" border="0">
<tr>
<td class="thead" nowrap="nowrap">$vbphrase[go_to_page]</td>
</tr>
<tr>
<td class="vbmenu_option" title="nohilite">
<form action="$vboptions[forumhome].php" method="get" onsubmit="return this.gotopage()" id="pagenav_form">
<input type="text" class="bginput" id="pagenav_itxt" style="font-size:11px" size="4" />
<input type="button" class="button" id="pagenav_ibtn" value="$vbphrase[go]" />
</form>
</td>
</tr>
</table>
</div>
<!-- / PAGENAV POPUP -->
</if>
<!-- content table -->
<table bgcolor="#191919" width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
$spacer_open
$_phpinclude_output
additional CSS:
/* ***** styling for 'big' usernames on postbit etc. ***** */
.bigusername { font-size: 11pt; }
/* ***** small padding on 'thead' elements ***** */
td.thead, div.thead { padding: 4px; }
/* ***** basic styles for multi-page nav elements */
.pagenav a { text-decoration: none; }
.pagenav td { padding: 2px 4px 2px 4px; }
/* ***** define margin and font-size for elements inside panels ***** */
.fieldset { margin-bottom: 6px;
border: 2px solid #000000;
padding: 4px;
}
.fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px;}
/* ***** don't change the following ***** */
form { display: inline; }
label { cursor: default; }
.normal { font-weight: normal; }
.inlineimg { vertical-align: middle; }
/* ***** sets background for header area - No need to change this ***** */
#hdr {
background: #0a0a0b url(J-POP/misc/headerImg.png) ;
width: 100%;
height: 150px;
background-position: center center;
margin: 0;
padding: 0;
}
/* ***** dispalys 1 px border around header area - No need to change this ***** */
#hdr_bdr {
border-left: 1px solid #2a2a2a;
border-right: 1px solid #2a2a2a;
margin: 0;
padding: 0;
}
/* ***** SETS LOGO AREA FOUND IN HEADER AND ALL OF IT'S PROPERTIES ***** */
#logo {
background:
width: 80px;
height: 80px;
align: 300px;
margin: 80;
padding: 30;
}
/* ***** used to create shadow affect for sides ***** */
#brd_in {
border-left: 1px solid #2a2a2a;
border-right: 1px solid #2a2a2a;
}
/* ***** used to create shadow affect for sides ***** */
#brd_outer {
border-left: 4px solid #1a1a1a;
border-right: 4px solid #1a1a1a;
}
/* ***** small blue bar above nav area and below main header ***** */
#hdr_btm {
background: #363536 url(iSkin_Black/misc/mid_hdr_back.gif);
width: 100%;
height: 14px;
margin: 0;
padding: 0;
}
/* ***** used for navigation background ***** */
#nav_back {
background: #111111 url(iSkin_Black/misc/nav_back.gif);
width: 100%;
height: 29px;
}
/* ***** used to 1 px sides for bottom category etc ***** */
.ftr_bdr {
border-left: 1px solid #2a2a2a;
border-right: 1px solid #2a2a2a;
margin: 0;
padding: 0;
}
.info {
padding-left: 3px;
padding-right: 0px;
padding-top: 3px;
padding-bottom: 3px;
background-color: #393939;
border-top: 1px solid #0e0e0e;
border-right: 2px solid #0e0e0e;
border-left: 1px solid #0e0e0e;
border-bottom: 2px solid #0e0e0e;
margin-bottom: 3px;
}
.announce_l {
background: #0f0f0f;
color: #7a7a7a;
border-left: 1px solid #3c3c3c;
border-top: 1px solid #3c3c3c;
}
.announce_r {
background: #1a1a1a;
color: #7a7a7a;
border-left: 1px solid #3c3c3c;
border-top: 1px solid #3c3c3c;
}
.stuck {
background: #1a1a1a;
color: #7a7a7a;
border-left: 1px solid #3c3c3c;
border-top: 1px solid #3c3c3c;
}
.spacer {
padding: 7px 7px 7px 7px;
}
#footer {
background: #121212 url(/iSkin_Black/misc/seats.jpg);
}
^ merged. Anyone?
vBulletin® v3.8.12 by vBS, Copyright ©2000-2025, vBulletin Solutions Inc.