Wie kann ich Farben durch IMG-Grafiken ersetzen?

[Knowhow-Sauger]

Hallo,

ich hätte gerne gewusst wie ich in der Tabelle, wo die ganzen Threads aufgelistet sind, also hier:
http://www.kurzehosenforum.com/viewforum.php?f=20
die Farben durch eine IMG-Grafik ersetzen kann.

Dort ist ja eine Tabelle mit blauem Rand und in der Tabelle stehen die ganzen Threads (momentan nur einer ). Momentan hat es einen hellblauen Hintergrund und wenn man mit der Maus drüber fährt, bekommt es eine helle Sand-Farbe.
Dort würde ich gerne eine Holz-Grafik einfügen.
Wenn man mit der Maus drüber fährt, sollte immer noch die selbe Grafik angezeigt werden.
Der blaue Rand soll aber bleiben, es geht nur ums Innere der Tabelle!!

Weiß jemand, in welcher Datei und Zeile ich das ändern kann?

Außerdem würde ich gerne den Schriftzug "Lederhosen-Ecke" (direkt über dem Button "Neues Thema") gelöscht haben. Habe leider auch keinen Plan wie das geht..
Ich vermute mal, irgendwo in der colours-Datei.. aber die hat ja so viele Einträge, da blick ich nicht durch.
Und die Schriftfarbe, wo jetzt steht "Premieren-Thread... das Lederhosen-Forum ist eröffnet " sollte von Blau auf Weiß umgestellt werden.

Vielen Dank schonmal für eure Hilfe!!

[hackepeter13]

Außerdem würde ich gerne den Schriftzug "Lederhosen-Ecke" (direkt über dem Button "Neues Thema") gelöscht haben. Habe leider auch keinen Plan wie das geht..
Ich vermute mal, irgendwo in der colours-Datei..

Falsch vermutet, Texte stehen nicht in den css-Dateien (css-Dateien sind zum stylen gedacht).

Texte stehen entweder in Sprachdateien oder werden aus der Datenbank geladen, wie bei der Foren-Überschrift "Lederhosen-Ecke" (da diese über das ACP -> Foren eingetragen/erstellt wurde).

Wenn du die Überschrift weg haben willst, musst du in der viewforum_body.html nach <h2><a href="{U_VIEW_FORUM}">{FORUM_NAME}</a></h2> suchen und es entfernen (Nach Style Änderungen ggf. im ACP -> "Cache leeren" ausführen!)

Zu deinen ganzen anderen kleinen Style anpassungen, würde ich dir empfehlen, ein Browser Entwicklertool zu nutzen (Opera, Firefox, Chrome bieten sowas standardmäßig) wenn du das gestartet hast, kannst du auf deiner Website das gewünschte Element anklicken und es wird dir dann der html und css Code für dieses markierte Element angezeigt/markiert, somit siehst du dann auch einfacher, welche Werte du in den css-Dateien suchen musst.

[Knowhow-Sauger]

Gut, danke!
Ich habs gesehen. Unter "Extras" muss man im Firefox auf "Web-Entwickler" klicken.. ich blicke da aber trotzdem nicht durch!

Ich habs jetzt einigermaßen hingekriegt. FAST überall ist jetzt ein Holz-Hintergrund.
Nur die Tabelle, wo der Text angezeigt wird ist immer noch hellgrau... und kann man daher wegen der weißen Schrift nicht lesen!
Seht selbst:
http://www.kurzehosenforum.com/viewtopic.php?f=20&t=4

Ich habe schon so lange in der colours-Datei gesucht, aber nirgendwo die richtige Zeile gefunden..
Vielleicht kann mir jemand helfen? Der Hintergrund soll ebenso Holz-Design haben, statt dem hellen grau.
... hier die colours-Datei:

https://www.phpbb.de/support/pastebin.p ... iew&s=1065

Danke!

[Kirk]

