Avatar + Benutzerbanner ändern

BFD_Heinerich

~ Blindfisch ~
Lizenzinhaber
Registriert
14. Mai 2017
Beiträge
186
Punkte
68
XF Version
  1. 1.5.13
PHP-Version
5.5.38
MySQL/MariaDB
5.6.38
Provider/Hoster
ALL-INKL.COM
Mich stört schon seit längerer Zeit eine "Kleinigkeit" ...
Die Beschriftung für das Bild, neben den Beiträgen ist rechtsbündig, die der Beschriftungen für Banner zentriert formatiert.
Ggf. kann ich eine weitere Änderung, in einem Aufwasch erledigen.
Da ich ja wenig bis keine Ahnung habe, brauche ich eure Hilfe (vermutlich bei CSS).

Das will ich machen:
31264000rc.png


Und nu brächte ich ne Info, wie die CSS-Datei heißt und wo die liegt, damit ich den 1. Schritt hinbekomme.

Für andere Benutzergruppenbanner müsste ich, wenn ich das richtig verstanden habe, eigene css-Dateien (??) erstellen. Jedenfalls sehe ich, in den Einstellungen der Benutzergruppen, unter "Erscheinungsbild des Banners", ganz am Ende "Andere, individuellen CSS Klassen-Namen verwenden". Ich nehme an, dass ist ein Verweis, auf eine CSS-"Datei" (oder Beschreibung oder was auch immer).

Sehr, sehr dankbar wäre ich natürlich, wie immer .... ;)
 
Zu allererst ist die CSS-Datei IMMER die EXTRA.css und wird nur in deinem Style verändert. Wie Styles am besten angelegt werden findest ganz unten noch einmal..

1. Wie erwähnt suchst du in das Template EXTRA.css und öffnest diese zum Bearbeiten in deinem Style. Eintragen solltest du diesen Code..
Code:
.messageUserBlock a.username,
.messageUserBlock .userTitle { text-align: center; }

2. Für eigene Benutzerbanner nimmst du auch die EXTRA.css und erstellst deine eigenen CSS-Klassen. Da hatte, glaube ich, @V0RT3X mal was zu geschrieben.

update=1&add=1" method="post" class="bbMediaJustifier" data-xf-init="cookie-consent-form ajax-submit" data-redirect="off" data-media-site-id="vimeo" data-media-key="247697458" >
Um diese Inhalte anzuzeigen, benötigen wir die Zustimmung zum Setzen von Drittanbieter-Cookies.
Für weitere Informationen siehe die Seite Verwendung von Cookies.
<template class="js-embedHtml">template>
 
Aaaaaha!
Dann werde ich mal schauen, ob ich was gebacken bekomme ....

Daaanke, schon mal!
 
Hallo,

ich hatte z.B. meine Banners in der extra.css wie folgt:

