Wie kann ich Farben durch IMG-Grafiken ersetzen?

[Knowhow-Sauger]

Hallo Blackhawk,

das Online-Logo ist mir ehrlich gesagt schnuppe.
Es geht mir nur darum, dass dieses "bayerische Fenster" als Hintergrundgrafik bei dem Autor angezeigt wird UND dass dann die Daten genau in der Innenseite des bayerischen Fensters zu sehen sind.

Ich hab das jetzt so hingekriegt, dass alles wieder so aussieht wie vorher
indem ich einfach das Online-Symbol im ACP abgeschaltet habe.
Jetzt müsste ich nur noch wissen, in welcher Datei angegeben ist, an welcher Position der Autor, Rang, Beitragszahl etc. steht.
Im Prinzip müsste ich nur die Daten zentriert ausrichten lassen mit

Code: Alles auswählen

<center>

sowie etwas weiter nach unten.
Und das Avatar-Bild soll ganz zum Schluss angezeigt werden, statt ganz am Anfang.
Dann müsste es klappen.
Schau, so sieht es jetzt aus:

http://www.kurzehosenforum.com/viewtopic.php?f=20&t=9

Magst Du mir noch einen Tipp geben?

[Xey]

[ externes Bild ]
[ externes Bild ]

Hallo, folgendes Problem hab deine Modifikation dazu benützt um einen Transparenten Hintergrund und das Online Image gemeinsam zum Laufen zu bringen was gut Klappte.
Die Position musste in der Content.css geändert werden was sich per padding und margin gemacht habe (habe etwas größere Ecken) nun macht er mir aber die über postprofil definierte border-left bis ganz nach oben. Was mir gar nicht gefällt. kann ich die in der viewtopic_body definierte Zeile:

Code: Alles auswählen

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

so verändern das sie nicht über postprofil online abgerufen wird sondern direkt auf der postingbg liegt damit ichs dahin schieben kann wo ichs brauche?
Und wenn ja wie mach ichs?

So hat ich es jetzt gemacht, hat aber wie gesagt unerwünschte Nebeneffekte

Code: Alles auswählen

.online {
	background-image: none;
	background-position: 100% 0;
	background-repeat: no-repeat;
	margin: -20px -10px 0 0;
	padding: 20px 10px 0 0;

Hoffe ich hab mich halbwegs klar ausgedrückt.
Style ist Prosilver basierend
Version des Forums ist 3.0.10

[Crizzo]

Hi,

was genau willst du jetzt erreichen?

[Xey]

Ich hätte gerne das die Position des Online Symbols stimmt, ohne das dabei border left bis nach oben durch geht.

http://jadedrachen.bplaced.net/forum/

Test Acount: Name test1234 Pass test1234

Unter Aktuelles und Neuigkeiten ist ein test Post wo man das problem sieht, ich bekomms leider einfach net hin das Die Position stimmt und die Border Linie nicht bis an den Rand durch geht.

Edit: Browser Firefox 18.0.2
Opera 12.14 64bit

[Crizzo]

Hi,

um das <dt>-Element baust du ein <div>:

Code: Alles auswählen

<div class="online" style="width: 22%; float: right; min-height: 80px; margin: -18px -10px 0px 0px;">
		[...]
</div>

Stellst .online auf dieses um:

Code: Alles auswählen

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

.online {
    background-image: url("./styles/prosilver/imageset/de/icon_user_online.png");
}

und .classprofile auf das:

Code: Alles auswählen

.postprofile {
    border-left: 1px solid #FFFFFF;
    color: #666666;
    display: block;
    margin: 25px 0 10px;
    min-height: 80px;
}

Grüße

[Xey]

Classprofile hab ich nicht heißt in der Content.css bereits postprofil, daher hab ich die Werte da geändert.

Nur wo genau mach ich das Div Tag rum?

Das Online ist doch in einer dl oder etwas nicht? Ich versteh gerade --Bahnhof-- sry

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}">
			<dt>
				<!-- IF postrow.POSTER_AVATAR -->
					<!-- IF postrow.U_POST_AUTHOR --><a href="{postrow.U_POST_AUTHOR}">{postrow.POSTER_AVATAR}</a><!-- ELSE -->{postrow.POSTER_AVATAR}<!-- ENDIF --><br />
				<!-- ENDIF -->
				<!-- IF not postrow.U_POST_AUTHOR --><strong>{postrow.POST_AUTHOR_FULL}</strong><!-- ELSE -->{postrow.POST_AUTHOR_FULL}<!-- ENDIF -->
			</dt>

			<!-- IF postrow.RANK_TITLE or postrow.RANK_IMG --><dd>{postrow.RANK_TITLE}<!-- IF postrow.RANK_TITLE and postrow.RANK_IMG --><br /><!-- ENDIF -->{postrow.RANK_IMG}</dd><!-- ENDIF -->

		<dd>&nbsp;</dd>

		<!-- IF postrow.POSTER_POSTS != '' --><dd><strong>{L_POSTS}:</strong> {postrow.POSTER_POSTS}</dd><!-- ENDIF -->
		<!-- IF postrow.POSTER_JOINED --><dd><strong>{L_JOINED}:</strong> {postrow.POSTER_JOINED}</dd><!-- ENDIF -->
		<!-- IF postrow.POSTER_FROM --><dd><strong>{L_LOCATION}:</strong> {postrow.POSTER_FROM}</dd><!-- ENDIF -->

		<!-- IF postrow.S_PROFILE_FIELD1 -->
			<!-- Use a construct like this to include admin defined profile fields. Replace FIELD1 with the name of your field. -->
			<dd><strong>{postrow.PROFILE_FIELD1_NAME}:</strong> {postrow.PROFILE_FIELD1_VALUE}</dd>
		<!-- ENDIF -->

		<!-- BEGIN custom_fields -->
			<dd><strong>{postrow.custom_fields.PROFILE_FIELD_NAME}:</strong> {postrow.custom_fields.PROFILE_FIELD_VALUE}</dd>
		<!-- END custom_fields -->

		<!-- IF not S_IS_BOT -->
		<!-- IF postrow.U_PM or postrow.U_EMAIL or postrow.U_WWW or postrow.U_MSN or postrow.U_ICQ or postrow.U_YIM or postrow.U_AIM or postrow.U_JABBER -->
			<dd>
				<ul class="profile-icons">
					<!-- IF postrow.U_PM --><li class="pm-icon"><a href="{postrow.U_PM}" title="{L_PRIVATE_MESSAGE}"><span>{L_PRIVATE_MESSAGE}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_EMAIL --><li class="email-icon"><a href="{postrow.U_EMAIL}" title="{L_SEND_EMAIL_USER} {postrow.POST_AUTHOR}"><span>{L_SEND_EMAIL_USER} {postrow.POST_AUTHOR}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_WWW --><li class="web-icon"><a href="{postrow.U_WWW}" title="{L_VISIT_WEBSITE}: {postrow.U_WWW}"><span>{L_WEBSITE}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_MSN --><li class="msnm-icon"><a href="{postrow.U_MSN}" onclick="popup(this.href, 550, 320); return false;" title="{L_MSNM}"><span>{L_MSNM}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_ICQ --><li class="icq-icon"><a href="{postrow.U_ICQ}" onclick="popup(this.href, 550, 320); return false;" title="{L_ICQ}"><span>{L_ICQ}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_YIM --><li class="yahoo-icon"><a href="{postrow.U_YIM}" onclick="popup(this.href, 780, 550); return false;" title="{L_YIM}"><span>{L_YIM}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_AIM --><li class="aim-icon"><a href="{postrow.U_AIM}" onclick="popup(this.href, 550, 320); return false;" title="{L_AIM}"><span>{L_AIM}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_JABBER --><li class="jabber-icon"><a href="{postrow.U_JABBER}" onclick="popup(this.href, 550, 320); return false;" title="{L_JABBER}"><span>{L_JABBER}</span></a></li><!-- ENDIF -->
				</ul>
			</dd>
		<!-- ENDIF -->
		<!-- ENDIF -->

		</dl>
	<!-- ENDIF -->

Könntest du mir das eventuell bitte näher definieren

[Crizzo]

Vor das hier:

Code: Alles auswählen

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

packst du das:

Code: Alles auswählen

<div class="online" style="width: 22%; float: right; min-height: 80px; margin: -18px -10px 0px 0px;">

und nach dieser Zeile:

Code: Alles auswählen

      </dl>

diesen Code:

Code: Alles auswählen

</div>

Und das sollte natürlich beides mal .postprofile heißen. Sry.

und .postprofile auf das:

Code: Alles auswählen

.postprofile {
    border-left: 1px solid #FFFFFF;
    color: #666666;
    display: block;
    margin: 25px 0 10px;
    min-height: 80px;
}

Grüße

PS: Die "online" Abfrage bei <dl> muss natürlich dann raus.

[Xey]

Die Position stimmt zwar jetzt aber leider macht er mir das Bild bei dennen die Online sind doppelt, und bei dennen die nicht online sind auch einmal

[ externes Bild ]

colors.css

Code: Alles auswählen

.online {
    background-image: url("/forum/styles/prosilver/imageset/de/icon_user_online.png");
}

content.css

Code: Alles auswählen

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

sowie

Code: Alles auswählen

.postprofile {
	/* Also see tweaks.css */
    border-left: 1px solid #FFFFFF;
    color: #666666;
    display: block;
    margin: 25px 0 10px;
    min-height: 80px;
}

viewtopic_body.html

Code: Alles auswählen

		<!-- IF not postrow.S_IGNORE_POST -->
        <div class="online" style="width: 22%; float: right; min-height: 80px; margin: -18px -10px 0px 0px;">
         <dl class="postprofile<!-- IF postrow.S_ONLINE and not postrow.S_IGNORE_POST --> online<!-- ENDIF -->" id="profile{postrow.POST_ID}">
			<dt>
				<!-- IF postrow.POSTER_AVATAR -->
					<!-- IF postrow.U_POST_AUTHOR --><a href="{postrow.U_POST_AUTHOR}">{postrow.POSTER_AVATAR}</a><!-- ELSE -->{postrow.POSTER_AVATAR}<!-- ENDIF --><br />
				<!-- ENDIF -->
				<!-- IF not postrow.U_POST_AUTHOR --><strong>{postrow.POST_AUTHOR_FULL}</strong><!-- ELSE -->{postrow.POST_AUTHOR_FULL}<!-- ENDIF -->
			</dt>

			<!-- IF postrow.RANK_TITLE or postrow.RANK_IMG --><dd>{postrow.RANK_TITLE}<!-- IF postrow.RANK_TITLE and postrow.RANK_IMG --><br /><!-- ENDIF -->{postrow.RANK_IMG}</dd><!-- ENDIF -->

		<dd>&nbsp;</dd>

		<!-- IF postrow.POSTER_POSTS != '' --><dd><strong>{L_POSTS}:</strong> {postrow.POSTER_POSTS}</dd><!-- ENDIF -->
		<!-- IF postrow.POSTER_JOINED --><dd><strong>{L_JOINED}:</strong> {postrow.POSTER_JOINED}</dd><!-- ENDIF -->
		<!-- IF postrow.POSTER_FROM --><dd><strong>{L_LOCATION}:</strong> {postrow.POSTER_FROM}</dd><!-- ENDIF -->

		<!-- IF postrow.S_PROFILE_FIELD1 -->
			<!-- Use a construct like this to include admin defined profile fields. Replace FIELD1 with the name of your field. -->
			<dd><strong>{postrow.PROFILE_FIELD1_NAME}:</strong> {postrow.PROFILE_FIELD1_VALUE}</dd>
		<!-- ENDIF -->

		<!-- BEGIN custom_fields -->
			<dd><strong>{postrow.custom_fields.PROFILE_FIELD_NAME}:</strong> {postrow.custom_fields.PROFILE_FIELD_VALUE}</dd>
		<!-- END custom_fields -->

		<!-- IF not S_IS_BOT -->
		<!-- IF postrow.U_PM or postrow.U_EMAIL or postrow.U_WWW or postrow.U_MSN or postrow.U_ICQ or postrow.U_YIM or postrow.U_AIM or postrow.U_JABBER -->
			<dd>
				<ul class="profile-icons">
					<!-- IF postrow.U_PM --><li class="pm-icon"><a href="{postrow.U_PM}" title="{L_PRIVATE_MESSAGE}"><span>{L_PRIVATE_MESSAGE}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_EMAIL --><li class="email-icon"><a href="{postrow.U_EMAIL}" title="{L_SEND_EMAIL_USER} {postrow.POST_AUTHOR}"><span>{L_SEND_EMAIL_USER} {postrow.POST_AUTHOR}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_WWW --><li class="web-icon"><a href="{postrow.U_WWW}" title="{L_VISIT_WEBSITE}: {postrow.U_WWW}"><span>{L_WEBSITE}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_MSN --><li class="msnm-icon"><a href="{postrow.U_MSN}" onclick="popup(this.href, 550, 320); return false;" title="{L_MSNM}"><span>{L_MSNM}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_ICQ --><li class="icq-icon"><a href="{postrow.U_ICQ}" onclick="popup(this.href, 550, 320); return false;" title="{L_ICQ}"><span>{L_ICQ}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_YIM --><li class="yahoo-icon"><a href="{postrow.U_YIM}" onclick="popup(this.href, 780, 550); return false;" title="{L_YIM}"><span>{L_YIM}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_AIM --><li class="aim-icon"><a href="{postrow.U_AIM}" onclick="popup(this.href, 550, 320); return false;" title="{L_AIM}"><span>{L_AIM}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_JABBER --><li class="jabber-icon"><a href="{postrow.U_JABBER}" onclick="popup(this.href, 550, 320); return false;" title="{L_JABBER}"><span>{L_JABBER}</span></a></li><!-- ENDIF -->
				</ul>
			</dd>
		<!-- ENDIF -->
		<!-- ENDIF -->

		</dl></div>
	<!-- ENDIF -->

Templates sind Aktualiseirt und der Cache geleert.
Themes sind Aktualisiert.
Cache auf der Main Seite des ACP geleert

[Crizzo]

Ein bisschen mitarbeiten musst du schon. Da gibt es eine IF-Abfrage:

Code: Alles auswählen

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

, die musst du natürlich dem neuem <div> geben, was jetzt nur die class="online" hat, damit man even das ONLINE-Bild einfacher platzieren kann.

Und die alte IF-Abfrage nehmst "online"-Klasse musst du dem <dl> natürlich "wegnehmen", sonst klappt es nicht.

[Xey]

Danke, hätte ich alleine nie hinbekommen. U made my day