Hello, Jetto Community!
We will share with you the Woltlab css user ratings we use in our own forum.
Designing User Ratings with Woltlab CSS
Let's log in to the Woltlab admin panel, then press the 'Customization - Global CSS and SCSS' button. Paste the CSS codes I will send you into the relevant field and save.
Code
/* Kullanıcı rank sistemi - Jetto.NET */
.administratorranks {
color: #fff;
background: linear-gradient(to right, #7c3302, #d10808);
font-size: 12px;
border: none;
border-radius: 6px;
font-family: 'Poppins', sans-serif;
font-weight: 600;
padding: 4px 10px;
transition: 0.4s;
text-transform: uppercase;
&:before {
padding: 2px 4px 2px 4px;
font-family: "Font Awesome 6 Free";
content: "\f3ed";
}
}
/* Kullanıcı rank sistemi */
Display More
If you want to change the Font Awesome icon at the beginning of the authorization, you can use it by finding the codes from Login or Register to see the download link. and changing the '\f3ed' code in the content.
Afterwards, let's log in to the 'Users - User Ratings' section from the admin panel. Let's press the administrator authorization, save it by defining 'administratorranks' css as you see in the image.