The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Add time of the notification directly in the toolbar

4 posters

Go down

Add time of the notification directly in the toolbar Empty Add time of the notification directly in the toolbar

Post by Niko January 28th 2023, 1:00 pm

Hello everyone,

I'm going to share just a super simple resource I just posted on my forum, but I think that it may be useful to some of you. luv
This tutorial allows you to display the time of the notification directly from the notifications box in the toolbar

Demo
Before
After
Add time of the notification directly in the toolbar Screen62
Add time of the notification directly in the toolbar Screen63

CSS
In order to design the style of the resource, you need to go towards Administration Control Panel (ACP) Display CSS & Colors CSS Style Sheet and add append the following code:

Code:
#fa_toolbar #fa_right #notif_list li .contentText {
    height: -webkit-fill-available;
}
span.notification_time {
    display: flex;
    padding-top: 3px!important;
    color: gray;
    float: right;
}

Customize CSS
CSS can be fully customized according to the style of the forum.
You can remove the attribute
Code:
float: right;
if you want to keep the timing directly under the notification content.

Javascript & jQuery
For the next step you need to go towards Administration Control Panel (ACP) Modules HTML & Javascript Javascript codes management and create a new code - upon verifying that Javascript codes management is enabled.

  • Title: free choice - does not influence the code effect
  • Where: All pages
  • Code:

    Code:
    $(function() {
     $(function() {
    /*
    Title: Add time of the notification directly in the toolbar
    Author: Niko
    Version: 1.1
    Release Date: 28.01.2023 (dd.mm.year)
    Contact: https://www.fmcodes.net/u2
    Original content: https://www.fmcodes.net/t1989-
    */
     
      $("#fa_notifications").one("click", function(event){
        $.ajax({
            url: '/notification.php',
            datatype: 'html',
            success: function (data) {
                var arr = Object.keys(data).map(function (key) { return data[key]; });
             
                var count = 0;
                $('ul#notif_list li').each(function() {
                    var time = arr[0][count]['time'];
                    $(this).find('.contentText').append('<span class="notification_time">'+time+'</span>');
                    count++;
                });
            }
        });
        });});});


Hope you enjoy it! :wouhou: :wouhou:


Last edited by Niko on January 28th 2023, 4:40 pm; edited 1 time in total
Niko
Niko
Helper
Helper

Male Posts : 3107
Reputation : 244
Language : English, Italian, French
Location : Italy

https://www.fmcodes.net/

The Godfather, Ape, SLGray, BlackScorpion, Niko, SarkZKalie, TonnyKamper and like this post

Back to top Go down

Add time of the notification directly in the toolbar Empty Re: Add time of the notification directly in the toolbar

Post by Ape January 28th 2023, 1:49 pm

Nice little add on Wink thank you for sharing with us all Smile


Add time of the notification directly in the toolbar Left1212Add time of the notification directly in the toolbar Center11Add time of the notification directly in the toolbar Right112
Add time of the notification directly in the toolbar Ape_b110
Add time of the notification directly in the toolbar Ape1010
Ape
Ape
Administrator
Administrator

Male Posts : 19116
Reputation : 1993
Language : fluent in dork / mumbojumbo & English haha

http://chatworld.forumotion.co.uk/

Niko likes this post

Back to top Go down

Add time of the notification directly in the toolbar Empty Re: Add time of the notification directly in the toolbar

Post by Obscure January 28th 2023, 2:05 pm

Awesome! Thank you for the tutorial!
Obscure
Obscure
Forumember

Female Posts : 46
Reputation : 10
Language : English
Location : USA

http://imgtest.forumotion.com/

Niko likes this post

Back to top Go down

Add time of the notification directly in the toolbar Empty Re: Add time of the notification directly in the toolbar

Post by Niko January 28th 2023, 2:11 pm

You are welcome thumright
very simple... but I think some users may find it useful :rose:
Niko
Niko
Helper
Helper

Male Posts : 3107
Reputation : 244
Language : English, Italian, French
Location : Italy

https://www.fmcodes.net/

Ape, BlackScorpion, Niko, TonnyKamper and Obscure like this post

Back to top Go down

Add time of the notification directly in the toolbar Empty Re: Add time of the notification directly in the toolbar

Post by Obscure January 28th 2023, 3:33 pm

Hello
I tested this on my testing forum and it does work, and it looks awesome, but it also shows it about 2 to 3 times. I was going to try to see if I could fix it but couldn't figure it out.
Here is a screenshot
Add time of the notification directly in the toolbar Screen50
Obscure
Obscure
Forumember

Female Posts : 46
Reputation : 10
Language : English
Location : USA

http://imgtest.forumotion.com/

Niko likes this post

Back to top Go down

Add time of the notification directly in the toolbar Empty Re: Add time of the notification directly in the toolbar

Post by Niko January 28th 2023, 4:40 pm

@Obscure my bad, script has been updated Wink
Niko
Niko
Helper
Helper

Male Posts : 3107
Reputation : 244
Language : English, Italian, French
Location : Italy

https://www.fmcodes.net/

Niko, Obscure and كونان2000 like this post

Back to top Go down

Add time of the notification directly in the toolbar Empty Re: Add time of the notification directly in the toolbar

Post by Obscure January 28th 2023, 4:54 pm

Thank you! I will try it again. Very Happy

Edit: Works fine now. cheers
Obscure
Obscure
Forumember

Female Posts : 46
Reputation : 10
Language : English
Location : USA

http://imgtest.forumotion.com/

Niko likes this post

Back to top Go down

Add time of the notification directly in the toolbar Empty Re: Add time of the notification directly in the toolbar

Post by TonnyKamper January 28th 2023, 6:59 pm

Awesome it works perfect in Invision too  thumright
TonnyKamper
TonnyKamper
Active Poster

Female Posts : 1048
Reputation : 78
Language : Dutch/English
Location : DSF Admin

http://www.nederlandheelt.nl/forum

Niko likes this post

Back to top Go down

Add time of the notification directly in the toolbar Empty Re: Add time of the notification directly in the toolbar

Post by Niko January 28th 2023, 7:16 pm

Thanks @Obscure and @TonnyKamper for the feedbacks! ùù loove
Niko
Niko
Helper
Helper

Male Posts : 3107
Reputation : 244
Language : English, Italian, French
Location : Italy

https://www.fmcodes.net/

Niko and TonnyKamper like this post

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum