Private Messages Enhancements - WCF - New Way To Display Notifications v2 (CSS)

1) Upload included files
2) Open template header

Find

<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>

Replace with

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

Add the following code to the bottom of the template

<vb:if condition="$notifications_total">
    <div class="wcf_notifications">
        <div class="wcf_notifications_content">
          <p>New Notification(s)</p>
          <p>{vb:raw notifications_menubits}</p>
        </div>
    </div>
</vb:if>

3) Open template additional.css and add the following

.wcf_notifications {
    background:url("images/wcf/50opacity.png") repeat 0 0 transparent;
    border:1px solid #000000;
    bottom: 20px;
    left: 20px;
    padding: 10px 15px;
    position: fixed;
    z-index: 10;
}

.wcf_notifications_content {
    background-color:transparent;
} 

.wcf_notifications_content li a {
    color: #FFFFFF;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
} 

.wcf_notifications_content li a:hover {
    color: #FFFFFF;
    text-shadow: 0 0 5px #FFFFFF;
}

.wcf_notifications_content p {
    color:#FFFFFF;
    text-decoration:underline;
    font-size:12px;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

WindowsCommunityForum.com - Your source for Windows news discussion & support

[Juggernaut]

This looks just as good as the other notification edit you released, but without having to edit the headinclude template.

[LifesGreatestGift]

Thanks. Also no javascript

[Juggernaut]

It looks just as good, in my opinion. Marked as installed and rated 5 stars.

[MagicThemeParks]

Looks very nice! :up:

Wish there was an option for us vB 3.8x folks. Maybe someday

[Dr.osamA]

thank you man

rated 5 stars Excellent

for arabic users:
لترجمة الكود ابحث في الكود التالي

<vb:if condition="$notifications_total">
    <div class="wcf_notifications">
        <div class="wcf_notifications_content">
          <p>New Notification(s)</p>
          <p>{vb:raw notifications_menubits}</p>
        </div>
    </div>
</vb:if>

عن السطر التالي:

<p>New Notification(s)</p>

و استبدله بالتالي

<p>تنبيهـات جديدة</p>

thanx

[tafreeh]

looooks good.
question: Does page need to be reload, in order for notification to display? or is like Facebook ?

[BCP Hung]

Good job man ! Installed/Taged/Monimation !

[LifesGreatestGift]

Originally Posted by tafreeh

looooks good.
question: Does page need to be reload, in order for notification to display? or is like Facebook ?

Its just like the built-in vB notifications. You must reload the page to see it initially, or to see if there are any updates/additions. Also, clicking the link (for PM's) wont clear the notification, you must read the PM first, then go to another page (just like vB)

[Taurus1]

That is awesome. Thank you very much. I really liked the other version, but because of javascript conflict, I could not use it. This works flawlessly, and looks great too!