Lexi Help
Partner
www.forumieren.com

Avatar-Umrandung mit CSS funktioniert nicht

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach unten

Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von Tierfreund-97 am Mo 19 Dez 2011 - 10:10

Hallöle!

Ich habe in meinem Forum www.mysterious.forumclan.com den Code für die Avatar-Umrandung eingefügt, also diesen hier:

Code:

.postdetails.poster-profile a img {
border: 1px solid #000000 !important
}

Aber die Umradnung wird nicht angezeigt. Liegt es vielleicht daran, dass ich im Template viewtopic_body schon was geändert habe?
Wäre ganz toll, wenn mir jemand weiter helfen könnte!

Liebe Grüße,
Tierfreund-97

Tierfreund-97
Lehrling
Lehrling

Weiblich Beiträge : 166
Hinweis : I LOVE THE SYSTEM
Anmeldedatum : 09.04.11
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von #Frank am Mo 19 Dez 2011 - 10:29

Wo Hast du diesen Code her?



Keine Unaufgeforderten PN senden! Unsere Regeln Passwort vergessen ? Info's zu den Gründerdaten
Mein IPad schreibt die tollsten Wörter... Nicht wundern... Einfach geniessen...!

Meine Geduld wird geladen:

Fortschritt: 67%
Never change a running system on Friday!

#Frank
Admin a.D.
Admin a.D.

Männlich Beiträge : 34545
Hinweis : Admin außer Dienst
Anmeldedatum : 13.08.08
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von Tierfreund-97 am Mo 19 Dez 2011 - 10:31

Als ich mal einen vorgefertigten Style von hitskin.com installiert hatte, war dieser Code dabei.

Wieso?

Tierfreund-97
Lehrling
Lehrling

Weiblich Beiträge : 166
Hinweis : I LOVE THE SYSTEM
Anmeldedatum : 09.04.11
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von #Frank am Mo 19 Dez 2011 - 10:41

So wie ich es sehe, ist das dann aber ein Code gewesen, der für ein phpBB3 Forum geschrieben wurde.
Das was du dort hast ist ein phpBB2 Forum. Hier müsstest du dem Avatar erst einmal eine eigene Class zuweisen, weil der Avatar hier nur eine img Class hat und du das Bild selber nicht so ansprechen kannst.



Keine Unaufgeforderten PN senden! Unsere Regeln Passwort vergessen ? Info's zu den Gründerdaten
Mein IPad schreibt die tollsten Wörter... Nicht wundern... Einfach geniessen...!

Meine Geduld wird geladen:

Fortschritt: 67%
Never change a running system on Friday!

#Frank
Admin a.D.
Admin a.D.

Männlich Beiträge : 34545
Hinweis : Admin außer Dienst
Anmeldedatum : 13.08.08
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von Tierfreund-97 am Mo 19 Dez 2011 - 10:47

Hmm... Okay.

Könntest du mir dann sagen, an welcher Stelle ich diese eigene Class im Template hinschreiben muss? Und wie sie heißen muss?

Tierfreund-97
Lehrling
Lehrling

Weiblich Beiträge : 166
Hinweis : I LOVE THE SYSTEM
Anmeldedatum : 09.04.11
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von #Frank am Mo 19 Dez 2011 - 11:09

Das kann ich gerne tun.
Als erstes müssen wir im Template:
viewtopic_body
eine Änderung vornehmen.
Du öffnest das Template zum bearbeiten und suchst dann diese Stelle:
{postrow.displayed.POSTER_AVATAR}
Normaler weise ist das die Zeile 92.
Das ersetzt du dann mit diesem Tag:
Code:
<span id="user_avatar">{postrow.displayed.POSTER_AVATAR}</span>
Das sendest du dann ab und veröffendlichst es dann.
Nun kannst du das Avatarbild über diese Class: user_avatar im CSS ansprechen.
Dein CSS Eintrag sollte dann so aussehen:
Code:
#user_avatar {
border: 1px solid #000000 !important
}
Nun kannst du dem auch noch weitere Eigenschaften hinzufügen.
Auch kannst du einen Hover Effekt noch definieren in dem du diesen CSS Code noch dazu setzt
Hier mal mit einer anderen Farbe des Randes beim drüberfahren mit der Maus:
Code:
#user_avatar:hover {
border: 1px solid #FF6600 !important
}



