Help - Integrating alerts

[Brant]

Hey all.

Just wondering if someone would be able to help me incorporate alerts some how into my theme. All I want is a statement that changes the font color of the 'Profile' tab. And, then the font color of the of whats been alerted. I'm terrible with that kind of coding, my knowledge goes as far as html and css.

Like this:


This is the html

<div align=center>
<ul id="navigation" class="nav-main">
    <li class="list"><a href="#">Home</a>
    <ul class="nav-sub">
        <li><a href="http://ragebarrelgaming.net/">Front Page</a></li>
        <li><a href="http://ragebarrelgaming.net/community/">Forum index</a></li>
    </ul>
    </li>
<xen:if is="{$visitor.user_id}">
    <li class="list"><a href="#">Members</a>
    <ul class="nav-sub">
        <li><a href="{xen:link members}">{xen:phrase registered_members}</a></li>
        <li><a href="{xen:link online}">{xen:phrase current_visitors}</a></li>
                <li><a href="{xen:link recent-activity}">{xen:phrase recent_activity}</a></li>
    </ul>
    </li>
<li class="list"><a href="{xen:link members, $visitor}">Profile</a>
    <ul class="nav-sub">
    <li><a href="http://ragebarrelgaming.net/community/index.php?account/personal-details">Edit</a></li>
    <li><a href="http://ragebarrelgaming.net/community/index.php?account/alerts">Alerts</a></li>
    <li><a href="http://ragebarrelgaming.net/community/index.php?conversations/">Mail</a></li>
    <li><a href="XEN SYNTAX??">Logout</a></li>
    </ul>
    </li>
</ul>
</xen:if>
</div>

And the CSS:

#navigation {
    margin:0;
    padding: 0;
    clear:both;
    width:950px;
    height:51px;
    background: #d6eaf8 url(images/dropdown-bg.jpg) repeat-x left top;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
}

ul.nav-main,
ul.nav-main li {
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.nav-main {
    position: relative;
    z-index: 597;
}

ul.nav-main li:hover > ul {
    visibility: visible;
}

ul.nav-main li.hover,
ul.nav-main li:hover {
    position: relative;
    z-index: 599;
    cursor: pointer;
    background: url(images/dropdown-bg-hover.jpg) repeat-x left top;
        border-top-left-radius: 10px;
}

ul.nav-main li {
    float:left;
    display:block;
    height: 51px;
    color: #ffdf81;
    font: 12px Trebuchet MS;
}

ul.nav-main li a {
    display:block;
    padding: 16px 16px 0 16px;
    height: 35px;
    color: #ffdf81;
    font: 12px Trebuchet MS;
    text-decoration:none;
}

ul.nav-main li a:hover {
    color:#fff881;
        text-decoration:none;
}

ul.nav-main *.list {
    padding-right: 22px;
    background: url(images/navigation-arrow.gif) no-repeat right top;
}

ul.nav-sub {
    visibility: hidden;
    position: absolute;
    padding:0px;
    top: 48px;
    left: 0;
    z-index: 598;
    background: #353535 url(images/dropdown-list-bg.jpg) repeat-x left top;

}

ul.nav-sub li {
    list-style:none;
    display:block;
    padding: 0;
    height: 27px;
    float: none;
    width:145px;
    background: none;
}

ul.nav-sub li a {
    list-style:none;
    display:block;
    padding: 6px 5px 6px 5px;
    height: 15px;
    float: none;
    width:145px;
    background: none;
    font: 12px Trebuchet MS;
}

If theres an easier way to incorporate it, let me know. Thanks!

Oh ya, what is the Logout Xen syntax? thanks

ragebarrelgaming.net

 

[Jake Bunce]

This is the relevant code from the default navigation_visitor_tab template:

			<xen:if is="{$visitor.alerts_unread}">
				<strong class="itemCount" id="AlertsMenu_Counter">{xen:number $visitor.alerts_unread}
					<span class="arrow"></span>
				</strong>
			</xen:if>

You can use the same xen:if condition to specify custom markup if there are unread alerts.

Here is the logout code from the default navigation_visitor_tab template:

	<li class="navTab PopupClosed"><a href="{xen:link logout, '', '_xfToken={$visitor.csrf_token_page}'}" class="LogOut navLink visitorTabItem">{xen:phrase log_out}</a></li>