Nick oder Name anpassen, bunt und mit Icon, wie geht das?

Unterstützung
1

Ich sehe viele Foren, die auf Discourse basieren, dass man den Nick/Namen von Benutzern mit farbigen und stilisierten Schriftarten und Symbolen anpassen kann, wie macht man das?

image
image
image
image
image
image
image

1 „Gefällt mir“
2

Sind das Staff-Konten? Wenn ja, können Sie diese mit CSS anpassen. Bitte überprüfen Sie: Make staff users more recognizable with customized avatars, posts, and mentions

Sie können etwas Ähnliches tun, basierend auf der Gruppe, zu der sie gehören. Überprüfen Sie: Changing username colors

Ich glaube nicht, dass der Benutzername pro Benutzer angepasst werden kann, es sei denn, ein Administrator tut dies manuell mit CSS. Oder mit einem benutzerdefinierten Plugin, das diese Funktion einführt.

4 „Gefällt mir“
3

So etwas sollte funktionieren, es sei denn, das Profil eines Benutzers ist privat:

span.username a[data-user-card="cocococosti"]{
border: solid green 3px;
}

So sieht dieser Code hier auf Meta mit Ihrem Benutzernamen @cocococosti aus

image

EDIT: Habe Ihren Beitrag falsch gelesen, aber es ist immer noch ein einfach genug Beispiel für diejenigen, die nicht wissen, wie es geht. :slight_smile:

3 „Gefällt mir“
4

Können Sie bitte einen Link zu diesem Forum einfügen?

2 „Gefällt mir“
5

Ich schätze, das ist es

3 „Gefällt mir“
6

Anscheinend verwenden sie Farben in Benutzernamen, je nach Gruppe:

// Farbe des Namens nach Gruppe
.names {
  span.Banidos a  {
    text-decoration: line-through!important;
  }
  span.BigBrotherBrasil a {
    color: #5074f2!important;
  }
  span.Celebs a {
    color: #94dbea!important;
  }
  span.Variedades a {
    color: #ffa500!important;
  }
  span.Musica a {
    color: #e13d14!important;
  }
  span.Cinema-TV a {
    color: #59c35b!important;
  }
  span.Noticiario a {
    color: #74429b!important;
  }
  span.Geek a {
    color: #12A89D!important;
  }
  span.Gifs a {
    color: #f67fb4!important;
  }
  span.Adulto a {
    color: #ff1010!important;
  }
  span.VIP-Gold a {
    background: linear-gradient(to right,#BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  span.VIP-Gold a::after {
    content:"★";
    margin-left: 2px;
  }
  span.VIP-Rose a {
    background: linear-gradient(to left,#D7828D, #EFD1D5, #F6DFE1, #EBBEC4, #D998A3);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  span.VIP-Diamond a {
    background: linear-gradient(to right,#2C5481, #BCD3E7, #3F679A, #84AFE2, #5F89B6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  span.VIP-Pearl a {
    background: linear-gradient(to right,#848B98, #C7C9CB, #D7D7D8, #AEB2B8, #959BA3);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  span.VIP-Amethyst a {
    background: linear-gradient(to right,#9063CD, #7C56B3);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  span.VIP-Ruby a {
    color: crimson!important;
  }
  span.VIP-Ruby a::after {
    //content:"🔥";
    //margin-left: 2px;
  }
  span.VIP-Emerald a {
    background: linear-gradient(to right,#00A881, #34AC90);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  span.VIP-Sapphire a {
    background: linear-gradient(to right,#2468d2, #0d49a7);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}
4 „Gefällt mir“
7

@danielabc Ich habe den CSS-Code bereits in meinem Forum ausprobiert und er funktioniert. :heart:

Ich kann mir vorstellen, dass du der Moderator des Forums bist, probiere es mit dir selbst aus, bevor du die Gruppen bildest.

// Farbe des Namens nach Gruppe
.names {
span.moderator a {
    background: linear-gradient(to right,#BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  span.moderator a::after {
    content:"★";
    margin-left: 2px;
  }
}
5 „Gefällt mir“
8