Keine Unaufgeforderten PN senden! Unsere Regeln Passwort vergessen ? Info's zu den Gründerdaten
Mein IPad schreibt die tollsten Wörter... Nicht wundern... Einfach geniessen...!

Meine Geduld wird geladen:

Fortschritt: 67%
Never change a running system on Friday!

#Frank
Admin a.D.
Admin a.D.

Männlich Beiträge : 34545
Hinweis : Admin außer Dienst
Anmeldedatum : 13.08.08
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von Tierfreund-97 am Mo 19 Dez 2011 - 11:26

Vielen Dank!

Ich habe alles so gemacht, wie du es sagtest. Doch jetzt sieht es irgendwie komisch aus... Nur der untere Teil des Avatars wird umrandet...

(Beispiel: http://mysterious.forumclan.com/t40-farben-eliminieren )

Tierfreund-97
Lehrling
Lehrling

Weiblich Beiträge : 166
Hinweis : I LOVE THE SYSTEM
Anmeldedatum : 09.04.11
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von #Frank am Mo 19 Dez 2011 - 11:38

Ja, ich habe es gerade gesehen.
Da klappt was nicht, weil du genau in dem Bereich schon eine Änderung hast.
Ich probiere noch was anders.



Keine Unaufgeforderten PN senden! Unsere Regeln Passwort vergessen ? Info's zu den Gründerdaten
Mein IPad schreibt die tollsten Wörter... Nicht wundern... Einfach geniessen...!

Meine Geduld wird geladen:

Fortschritt: 67%
Never change a running system on Friday!

#Frank
Admin a.D.
Admin a.D.

Männlich Beiträge : 34545
Hinweis : Admin außer Dienst
Anmeldedatum : 13.08.08
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von #Frank am Mo 19 Dez 2011 - 11:46

So, versuchen wir es noch mal anders. Die Template Änderung von eben machst du bitten noch mal rückgängig:
Code:
<span id="user_avatar">{postrow.displayed.POSTER_AVATAR}</span>
und ersetzt das bitte durch das hier:
Code:
<span class="postdetails poster-profile">{postrow.displayed.POSTER_AVATAR}<br /></span>
Dann löschst du den CSS Eintrag noch mal und setzt dein CSS Eintrag von oben noch mal ein.
Code:
.postdetails.poster-profile a img {
border: 1px solid #000000 !important
}
Dann schauen wir mal wie es dann aussieht.
Das Problem ist, das du ja diese Änderung aus dem Tuto:
http://hilfe.forumieren.com/t14561-nur-bb2-den-usernamen-und-rang-unter-den-avatar-setzen#84571
ja auch schon drin hast.



Keine Unaufgeforderten PN senden! Unsere Regeln Passwort vergessen ? Info's zu den Gründerdaten
Mein IPad schreibt die tollsten Wörter... Nicht wundern... Einfach geniessen...!

Meine Geduld wird geladen:

Fortschritt: 67%
Never change a running system on Friday!

#Frank
Admin a.D.
Admin a.D.

Männlich Beiträge : 34545
Hinweis : Admin außer Dienst
Anmeldedatum : 13.08.08
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von Tierfreund-97 am Mo 19 Dez 2011 - 12:01

Jetzt ist der Avatar umrandet, allerdings auch der Kontakttext.

Tierfreund-97
Lehrling
Lehrling

Weiblich Beiträge : 166
Hinweis : I LOVE THE SYSTEM
Anmeldedatum : 09.04.11
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von #Frank am Mo 19 Dez 2011 - 12:31

Als Gast sehe ich das nun nicht, weil das nur Greift, wenn man eingeloggt ist.
Kannst du bitte mal das a aus dem CSS Eintrag entfernen?
Also das:
Code:
.postdetails.poster-profile a img
so ändern:
Code:
.postdetails.poster-profile img
Leider habe ich gerade nicht so viel Zeit weil ich gerade einen neuen Rechner Installieren muss. Eventuell meldet sich Zuckerpuppe gleich noch mal dazu.



Keine Unaufgeforderten PN senden! Unsere Regeln Passwort vergessen ? Info's zu den Gründerdaten
Mein IPad schreibt die tollsten Wörter... Nicht wundern... Einfach geniessen...!

Meine Geduld wird geladen:

Fortschritt: 67%
Never change a running system on Friday!

#Frank
Admin a.D.
Admin a.D.

Männlich Beiträge : 34545
Hinweis : Admin außer Dienst
Anmeldedatum : 13.08.08
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von Tierfreund-97 am Mo 19 Dez 2011 - 13:53

Wenn ich das a wegmache, wird sogar eine leere Fläche darunter umrandet.

Tut mir leid, dass ich so viel Zeit in Anspruch nehme. Wink

Ich sehe gerade, dass sich Cyborg112233 im Forum angemeldet hat...

Tierfreund-97
Lehrling
Lehrling

Weiblich Beiträge : 166
Hinweis : I LOVE THE SYSTEM
Anmeldedatum : 09.04.11
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von Cyborg112233 am Mo 19 Dez 2011 - 13:55



Cyborg112233
Kaiser
Kaiser

Männlich Beiträge : 2362
Anmeldedatum : 08.10.10

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von Cyborg112233 am Mo 19 Dez 2011 - 14:34

Hallo,

Setz mal im Template das hier ein:
Code:
<span class="postdetails poster-profile_avatar">{postrow.displayed.POSTER_AVATAR}<br /></span>
Und im CSS dann das:
Code:
.postdetails.poster-profile_avatar a img
Dann sollte es klappen, meint Frank Wink

LG, Cyborg

Cyborg112233
Kaiser
Kaiser

Männlich Beiträge : 2362
Anmeldedatum : 08.10.10

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von Tierfreund-97 am Mo 19 Dez 2011 - 15:10

Ah, na endlich! Es funktioniert!

Vielen, vielen Dank euch zwei! Very Happy

Tierfreund-97
Lehrling
Lehrling

Weiblich Beiträge : 166
Hinweis : I LOVE THE SYSTEM
Anmeldedatum : 09.04.11
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von #Frank am Mo 19 Dez 2011 - 15:41

Na das freut mich, das es nun klappt, aber ein Wermutstropfen gibt es noch:
Wenn du ausgeloogt bist ist das nicht mehr zu sehen Wink

Edit:
Ich würde dir diesen Eintrag empfelen:
Code:
.postdetails.poster-profile_avatar img {
    border: 6px inset #ff6600 !important;
}
Ich habe da mal eine andere Rahmenfarbe und auch ein anderen Rahmenstyle eingesetzt.
Und wenn du es so einsetzt, dann sehen den Rahmen auch die Gäste.



Keine Unaufgeforderten PN senden! Unsere Regeln Passwort vergessen ? Info's zu den Gründerdaten
Mein IPad schreibt die tollsten Wörter... Nicht wundern... Einfach geniessen...!

Meine Geduld wird geladen:

Fortschritt: 67%
Never change a running system on Friday!

#Frank
Admin a.D.
Admin a.D.

Männlich Beiträge : 34545
Hinweis : Admin außer Dienst
Anmeldedatum : 13.08.08
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von Tierfreund-97 am Mo 19 Dez 2011 - 15:53

Der "inset"-Rahmen ist ziemlich hübsch! Vielleicht benutze ich ihn ja Wink

Das die Gäste den "solid"-Rahmen nicht sehen können, stört mich nicht. ^^

Nochmals vielen dank Very Happy

Tierfreund-97
Lehrling
Lehrling

Weiblich Beiträge : 166
Hinweis : I LOVE THE SYSTEM
Anmeldedatum : 09.04.11
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Re: Avatar-Umrandung mit CSS funktioniert nicht

Beitrag von #Frank am Mo 19 Dez 2011 - 16:06

Du brauchst nur hier das "a" wegzulassen, dann klappt das auch für Gäste:
.postdetails.poster-profile_avatar a img



Keine Unaufgeforderten PN senden! Unsere Regeln Passwort vergessen ? Info's zu den Gründerdaten
Mein IPad schreibt die tollsten Wörter... Nicht wundern... Einfach geniessen...!

Meine Geduld wird geladen:

Fortschritt: 67%
Never change a running system on Friday!

#Frank
Admin a.D.
Admin a.D.

Männlich Beiträge : 34545
Hinweis : Admin außer Dienst
Anmeldedatum : 13.08.08
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach oben


 
Befugnisse in diesem Forum
Sie können in diesem Forum nicht antworten