Statische Seiten - Textränder

B.E.A. · Post by **B.E.A.** » Sun Nov 24, 2013 9:24 am

OK dann ist jetzt für mich klar, warum es nicht klappte für mein Verständnis, denn ich dachte der Permalink wäre richtungweisend. Letzte Fragen: Könnte ich dann auch für eine einzelne statische Seite noch weitere css Angaben hinterlegen, wie sich die Seite darstellen könnte (Hintergrundfarbe, Schriftfarbe, Schriftart etc.) oder gäbe es dann Konflikte?

Google stellt ja unter anderem auch Webschriftarten zur Verfügung die vom Browser erkannt werden. Müsste ich das dann auch dort hinterlegen? Ist ja auch ein Script was noch eingearbeitet werden müsste. Wo kommt das dann hin?

Post by **yellowled** » Sun Nov 24, 2013 12:05 pm

B.E.A. wrote:Könnte ich dann auch für eine einzelne statische Seite noch weitere css Angaben hinterlegen, wie sich die Seite darstellen könnte (Hintergrundfarbe, Schriftfarbe, Schriftart etc.) oder gäbe es dann Konflikte?

Klar. Alles, was für alle statischen Seiten gelten soll, vergibst Du über den Klassen-Selektor (.serendipity_staticpage), alles was nur für eine statische Seite gelten soll, vergibst Du über den id-Selektor. ids sind immer eindeutig. Du kannst auch Styles der Klasse mit Styles der id überschreiben, weil ids eine höhere Spezifität als Klassen haben.

B.E.A. wrote:Google stellt ja unter anderem auch Webschriftarten zur Verfügung die vom Browser erkannt werden. Müsste ich das dann auch dort hinterlegen? Ist ja auch ein Script was noch eingearbeitet werden müsste. Wo kommt das dann hin?

Zwei Schritte:

1. Ein zusätzliches Stylesheet von Google im <head> einbinden – also in der index.tpl, am besten direkt vor dem Einbinden des Template-Stylesheets. Beispiel für BP und Open Sans:

Code: Select all

<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700' rel='stylesheet' type='text/css'>
<!-- base styles needed for bulletproof -->
<link rel="stylesheet" type="text/css" href="{serendipity_getFile file="base.css"}" />
<!-- style.css -->
<link rel="stylesheet" type="text/css" href="{$head_link_stylesheet}" />

(Den notwendigen Code bekommst Du auf http://www.google.com/fonts bei der Auswahl des Webfonts. Du kannst mehrere Fonts in einer „Collection“ kombinieren und solltest immer nur ein Stylesheet einbinden müssen.)

2. Den eingebundenen Font im Stylesheet zuweisen. Da kommt's dann drauf an, wofür Du ihn genau verwenden willst – als generelle Schrift, nur für Überschriften usw. Beispiel zur generellen Verwendung:

Code: Select all

body {
    font-family: 'Open Sans', sans-serif;
}

(Ja, die Anführungszeichen sind wichtig.)

YL

Statische Seiten - Textränder

Re: Statische Seiten - Textränder

Re: Statische Seiten - Textränder