/* USER_BANNERS */
Code:
.userBanner.bannerDonator { color: black; font-weight: bold; background-color: #ffd700; border-color: #a67c00; }
.userBanner.bannerDonator.wrapped span { background-color: #a67c00; }

.userBanner.bannerStaff { color: #22229c; font-weight: bold; background-color: #98b5e2; border-color: #cccccc; }
.userBanner.bannerStaff.wrapped span { background-color: #cccccc; }

.userBanner.bannerAdmin { color: black; font-weight: bold; background-color: black; border-color: #010101; }
.userBanner.bannerAdmin.wrapped span { background-color: #010101; }

.userBanner.bannerSuperMod { color: black; font-weight: bold; background-color: blue; border-color: #00F; }
.userBanner.bannerSuperMod.wrapped span { background-color: #00F; }

.userBanner.bannerMod { color: black; background-color: green; font-weight: bold; border-color: #008000; }
.userBanner.bannerMod.wrapped span { background-color: #008000; }

.userBanner.bannerVerstorben { color: black; background-color: white; font-weight: bold; border-color: #000000; }
.userBanner.bannerVerstorben.wrapped span { background-color: #000000; }
Und dann muss man noch in der passenden Benutzergruppe (hier mal der Admin):
Erscheinungsbild des Banners: Andere, individuellen CSS Klassen-Namen verwenden: und im Feld userBanner bannerAdmin eingetragen.
 
Zuletzt bearbeitet von einem Moderator:
Ich noch einmal! :p
Wenn ich das richtig erinnere, dann wäre es doch so, dass, bei einem Umstieg auf XF 2.x nix (Style etc.) übernommen wird.
In dem Fall könnte ich doch einfach versuchen, eines der bestehenden Banner "umzubiegen ....
Bevor wir nach 2.x rüber gehen, wird es noch dauern und dann könnte man ja die eigenen Banner in einer "extra.css" definieren.
Wir brauchen momentan max. 2 Banner. Die anderen werden nicht benutzt.
Da ich mich, in den Innereien von XF (noch) nicht so auskenne, wäre das event eine Lösung, die uns kurzfristig helfen würde.
Wir brauchen eine kleine Lösung ab dem 1. Januar oder kurz danach ....
 
1. Wie erwähnt suchst du in das Template EXTRA.css und öffnest diese zum Bearbeiten in deinem Style. Eintragen solltest du diesen Code..
Momentan sieht unsere extra.css ziemlich leer aus ..... :rolleyes: (wehe es lacht jemand ....
sauer_tr.gif
)

Code:
<xen:include template="runaway_css.css" />

Es gibt dann noch einen weiteren Reiter mit "runaway_css.css", in dem wohl unsere Style-Einstellungen stehen .... (wehe es lacht jemand ....
sauer_tr.gif
)

Ist das richtig, dass im Feld für die extra.css anschließend folgendes stehen müsste:
Code:
<xen:include template="runaway_css.css" />
.messageUserBlock a.username,
.messageUserBlock .userTitle { text-align: center; }
 
Du kannst doch mit Boardmitteln Banner erstellen, sind dann zwar Rechteckig aber es geht...
Meine Banner für 2.0 sehen jetzt so aus
Code:
/* USER_BANNERS */

.userBanner.bannerDonator { color: black; font-weight: bold; background: linear-gradient(0deg, #ffd700, mix(#ffd700, white, 50%)); border-color: #a67c00; }
.userBanner.bannerDonator.wrapped span { background-color: #a67c00; }
.userBanner.bannerStaff { color: #22229c; font-weight: bold; background-color: #98b5e2; border-color: #cccccc; }
.userBanner.bannerStaff.wrapped span { background-color: #cccccc; }
.userBanner.bannerAdmin { color: white; font-weight: bold; background: linear-gradient(0deg, black, mix(black, white, 50%)); border-color: #010101; }
.userBanner.bannerAdmin.wrapped span { background-color: #010101; }
.userBanner.bannerSuperMod { color: white; font-weight: bold; background: linear-gradient(0deg, blue, mix(blue, white, 50%)); border-color: #00F; }
.userBanner.bannerSuperMod.wrapped span { background-color: #00F; }
.userBanner.bannerMod { color: black; background: linear-gradient(0deg, green, mix(green, white, 50%)); font-weight: bold; border-color: #008000; }
.userBanner.bannerMod.wrapped span { background-color: #008000; }
.userBanner.bannerVerstorben { color: black; background-color: white; font-weight: bold; border-color: #000000; }
.userBanner.bannerVerstorben.wrapped span { background-color: #000000; }
Und in den Benutzerrechten stellst Du diese mit z.B. bannerAdmin ein
 
Ich hab jetzt grad aml gesucht und die "user_banner.css" gefunden.
Gehe ich richtig davon aus, dass das die Banner sind, die im ACP zur Auswahl, bei den Usergruppen, zur Verfügung stehen?

Dort finde ich, zu Bannern, z.B. einen Eintrag:

Code:
.userBanner.bannerOrange     { color: black; background-color: orange; border-color: #FFC520; }
.userBanner.bannerOrange.wrapped span { background-color: #FFC520; }

".userBanner.bannerOrange" und ".userBanner.bannerOrange.wrapped span" dürften Namen für die Darstellungsform sein. Welche davon wird eigentlich bevorzugt?

Bei ".userBanner.bannerOrange" vermute ich folgendes:
color: = Schriftfarbe
background-color: = Füllung des Banners
border-color: = Farbe des Randes

Könnte ich also, irgendeinen Banner in folgende Definierung verändern:
.userBanner.bannerBVB { color: black; background-color: #fbdb0c; border-color: black; }

Würde das bereits ausreichen oder müsste ich folgendes beschreiben:
.userBanner.bannerBVB { color: black; background-color: #fbdb0c; border-color: black; }
.userBanner.bannerBVB.wrapped span { background-color: #black; }

Wenn meine Kombinationsgabe hingehauen haben sollte, müsste das Ganze dann (hoffentlich) so aussehen:

31299966np.png
 
ich hatte z.B. meine Banners in der extra.css wie folgt:

Ich schnippsel mir mal ein Beispiel raus!

/* USER_BANNERS */
Code:
.........
.userBanner.bannerMod { color: black; background-color: green; font-weight: bold; border-color: #008000; }
.userBanner.bannerMod.wrapped span { background-color: #008000; }

Was in etwa so aussieht:

31300009sm.png



Und dann muss man noch in der passenden Benutzergruppe (hier mal der Admin):
Erscheinungsbild des Banners: Andere, individuellen CSS Klassen-Namen verwenden: und im Feld userBanner
"bannerMod" eingetragenwerden?

Die Banner-Codes stehen einfach so, ohne irgendwelche Überschriften oder ähnliches, in der "extra.css" rum ....

Sorry für meine "laxe" Ausdrucksweise. Ist immer so, wenn ich konzentriert herumkombiniere. Schließlich ist der Bereich vollkommenes Neuland für mich.
Für "euch" ist sowas ganz "geläufig" ....

- Blindfische - sind eben (noch) anders ..... :rofl:
 
Ich probiere gez einfach mal aus. Kann ja Code-Schnippsel, in der "extra.css" auch wieder löschen .... :dontmention:
 
Funktioniert nicht!!??
Meine "extra.css" sieht jetzt so aus:

Code:
<xen:include template="runaway_css.css" />
.messageUserBlock a.username,
.messageUserBlock .userTitle { text-align: center; }

.userBanner.bannerVorst { color: black; background-color: #fbdb0c; font-weight: bold; border-color: black; }
.userBanner.bannerVorst.wrapped span { background-color: black; }

Ergebniss:

31300133yd.png


Ich warte dann mal auf Rückmeldungen .... :unsure:
 
Hab grad bemerkt, dass ich in der "extra.css" des Boardstyles verändert hatte.
Das hab ich rückgängig gemacht und den Code in die "extra.css" des "default-style" eingefügt. Ergebnis immer noch, wie oben, in der Grafik, angezeigt ....
 
Und dann muss man noch in der passenden Benutzergruppe (hier mal der Admin):
Erscheinungsbild des Banners: Andere, individuellen CSS Klassen-Namen verwenden: und im Feld userBanner bannerAdmin eingetragen.
Hast Du auch das in die Benutzerrechte eingetragen? Ich hatte das weiter oben ja beschrieben.
 
Opps, in deinem Fall 'userBanner bannerVorst'
 
Ich hab jetzt meine "kleine Lösung" hinbekommen.
In dem Style, den wir installiert haben, habe ich einen Eintrag in der "user_banners.css" modifiziert.
Wir brauchen die Banner ohnehin ansonsten nicht.

Sieht jetzt so aus:

31300317ax.png


Ich weiß, ist ein wenig "Pfuscherei" aber wenigstens ist die dokumentiert .... :rofl:

Wenn wir irgendwann updaten, können wir das richtig machen.
Deine Hinweise haben aber trotzdem geholfen! Danke!!! ;)

Edit: Die 2. Benutzergruppe, die wir brauchen, hat auch hingehauen ..... :D
 
Zuletzt bearbeitet:
kleiner tipp: nicht in den originaltemplates rumwerkeln. besser eigene templates/template modifikationen anlegen oder die extra.css/.less, du kannst da auch mit !important arbeiten.
 
nette erklärung aber dann stelle ich mir glatt die frage warum man es nicht machen soll ?

sind die dann hinfällig wenn man nächste update macht oder werkelt man da was kaputt :D
 
Zurück
Oben