Suche in der colours.css nach: .bg2 { background-color: #e1ebf2; }

Ändere es so um:

Code: Alles auswählen

.bg2	{ background-image: url('/styles/lederhosen/lederhosen.png'");
background-repeat: repeat;

[Knowhow-Sauger]

Danke für den Tipp!

Jetzt ist auf jeden Fall schonmal das Anfangs-Posting mit Holz-Hintergrund:
http://www.kurzehosenforum.com/viewtopi ... 5&p=19#p19

aber das 2. und 3. Posting funktioniert leider immer noch nicht.
Im 3. Posting wird sogar x-mal das Online-Logo angezeigt!

Ich habe versucht auch zusätzlich bg1 und bg2 mit der Holzgrafik auszustatten. Funktioniert aber leider auch nicht..

[Crizzo]

Hi,

das kann so nicht funktionieren. Der Online-Status wird per zusätzlicher Klasse "online" und damit einem Hintergrund für das Element definiert, dem ihr eine Holzgrafik geben möchtet. Durch den Befehl:

Code: Alles auswählen

.bg2   { background-image: url('/styles/lederhosen/lederhosen.png'");
background-repeat: repeat;}

Kommt es nun dazu, dass das Element seinen Hintergrundbild wiederholt bekommt und da das "online" die höhere Spezifität hat, setz es sich durch. Also wird es, anstelle von der Holzgrafik unendlich wiederholt.

Da .bg1, .bg2 noch viele weitere Hintergründe definieren, wäre es deshalb besser, wenn man würde in der viewtopic_body.html dem Posting-Element eine eigene Klasse geben, die den Holz-Hintergrund definiert und das "online" anders einbinden.

Öffne: viewtopic_body.html:
FINDE:

Code: Alles auswählen

<!-- IF postrow.S_ROW_COUNT is odd -->bg1<!-- ELSE -->bg2<!-- ENDIF -->

ERSETZE MIT:

Code: Alles auswählen

postingbg

FINDE und lösche:

Code: Alles auswählen

<!-- IF postrow.S_ONLINE and not postrow.S_IGNORE_POST --> online<!-- ENDIF -->

FINDE:

Code: Alles auswählen

<!-- IF not postrow.S_IGNORE_POST -->
			<dl class="postprofile" id="profile{postrow.POST_ID}">

ERSETZE MIT:

Code: Alles auswählen

<!-- IF not postrow.S_IGNORE_POST -->
			<dl class="postprofile<!-- IF postrow.S_ONLINE and not postrow.S_IGNORE_POST --> online<!-- ENDIF -->" id="profile{postrow.POST_ID}">

ÖFFNE colours.css:
ERGÄNZE:

Code: Alles auswählen

.postingbg {
background: #764B1C url(/styles/lederhosen/lederhosen.png) 0 0 repeat;
}

Die Online-Anzeige müsste dann noch nahezu genauso funktioniert, eventuell muss man die Grafik ein wenig anders platzieren.
content.css

Code: Alles auswählen

.online {
	background-image: none;
	background-position: 100% 0;
	background-repeat: no-repeat;
}

Grüße

[Knowhow-Sauger]

Hey, jetzt funktioniert es endlich. Dankeschön!!

Allerdings habe ich nun ein weiteres Problem. Und zwar möchte ich auf der rechten Seite, also dort wo der Autor steht:
http://www.kurzehosenforum.com/viewtopic.php?f=20&t=5

gerne dieses Hintergrundbild einfügen:
http://www.kurzehosenforum.com/styles/l ... osenbg.png

In diesem bayerischen Hüttenfenster (weiße Fläche) soll dann der Mitgliedsname, der Rang, die Beitragszahl sowie PN und e-Mail-Symbol stehen.
Und die Avatare sollten unter dem bayerischen Fenster angezeigt werden. Ist klar, sonst wird es ja zu gross.
Ich habe mir überlegt, dass man die Daten am besten zentriert anzeigen lässt.
Dann müsste es in etwa passen mit der Anzeige im bayerischen Fenster.

Früher war dort der Hintergrund nur weiß und ich habe das so damals eingestellt:

Code: Alles auswählen

/* Poster profile block
----------------------------------------*/
.postprofile {
    border-left-color: #000000;
    color: #000000;
background-color:#ffffff;

}

Danke!!

[Miriam]

Wie Hintergrundbilder eingefügt werden, hast Du in diesem (Deinem) Thema schon erfahren.

Was haben Deine eigenen Bemühungen zur Lösung Deines aktuellen Problems ergeben? Hast Du auch mal CSS Tutorien gelesen oder generell mal einen Blick in irgendeine CSS Bedienungsanleitung geworfen? Hier wäre zum Beispiel ein guter Start -> Klick.

[Knowhow-Sauger]

Wie man Hintergrundbilder einfügt weiß ich auch.
Aber ich finde immer den Ort nicht, in welcher Datei ich das eintragen muss.

[Crizzo]

Wie man Hintergrundbilder einfügt weiß ich auch.
Aber ich finde immer den Ort nicht, in welcher Datei ich das eintragen muss.

Naja, CSS-Regeln stehen immer in einer Datei im Ordner "theme" deines Styles. Die meisten Sachen findest du in colours.css, content.css und common.css. Ansonsten kannst du die Dateien auch einfach durchsuchen, in notepad++ geht das mit einem Klick.

Diesem Element:

Code: Alles auswählen

    /* Poster profile block
    ----------------------------------------*/
    .postprofile {
        border-left-color: #000000;
        color: #000000;
    background-color:#ffffff;

    }

eine Hintergrundgrafik zu geben wird nicht funktionieren, weil ich gestern in meinem Vorschlag die "online"-Grafik so umgebaut hatte, dass sie eben beim gleichen Element das "postprofile" als Klasse hat, eingebunden wird. Da musst du jetzt entweder "online" wieder woanders einsetzen oder deine Hintergrundgrafik anders einbinden.