Cookie-Hinweis - Desktop

Cookie-Hinweis - Mobile

Ein Posttitel

Der jüngste Post des Blogs, den man üblicherweise sieht, wenn man die Startseite eines Blogs geöffnet hat.
Zumindest, wenn für die Startseite keine andere Lösung, als die Ausgangseinstellung genutzt wird.

Bilder so breit wie der Post

Mit dem Bildmenübalken kann man alternativ zur Originalgröße feste Bild-Seitenlängen wählen. (Klein: 200px, Mittel: 320px, Groß: 400px, X-Large: 640px) Ob die Höhe diesen Wert bekommt oder die Breite, hängt davon ab, welche Seite des Originalbildes die längere ist. Die jeweils andere Seite wird daran proportional angepasst. Um mit dem Bildmenübalken eine bestimmte Bildbreite zu erzeugen, müsste das Bild also breiter als hoch sein.

Will man Bilder exakt so breit wie die Posts anzeigen und daran die Bild-Höhen proportional anpassen, unabhängig davon, welche Seite der verschiedenen Originalbilder die jeweils längere ist, kann man das per CSS oder Style machen. Dazu muss man außerdem die Bilder im Bildmenübalken auf "Originalgröße" einstellen und einen Div-Container mit einem Klassennamen um den Bereich stellen, innerhalb dessen alle Bilder so breit sein sollen.

Gleich breite kleine Bilder

Mit dem Bildmenübalken kann man alternativ zur Originalgröße feste Bild-Seitenlängen wählen. (Klein: 200px, Mittel: 320px, Groß: 400px, X-Large: 640px) Ob die Höhe diesen Wert bekommt oder die Breite, hängt davon ab, welche Seite des Originalbildes die längere ist. Die jeweils andere Seite wird daran proportional angepasst. Um mit dem Bildmenübalken eine bestimmte Bildbreite zu erzeugen, müsste das Bild also breiter als hoch sein.

Will man mehrere Bilder nebeneinander stellen und sie alle, unabhängig davon, welche Seite der verschiedenen Originalbilder die jeweils längere ist, in der gleichen Breite anzeigen und daran die Bild-Höhen proportional anpassen, kann man das per CSS bzw. per Style realisieren.

Hier habe ich zwei Bereiche mit Klassen-Namen erstellt. Innerhalb des ersten Bereichs sind Bilder 120px breit, innerhalb des zweiten Bereichs sind Bilder 80px breit. Im Post selbst sind die Bilder per Bildmenübalken auf "Originalgröße" gestellt, damit das Skalierergebnis das bestmögliche ist.

Einrichtung der Mobilversion

Das Blog hatte zwar anfangs die Möglichkeit blockiert, eine benutzerdefinierte Mobilversion zu gestalten und anzuzeigen, die Blockade konnte aber durch erneute Wahl der Vorlage aufgehoben werden. Dass ich im HTML und Designer dann alles neu machen musste, war lästig, aber machbar.

Haupt-Hintergrund

Statt eines Hintergrundbilds für den Blog-Body habe ich Farben für den Äußeren Hintergrund und den Haupthintergrund gewählt und um den Bereich, für den der Haupthintergrund gilt, per CSS einen groß gepunkteten Rahmen kommandiert. Der Browser Chrome zeigt die Punke als Vierecke, aber das hat auch was.

Einstellungen im Designer

Es ist höchst hilfreich, wenn man sich die Einträge, die man im Vorlagendesigner gemacht hat, notiert und seine Notizen nach Änderungen auch aktualisiert. So kann man die Einstellungen jederzeit erneuern, wenn es notwendig werden sollte. Es gibt einige Situationen, in denen das nötig werden kann.

Änderungen des Standards

Nutzt man alles, wie es standardmäßig eingerichtet ist, hat man beim Einrichten des Blogs sebstverständlich am wenigsten Arbeit. Wer ein Blog aber öffentlich betreiben will, der hat in der Regel bestimmte Vorstellungen, welche Funktionen es bieten, welche Elemente es beinhalten und wie es aussehen soll. Ein Konzept hilft dabei, die Arbeit damit nicht unnötig zu verlängern.

Besonderheiten der Vorlage

Alle sieben Varianten der Vorlage Einfach (Simple) sind im Ausgangszustand Vorlagen ohne Abrundung von Ecken und ihr Headerbereich grenzt direkt oben an die Navbar.

Grundeinstellungen

Der Inhalt zu dem Thema ist unabhängig von der gewählten Vorlage, daher habe ich ihn nur einmal geschrieben und bette ihn hier per Iframe ein. Falls man statt dessen lieber gleich die Quelle sehen möchte, das ist der Link: b2.utez.de Web | Mobil.

Zweck des Blogs

Dieses Blog soll meinem Hauptblog sg.utez.de Web | Mobil als Beispiel für eine Möglichkeit dienen, wie die Vorlage Einfach (Simple) von Blogger genutzt werden kann. Von der Vorlage Einfach/Simple gibt es sieben Varianten. Für dieses Blog hier habe ich die Variante Simplysimple gewählt.

Wichtig war mir diesmal, dass auch die Mobilversion gleich gut genutzt werden kann und, dass ich deren Design kontrollieren kann.