Custom messages in posts based on number of likes

---------------------------------




Bronze Message: Appears when a post receives between 3 and 7 likes.


Silver Message: Appears when a post receives between 8 and 15 likes.


Gold Message: When a member’s post receives between 16 and 70 likes, the message changes to the Gold Message. The Gold Message represents the highest level of appreciation,

---------------------------------------------------------------------------------

CSS Code

Admin Panel    Display Colors & CSS , CSS Stylesheet and paste the following code.

Code:

.like-Bronze {border-right: solid 5px #a34521 !important;padding: 5px;background: #cfc5c2c7;overflow: hidden;margin-top: 33px;margin-left: 7px; margin-right: 7px;}
.like1-Bronze {position: relative;top: 7px;float: right;}
.like2-Bronze {position: relative;top: 7px;float: left;}
.like3-Bronze {width: fit-content;font-size: 32px;line-height: 1;text-align: center;color: #903915;text-shadow: 3px 3px 0 #fff;}
.like-Silver {border-right: solid 5px #bababa !important;padding: 5px;background: #dfdfdf;overflow: hidden;margin-top: 33px;margin-left: 7px; margin-right: 7px;}
.like1-Silver {position: relative;top: 7px;float: right;}
.like2-Silver {position: relative;top: 7px;float: left;}
.like3-Silver {width: fit-content;font-size: 32px;line-height: 1;text-align: center;color: #817e7e;text-shadow: 3px 3px 0 #fff;}
.like-gold {border-right: solid 5px #dab275 !important;padding: 5px;background: #eed6a1;overflow: hidden;margin-top: 33px;margin-left: 7px; margin-right: 7px;}
.like1-gold {position: relative;top: 7px;float: right;}
.like2-gold {position: relative;top: 7px;float: left;}
.like3-gold {width: fit-content;font-size: 32px;line-height: 1;text-align: center;color: #b17628;text-shadow: 3px 3px 0 #fff;}


You can change the color's your self to make them fit your own forum theme.
Don't forget to save

JavaScript Code

Administration panel Modules HTML & JAVASCRIPT - Javascript codes management
and create a new script with the following settings.
Title : as you wish
Placement : In the topics

Code:

$(document).ready(function() {
    var Likestopt_Likestopt = {
        'phpBB2': '.postbody:first',
        'phpBB3': '.postbody .content:first',
        'PunBB': '.postbody:first',
        'Invision': '.post-entry:first',
        'ModernBB': '.postbody .content:first',
        'AwesomeBB': '.post-content:first'
    };
    var currentServer = 'AwesomeBB';
    var authorSelector = Likestopt_Likestopt[currentServer];

    $(".post").each(function() {
        var currentPost = $(this);
        var repNbText = currentPost.find(".rep-nb:first").text();
        var Likestopt = parseInt(repNbText, 10);
        currentPost.find(".like-Bronze,.like-Silver,.like-gold").remove();      
        var LikesHTML = '';
        
        if (Likestopt >= 16 && Likestopt <= 70) {
            LikesHTML = '<div align="center">' +
                '<div class="like-gold">' +
                '<div class="like1-gold"><img width="50" height="50" src="https://i.servimg.com/u/f20/16/85/77/67/o8888812.png" /></div>' +
                '<div class="like2-gold"><img width="100" height="50" src="https://i.servimg.com/u/f20/16/85/77/67/facebo10.png" /></div>' +
                '<div class="like3-gold">gold Post<br />★★★★★</div>' +
                '</div>' +
                '</div>';
        } else if (Likestopt >= 8 && Likestopt <= 15) {
            LikesHTML = '<div align="center">' +
                '<div class="like-Silver">' +
                '<div class="like1-Silver"><img width="50" height="50" src="https://i.servimg.com/u/f20/16/85/77/67/o8888811.png" /></div>' +
                '<div class="like2-Silver"><img width="100" height="50" src="https://i.servimg.com/u/f20/16/85/77/67/facebo10.png" /></div>' +
                '<div class="like3-Silver">Silver Post<br />★★★</div>' +
                '</div>' +
                '</div>';
        } else if (Likestopt >= 3 && Likestopt <= 7) {
            LikesHTML = '<div align="center">' +
                '<div class="like-Bronze">' +
                '<div class="like1-Bronze"><img width="50" height="50" src="https://i.servimg.com/u/f20/16/85/77/67/o8888810.png" /></div>' +
                '<div class="like2-Bronze"><img width="100" height="50" src="https://i.servimg.com/u/f20/16/85/77/67/facebo10.png" /></div>' +
                '<div class="like3-Bronze">Bronze Post<br />★</div>' +
                '</div>' +
                '</div>';
        }

        if (LikesHTML) {
            currentPost.find(authorSelector).after(LikesHTML);
        }
    });
});

Important!: To make it works you absolutely need to indicate the version of your forum
By modifying the following part of the code

Code: var currentServer = 'AwesomeBB';

Replace

Code: AwesomeBB

with your forum version
---------------------------------------


This customization is a great way to motivate members and encourage them to engage more with the content. Try out this code today and see how it enhances member interaction with your posts!,


hope this system will contribute to improving content quality and inspire everyone to present their best work.

Great as always.

Very nice  @كونان2000

Just a reminder:  You still need to follow the rules and guidelines in this section.  That includes the global ones, too.

Wizzard and TonnyKamper
Thanks to both of you. I’m glad both of you liked it. ^^

SLGray wrote:Just a reminder:  You still need to follow the rules and guidelines in this section.  That includes the global ones, too.

hi SLGray
Could you please clarify what specific rules or guidelines I may have overlooked? I want to ensure that I adhere to all the requirements.

The one that deals with font/text. like size and bold.

SLGray wrote:The one that deals with font/text. like size and bold.

I think the rules here are a bit too strict,
but my post has been edited.