vb.org Archive - Private Messages Enhancements - WCF - New Way To Display Notifications v2 (CSS)

vb.org Archive (https://vborg.vbsupport.ru/index.php)

- vBulletin 4.x Template Modifications (https://vborg.vbsupport.ru/forumdisplay.php?f=246)

- - Private Messages Enhancements - WCF - New Way To Display Notifications v2 (CSS) (https://vborg.vbsupport.ru/showthread.php?t=263648)

LifesGreatestGift

05-13-2011 10:00 PM

WCF - New Way To Display Notifications v2 (CSS)

1 Attachment(s)

https://vborg.vbsupport.ru/external/2011/05/31.png

1) Upload included files
2) Open template header

Find

Code:

<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

Code:

                                <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

Code:

<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

Code:

.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

05-14-2011 09:22 PM

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

LifesGreatestGift

05-14-2011 09:26 PM

Thanks. Also no javascript ;)

Juggernaut

05-14-2011 09:42 PM

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

MagicThemeParks

05-14-2011 09:53 PM

Looks very nice! :up:

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

Dr.osamA

05-14-2011 10:02 PM

thank you man

rated 5 stars Excellent

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

Code:

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

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

Code:

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

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

Code:

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

thanx

tafreeh

05-14-2011 11:42 PM

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

BCP Hung

05-15-2011 01:00 AM

Good job man ! Installed/Taged/Monimation !

LifesGreatestGift

05-15-2011 01:12 AM

Quote:

Originally Posted by tafreeh (Post 2195822)

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

05-15-2011 04:40 AM

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!

cosmicsea

05-16-2011 12:24 AM

Any plans to use ajax to show the notifications without refreshing? That would be sweet! Even without ajax it looks like it would be very nice but one problem I would have with it is I think there should be a way to close it otherwise it could just annoy some people who don't feel like reading a message or whatever. I assume there has to be a way to add a little javascript to it to maybe add an "x" button to close the div.

LifesGreatestGift

05-16-2011 05:26 AM

I was trying to keep it as no JS, but i could use some jQuery and cookies to allow it to be closed. Will work on it over the next few days.

Lestat_

05-17-2011 05:20 PM

awesome improvement ! thanks mate

billstelling

05-19-2011 03:20 PM

Could i get you to do the transparency for a dark site. Basically the opposite.. Or better yet, maybe even do a pack with multiple colors to choose from for the transparency. blue would look good on my site. Also point out were to change text color for those who can't figure it out..
yes i can do it all myself, just though it would be a good add to your mod.. I really like it too, good job! 5 stars..

doobiefillin

05-19-2011 07:00 PM

installed great job!

CK	06-18-2011 12:07 AM

I have the other mod installed by TW7 but this looks cool too. Tagged.

just.b.jealous

06-21-2011 05:40 AM

This is a great mod, how can I get all other notifications to show up as well, like new visitor messages, new achievements, new mentions, new incoming friend requests, etc?

EDIT: Nevermind, lol, it's already there

Twikitero

06-23-2011 12:28 PM

Hello, here I leave a small change which makes the edges to Rodondo.
I think this looks a little nicer.

Image demo

http://img26.imageshack.us/img26/2518/demos.png

1) Open template additional.css and add the following

Code:

.wcf_notifications {

    background:url("images/wcf/50opacity.png") repeat 0 0 transparent;

     margin: 0 auto 15px auto;

        padding: 0px;

        border: 1px solid #d7d7d7;



        -moz-border-radius: 11px;

        -webkit-border-radius: 11px;

        border-radius: 11px;

        behavior: url(border-radius.htc); 

    bottom: 80px;

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

}

Regards

rasp187

06-24-2011 05:17 AM

Nice mod. Thanks.

fluidswork

06-27-2011 03:24 AM

Great job .............

LifesGreatestGift

06-29-2011 12:26 AM

replace

Code:

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

}

with

Code:

.wcf_notifications {

    background-color:rgba(0, 0, 0, 0.5);

    bottom: 20px;

    left: 20px;

    padding: 10px 15px;

    position: fixed;

    z-index: 10;

     -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    -khtml-border-radius: 5px;

    border-radius: 5px;

}

8thos

07-06-2011 09:57 PM

Quote:

Originally Posted by TheWindows7Site (Post 2214322)

replace

Code:

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

}

with

Code:

.wcf_notifications {

    background-color:rgba(0, 0, 0, 0.5);

    bottom: 20px;

    left: 20px;

    padding: 10px 15px;

    position: fixed;

    z-index: 10;

     -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    -khtml-border-radius: 5px;

    border-radius: 5px;

}

This is awesome! Thank you!

About how long do you have left on figuring out how to make this AJAX (Real-Time)? I would pay for that.

freekill0113

07-06-2011 11:46 PM

thanks you very much :X

Krusty1231

07-19-2011 09:19 AM

Thanks. Working great!

Donavaz

07-19-2011 01:32 PM

if u can place a screenshot of it

Wenbie

07-20-2011 02:52 PM

Installed. I've used this mod for a day and already I have received complaints from members asking how to dismiss the notification because many of them have unread PMs or VMs that they don't intend to read, at least not immediately anyway.

It looks very elegant, but please consider making it dismissible (or even moveable), thank you!

8thos

07-20-2011 10:08 PM

Quote:

Originally Posted by Wenbie (Post 2222884)

https://vborg.vbsupport.ru/showthread.php?t=266914

Sayrex

07-30-2011 12:10 PM

I Like it :D

Scanu

09-03-2011 05:02 PM

This is awesome the first version do not work for me this is very great thank you :)

Quest2be1

09-28-2011 02:15 PM

I love this little template update. However, I am an admin on a website and I have user verification setup to moderate new users. I, along with the rest of my staff use to receive a notification for "users awaiting moderation" prior to the template adjustment. Do any of you know how I can get this notification to show up with the rest of them?

Scanu

10-12-2011 09:55 AM

If i'm right you mean this: https://vborg.vbsupport.ru/showthread.php?t=270190
The style is not the same but i've request the permission to TW7S for use this style on my mod and soon this style will be integrated (sorry for my english)

Trevor Matthews

10-12-2011 07:52 PM

Any chance that this would work with 4.1.7?

Front Range 4x4

06-24-2012 07:07 PM

Love it!

Installed, rated *****, nominated.

Proof that it's the little things that are often the very best!

Thank you!

Black Snow

09-04-2012 12:34 PM

Anyone got this working on 4.2.0 yet?

Black Snow

09-08-2012 03:00 PM

Nobody has this set up for 4.2.0?

Is there another mod which supports 4.2.0.

NoMatt3r

06-06-2013 04:20 PM

Works with 4.2.1

Just as great as your last one :)

fxdigi-cash

07-07-2014 08:00 PM

I like this mod, but too much coding... simple and efficient is always best!!

Thanks for the mod anyways!! :)

tbworld

07-07-2014 08:41 PM

Quote:

Originally Posted by fxdigi-cash (Post 2505773)

I like this mod, but too much coding... simple and efficient is always best!!

Thanks for the mod anyways!! :)

What, in your opinion, is not efficient about the hack?

:)

twistedsoul

05-25-2016 01:56 AM

thanks

All times are GMT. The time now is 04:59 PM.

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01565 seconds Memory Usage 1,825KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (12)bbcode_code_printable (4)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)post_thanks_navbar_search (1)printthread (39)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: