[3.3] Schriftgröße im Header anpassen

[stoertie]

Moin zusammen,

ich habe eben gerade ein update von 3.2.8 auf 3.3.1 gemacht. Auf den ersten Blick hat das einigermaßen geklappt... (die Extensions muss ich alle noch mal angucken, die sind noch inaktiv). Ich fange jetzt erstmal mit der Startseite des Forums an (also was beim Aufruf von index.php kommt)

Die Anpassung des Logos habe mit Hilfe des Forums auch einigermaßen hinbekommen und mein eigenes Logo (264x119px) auf der linken Seite im Header auch wenn es zu tief sitzt.

Jetzt geht es mir aber erstmal um "Name des Boards" und "Beschreibung des Boards".
Die würde ich gern nach rechts schieben, bzw. auf der verbleibenden Breite neben dem Logo zentrieren und die Schriftgröße würde ich auch gern anpassen. Wo und wie muss/kann ich das ändern?

Außerdem steht das "Logo" nach der Änderung etwas zu weit unten (also nicht mittig im blauen Kasten), wenn jemand da auf die Schnelle mit einem Tipp helfen könnte?

viele Grüße
Michael

[stoertie]

Ich vergaß zu erwähnen dass es um den normalen Prosilver-Style handelt! - SORRY!

Ich verlinke nochmal ein Screenshot, damit Ihr wisst wovon ich genau spreche: [ externes Bild ]

Viele Grüße
Michael

[69bruno]

Ich würde.mir ein eigenes Banner erstellen, mit eigener Schrift, Bild und Hintergrundfarbe. Das ganze dann mit der ext sitelogo responsive einbinden.
schau dir mal das Banner unter cruiser-lounge.de an

[chris1278]

Also um das Logo nach oben zu ziehen öffne:

styles/prosilver/theme/comon.css

finde:

Code: Alles auswählen

.logo {
    float: left;
    width: auto;
    padding: 10px 13px 0 10px;
}

Sollte im Original zustand bei Zeile 168 sein.

Für dich ist dieser Wert von bedeutung

Code: Alles auswählen

 padding: 10px 13px 0 10px;

Wenn du denn ersten 10er wert änderst geht das logo entweder hoch oder runter. Das Definiert den Abstand zum oberen Container rand. Wenn du das verringerst dann schiebst das logo nach oben. Versuch einfach mal den Wert so:

Code: Alles auswählen

 padding: 5px 13px 0 10px;

Dann schau ob dir das so zusagt.

Für den Text centriert zu bekommen mache folgedes:

Auch in der common.css

Füge dort am anfang oder am Ende der datei folgendes ein:

Code: Alles auswählen

.tz {
	text-align: center;
}

Dann Öffne die Dateu:

Styles/prosilver/template/overall_header.html

Finde dort:

Code: Alles auswählen

<div id="site-description" class="site-description">
		<a id="logo" class="logo" href="{% if U_SITE_HOME %}{{ U_SITE_HOME }}{% else %}{{ U_INDEX }}{% endif %}" title="{% if U_SITE_HOME %}{{ L_SITE_HOME }}{% else %}{{ L_INDEX }}{% endif %}">
					<span class="site_logo"></span>
				</a>
				<h1>{SITENAME}</h1>
				<p>{SITE_DESCRIPTION}</p>
				<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
			</div>

Dort findest du 2 zeilen die du anpassen musst:

Code: Alles auswählen

<h1>{SITENAME}</h1>
<p>{SITE_DESCRIPTION}</p>

Ersetze die zeilen durch:

Code: Alles auswählen

<h1 class="tz">{SITENAME}</h1>
<p class="tz">{SITE_DESCRIPTION}</p>

Alles Abspeichern und hochladen. Danach Browser und Forencache löschen.

[stoertie]

Moin Bruno, moin Chris,

@Bruno:
Vielen Dank aber genau das wollte ich vermeiden.

@Chris:
vielen Dank für Infos... das ist das, was ich suchte. Ich denke damit sollte ich klar kommen. Probiere es nachher gleich mal aus.

Viele Grüße
Michael

[stoertie]

Moin Chris,

so ich hab's...

Habe jetzt auch gleich die Beschreibung mitangepasst indem ich folgendes in der common.css eingefügt:

Code: Alles auswählen

.tz {
	text-align: center;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: bold;
	font-size: 3em;
}

.ty {
	text-align: center;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: bold;
	font-size: 1.5em;
}

..dann wie von Dir beschrieben in overall_header.html (Zeile 93 u. 94) folgende Änderung durchgeführt:

Code: Alles auswählen

<h1 class="tz">{SITENAME}</h1>
<p class="ty">{SITE_DESCRIPTION}</p>  

Das Logo habe auch nach oben bekommen, bin dafür mit dem Wert bis auf "2" herunter gegangen und habe den zweiten Wert auf "100" gesetzt. Damit rutschte der Seitenname und die Beschreibung noch ein Stück weiter nach rechts:

Code: Alles auswählen

.logo {
	float: left;
	width: auto;
	padding: 2px 100px 0 10px;

Das ganze sieht dann jetzt so aus: [ externes Bild ]

Nochmals vielen Dank für Deine Hilfe!

Viele Grüße
Michael

[roetti]

Ich würde.mir ein eigenes Banner erstellen, mit eigener Schrift, Bild und Hintergrundfarbe. Das ganze dann mit der ext sitelogo responsive einbinden.
schau dir mal das Banner unter cruiser-lounge.de an

Hallo Bruno,
genua so wie euer Logo wollte ich unser Logo (Auch ein Biker-Forum) gestalten.

1. Womit kann ich am besten ein Logo in der Größe ( 1152 x 117) erstellen (gif-Bilder liegen bereits vor) ?
2. wie bzw. womit binde ich das in mein Forum ein ?

[69bruno]

Hi roetti,

ich mache das mit paint.net oder mit gimp. Beide nehme ich, weil kostenlos. Gimp ist allerdings äußerst mächtig, wenn man noch nix mit Bildbearbeitung gemacht hat.
Bei beiden Programmen kannst Du die Größe des Bildes eingeben und dann deine Grafiken in einzelne Ebenen einfügen und platzieren.
Zum Schluss werden die Ebenen zusammengeführt und Du hast dein Banner.
Wenn du dann noch die Ext sitelogo responsive installierst und das Banner in den Imageordner der Ext speicherst, bist du fertig.
Sieht auch am Handy gut aus.

[69bruno]

Bei Problemen kann ich Dir da auch gerne helfen.