Blogfashion: Hueman

Dieser Beitrag gibt einen Überblick über die wichtigsten Einstellungen für das neue Theme Hueman, das das Theme Magazine Basic ersetzt. Hueman teilt mit seinem Vorgänger einige beliebte Eigenschaften und erweitert es um neue Funktionen, die wir in diesem Artikel vorstellen möchten.

Es gibt viel einzustellen und zu individualisieren, deshalb ist dieser Beitrag recht umfangreich. Wir hoffen, damit einen guten Einstieg zu vermitteln. Für eine vollständige Übersicht über die neuen Optionen empfehlen wir das interaktive Tutorial. Es führt Sie durch die verschiedenen Etappen der Konfiguration von Hueman. Bitte beachten Sie, dass die Theme-Optionen von Hueman unabhängig von der Sprache des Blogs stets auf Englisch dargestellt werden.

Aufgeteilt ist dieser Beitrag in sechs Kapitel:

1. Ein besonderer Header
2. Eine Slideshow für Artikel
3. Zwei Spalten für die Artikel
4. Eine optimierte Navigation
5. Position der Widgets: die Qual der Wahl
6. Widgets: einige Neuheiten

Ein Tipp: Bevor Sie mit der Umstellung beginnen, machen Sie Screenshots von der Startseite und den Menüs und Untermenüs. Dann fällt es hinterher leichter, das Menü zu erstellen, indem Sie die Screenshots nachbauen. Alle Kategorien und Seiten bleiben erhalten.

1. Ein besonderer Header

Einer der Hauptunterschiede zwischen Hueman und den anderen auf Hypotheses angebotenen Themes besteht im Hinblick auf den Header. Sie können im Header den Titel und den Untertitel Ihres Blogs anzeigen und dort auch ein Logo oder ein kleines Bild Ihrer Wahl einfügen. Im Gegensatz zu den anderen Themes erlaubt Ihnen Hueman nicht, als Kopfzeile Ihres Blogs einen personalisierten Header über die gesamte Breite einzufügen.

Titel und Untertitel des Blogs kann man im Menü “Einstellungen > Allgemein” anpassen. Dort korrespondiert das Feld „Slogan” mit einem weiteren Untertitel. Um ein Logo oder ein kleines Bild einzufügen, gehen Sie im Menü auf “Design > Theme Options > Header” und benutzen Sie dort den Button “+” neben dem Feld “Custom Logo”. So können Sie ein Bild aus ihrer Mediathek  auswählen oder ein neues Bild von Ihrem Computer hochladen. Denken Sie bitte daran, ihre Änderungen zu speichern.

Im gleichen Menü erlaubt Ihnen der Schalter „Site Description“ den Untertitel anzuzeigen oder nicht anzuzeigen (siehe Screenshot).

Site Description

Die maximale Höhe des Bildes oder des Logos, das Sie im Header Ihres Blogs einfügen können, kann mittels des Schiebers „Header Logo Max-height“ im Menü „Design > Theme Options > Styling“ eingestellt werden. Dort wird die Einheit Pixel verwendet. Damit ihr Logo oder Bild in feinster Auflösung angezeigt wird (für sogenannte Retina-Displays), ist es notwendig, dass dessen Höhe in Pixel mindestens doppelt so groß ist, wie diejenige, die sie hier einstellen.

header logo

 

2. Eine Slideshow für Artikel

Da es keinen Header gibt, wirkt die Ansicht Ihres Blogs entlastet. Einzelne Artikel können durch eine Slideshow aufgewertet werden. Dazu werden automatisch die vorher in die Artikel eingefügten Beitragsbilder verwendet. Damit die Anzeige dieser Bilder der Slideshow angepasst ist, empfehlen wir Ihnen, Bilder zu verwenden, die eine Größe von mindestens 720×340 Pixel haben. Wenn Sie die Slideshow nicht verwenden, reicht eine Größe von 345×163 Pixel für die Beitragsbilder.

Um die Slideshow einzustellen, gehen Sie in das Menü „Design >Theme Options > Blog“ :

Die Einfügemarke „Featured Post Count“ ermöglicht Ihnen die Zahl der Artikel zu definieren, die in der Slideshow erscheinen sollen. Stellen Sie die Einfügemarke auf 0, wenn Sie die Slideshow deaktivieren wollen. Vorsicht: Damit die Slideshow angezeigt wird, muss mindestens ein Artikel dieser Slideshow ein Artikelbild ( ein sogenanntes „Featured Image“) haben.
Standardmäßig werden die in die Slideshow eingefügten Artikel diejenigen sein, die Sie als letzte publiziert haben. Sollen besondere Artikel in der Slideshow erscheinen, brauchen Sie nur eine Kategorie dafür in das Drop-Down-Menü „Featured Category“ auswählen.
Damit die in die Slideshow eingefügten Artikel auch wie alle anderen Artikel auf der Startseite erscheinen, kreuzen Sie schließlich das Feld  „Include featured posts in content area“ in der Sektion „Featured Posts“ an.

blog

3. Zwei Spalten für die Artikel

Hueman bringt ein weiteres Feature zurück, das bislang nur die beiden nicht mehr verfügbaren Themes “Magazine Basic” und “Evolve Magazin” anboten: Es besteht nun wieder die Möglichkeit, Blogartikel in zwei Spalten anzeigen zu lassen. Desweiteren können Miniaturbilder in Form von Vignetten auf der Startseite des Blogs und ausgehend von der Navigation nach Kategorien angezeigt werden.

blogansicht_hueman

Im Menü “Design > Theme Options > Blog”, können Sie weitere Optionen für kurze Texte und Bilder auf der Startseite Ihres Blogs und für das Durchsuchen Ihres Blogs nach Kategorien einstellen:

Wenn Sie mit dem Cursor auf “Excerpt Length” klicken, können Sie die Länge der Kurztexte (in Worten) festlegen.
Achtung: Sie sollten weiterhin den Button “Weiterlesen” bei Ihren jeweiligen Artikeln nutzen. Sollten Sie sich später für ein anderes Theme entscheiden, müssten Sie dies sonst für alle bereits erschienenen Artikel nachholen. Dass Hueman dies bei dieser Option selber löst, ist bei Themes eher die Ausnahme als die Regel.
Falls kein Artikelbild für Ihren Artikel hinterlegt ist, erscheint standardmäßig ein graues Bild, das als Platzhalter statt des Bildes auf der Startseite Ihres Blogs angezeigt wird. Um dies zu verhindern, können Sie den “Thumbnail Placeholder” auf “off” stellen.
Wenn Sie „Thumbnail Comment Count“ aktivieren, wird auf jeder Miniaturbildanzeige die Anzahl der Kommentare im Bild angezeigt.
Wenn Ihnen die Darstellung in zwei Spalten nicht zusagt, Sie Hueman aber trotzdem nutzen wollen, können Sie diese Einstellung deaktivieren, um eine klassische Ansicht mit einer Spalte der Beiträge anzeigen zu lassen. Die Artikelbilder werden dann in einer Reihe links neben den Beiträgen angezeigt. Dafür müssen Sie “on” unter „Standard Blog List“ aktivieren.

Standardbloglist

Damit die Bilder zur Illustration Ihrer Beiträge als Titelbilder und neben den Kurztexten auf der Startseite angezeigt werden, müssen Sie Folgendes tun: Es reicht nicht, ein Bild in einen Beitrag einzufügen damit es automatisch als Titelbild oder Beitragsbild auf der Startseite angezeigt wird. Zusätzlich rufen Sie den Bearbeitungsbereich Ihres Beitrags auf, der ein Titelbild erhalten soll. Dort finden Sie auf der unteren rechten Seite einen Abschnitt “Featured Image”. Klicken Sie in diesem Abschnitt auf “Beitragsbild festlegen”. Sie haben die Möglichkeit ein bereits bestehendes Bild aus Ihrer Medienübersicht zu nutzen oder hier ein neues Bild hochzuladen. Wie auch in den anderen angebotenen Themes können Sie sich über die Buttons für eine der beiden Möglichkeiten entscheiden. Wenn Sie eine Option gewählt haben, klicken Sie auf “Beitragsbild festlegen” in der unteren rechten Ecke des Feldes.
Damit das Bild in der Diashow angezeigt werden kann, müssen die Bilder eine Mindestauflösung von 720×340 Pixel haben. Bilder, die nicht in der Diashow angezeigt werden sollen, sollten idealerweise mindestens 345×163 Pixel groß sein (siehe oben).

Ebenso wie der Weiterlesen-Button, der in die Artikel eingefügt werden sollte, empfehlen wir auch die Zuweisung eines Artikelbildes zu den einzelnen Artikeln. Das spart Ihnen manchmal mühsame Arbeit, wenn Sie sich entscheiden, das Theme zu wechseln.

Ein kurzer Hinweis: die Tatsache, dass Sie ein Bild als Titelbild definieren, hindert Sie nicht daran, in Ihrem Beitrag so viele Bilder zur Illustration zu nutzen wie sie möchten. Das Titelbild selbst wird bei Hueman nur auf der Startseite angezeigt, also sollten sie es im Beitrag ein weiteres Mal einfügen.

4. Eine optimierte Navigation

Hueman bietet den Lesern zwei interessante Funktionen, um zwischen den einzelnen Artikeln zu navigieren. Diese beiden Optionen können im Menü unter “Design > Theme Options > Blog” eingestellt werden.

themeoptions

          Single_Posts

Die Option “Single- Related Posts” ermöglicht zu entscheiden, ob unter einem Artikel Links zu anderen Artikeln, die einen ähnlichen Inhalt haben, angezeigt werden. Unter “Disable” kann sie deaktiviert werden. “Related by categories” verweist auf andere Texte auf Basis der gemeinsamen Kategorien des soeben gelesenen Artikels und der vorgeschlagenen Artikel. Wenn diese Vorschläge auf die Schlagwörter zurückgehen sollen, muss “Related by tags” ausgewählt werden. Dabei sollte man nicht vergessen, dass die angezeigten Vorschläge nach dem Zufallsprinzip ausgewählt werden, egal ob sie auf Kategorien oder auf Tags beruhen.

könnteauchgefallen

Die Option “Single – Post Navigation” ermöglicht den Verweis auf den vorhergehenden oder den nachfolgenden Artikel (das einzige Kriterium, das an dieser Stelle berücksichtigt wird, ist das Datum der Publikation). Diese Navigationselemente können in der primären Widget-Spalte (“Sidebar Primary”), in der zweiten Widget-Spalte (“Sidebar Secondary”) oder unter dem Artikel (“Below content”) angezeigt werden. Ebenso kann diese Option unter “Disable” ausgeschaltet werden.

navigationselemente

Um das Lesen Ihres Wissenschaftsblogs so einfach wie möglich zu gestalten, bietet Hueman die Möglichkeit, drei verschiedene Navigationsmenüs einzufügen, in denen Kategorien und Seiten frei platziert werden können. Ebenso können Links auf externe Websites hinzugefügt werden. Wie für alle Themes auf Hypotheses, können die Menüs unter “Design > Menüs” konfiguriert werden.

  1. Wenn Sie bereits ein oder mehrere Menüs erstellt haben, so bleiben diese beim Wechsel auf Hueman erhalten. Sie sollten jedoch darauf achten, diese korrekt zu positionieren, in dem für jedes eine Platzierungsmöglichkeit bei Hueman ausgewählt wird:
    Zunächst muss das zu positionierende Menü im Backend ausgewählt werden (siehe Screenshot: blaue Umrandung).
  2. An dieser Stelle kann der Name des Menüs (nur im Backend sichtbar) verändert werden sowie die Menüstruktur (grüne Umrandung).
  3. Anschließend muss eine der drei Positionierungsmöglichkeiten ausgewählt und “Menü speichern” gewählt werden. Das gleiche Menü kann auch an verschiedenen Stellen angezeigt werden. Wenn ein Menü einer Position zugeteilt wird, die bereits ein Menü enthält, wird das ältere Menü ersetzt (gelbe Umrandung).
  4. Im Übrigen kann die Positionierung der Menüs auch unter “Positionen wählen” eingestellt werden (rote Umrandung).

positionen verwalten

Wenn die Position “Topbar” ausgewählt wird, wird dieses direkt über den Header und unter die Leiste von OpenEdition platziert. Diese Positionierung des Menüs bietet eine Suchfunktion auf dem Blog (indem auf die Lupe oben rechts geklickt wird). Das hat den Vorteil, dass das ausgewählte Menü immer im Bild bleibt, wenn nach unten gescrollt wird. Die Leser haben auf diese Weise immer unmittelbaren Zugang zum Menü, selbst wenn sie die älteren Artikelausschnitte auf der Blogstartseite lesen.

Die Position “Header” platziert das Menü unter den Header und über den Artikel bzw. über der Slideshow.

Die Position “Footer” lässt das Menü ganz unten auf Ihrem Blog auftauchen, unter der Fußzeile.

fusszeile1

fusszeile2

Achtung: Wenn zuvor Magazine Basic verwendet wurde, könnte der Eindruck entstehen, dass die Menüs während des Umzugs verloren gegangen sind. Allerdings erstellt Magazine Basic (ausgehend von den Seiten und Kategorien des Blogs) automatisch zwei Menüs, wobei es sich dabei um eine automatisch generierte Darstellung handelte, die Magazine Basic zu eigen war, ohne dass wirklich ein Menü unter “Design > Menüs” erstellt und einem Menü-Ort zugewiesen wurde. In diesem Fall, müssen die Menüs des Blogs neu erstellt werden, die alten sind nicht verloren gegangen, sondern wurden automatisch durch das Theme generiert.

Bei neuen Blogs, bei denen Hueman ausgewählt wurde, wird kein Menü automatisch erstellt. Unter “Design > Menüs” muss das Menü oder die Menüs, wenn Sie mehrere verwenden möchten, also erst konfiguriert werden. Dafür muss das Feld “Name des Menüs” ausgefüllt (der Name ist nur im Backend sichtbar) und unter “Menü erstellen” das Menü gespeichert werden. Anschließend können verschiedene Elemente (Seiten, Links, Kategorien) zum Menü hinzugefügt werden, indem diese aus der linken Spalte per drag&drop ausgewählt werden. Unter “Menü Einstellungen” kann die Positionierung des Menüs bestimmt werden (siehe oben für weitere Informationen).
Ein weiteres Menü kann unter “Erstelle ein neues Menü” (unter den Reitern “Menüs bearbeiten” und “Positionen verwalten”) erstellt werden.

5. Position der Widgets: die Qual der Wahl

Hueman bietet drei verschiedenen Bereiche, in denen Widgets eingefügt werden können: zwei Seitenspalten an beliebiger Position (ein oder zwei Spalten rechts oder links neben der Blogartikelspalte) und eine weitere in der Fußzeile des Blogs, dort stehen bis zu vier Spalten  zur Verfügung, um die Widgets anzuzeigen.

widgets

footer

Unter „Design > Theme Options > Footer“ können die Widgets in der Fußzeile aktiviert und die favorisierte Option der Darstellung ausgewählt werden.

footer widget columns

Unter „Design >Theme Options > Layout“ kann die Darstellung der Spalten an den Rändern des Blogs für die verschiedenen Blogseiten (Startseite, Kategorienseiten, Archive etc.) gewählt werden. Wenn die Darstellung überall gleich sein soll, muss „Global Layout“ ausgewählt werden:

globallayout

Das Blog kann mit unterschiedlichen Widget-Spalten (“Sidebars”) noch weiter konfiguriert werden, sodass letztere nur an bestimmten Stellen im Blog (Startseite, Kategorieseiten, Archive etc.) angezeigt werden. Diese Einstellungen können im Menü unter „Design >Theme Options > Sidebars“ vorgenommen werden, indem die Funktion „Edit“ (rote Umrandung) unter „Create Sidebars“ genutzt wird.

createsidebar

Sobald eine Spalte mit einer eindeutigen Bezeichnung unter “Sidebar ID” und einem frei wählbaren Titel (grüne Umrandung) erstellt wurde, muss sie mit “Add New” (blaue Umrandung) hinzugefügt und die Änderungen mit „Save Changes“ gespeichert werden.

Im gleichen Fenster unten können Sie nun die Seiten in Ihrem Blog (Startseite, Beitragsseite etc.) wählen, in dem die Sidebar angezeigt werden soll. Die verschiedenen Seiten Ihres Blogs sind vordefiniert und für jede von ihnen können Sie bis zu zwei Spalten mit unterschiedlichen Widgets auswählen. Wenn Sie keine  Sidebar auswählen, werden standardmäßig die „Primary“ und „Secondary Sidebars“ Ihres Blogs verwendet.

Die unterschiedlichen möglichen Seiten Ihres Blogs, die über verschiedene Sidebars verfügen können, finden Sie in den Menüs „Design >Theme Options > Layout“ und „Design >Theme Options > Sidebars“ :

  • Home: die Startseite Ihres Blogs
  • Single: eine Seite mit einem einzelnen Blogbeitrag
  • Archive: Beiträge, die erscheinen, wenn jemand in Ihrem Blog das Archiv eines Monats über des Archiv-Widget aufruft.
  • Archive – Category: Die Benennung dieses Seitenabschnitts kann irreführend sein. Es handelt sich hier nicht um das gesamte Archiv, sondern um das Archiv einer Kategorie, die Sie für bestimmte Blogbeiträge verwendet haben.
  • Search: die Seite, mit den Suchergebnissen
  • Error 404: Diese Seite erscheint, wenn z.B. ein fehlerhafter Link angeklickt wird. Es kann nützlich sein, hier eine Sidebar mit Inhalten, die die Navigation im Blog unterstützen, zu nutzen und die damit Ihren Lesern hilft, das zu finden, was sie ursprünglich gesucht haben.
  • Default Page: diese Seite steht für alle Seiten in Ihrem Blog, die nicht bereits in dieser Liste angesprochenen sind. Die Einstellungen der Spalten auf dieser Seite werden überall dort in Ihrem Blog angezeigt, wo es sich nicht um die oben genannten Seiten handelt.

Unabhängig von diesen Einstellungen können Sie auch für jeden Beitrag eine eigene Darstellung der Spalten mit den Widgets auswählen (“Primary Sidebar” und “Secondary Sidebar”). Um dies für den jeweiligen Beitrag zu machen, klicken Sie auf “Post Options” im Bearbeitungsbereich Ihres Beitrags.

postoptions

Sie werden bemerken, dass in der Kopfzeile immer “Explorer” und “Folgen Sie uns” angezeigt wird, unabhängig davon, welche Spalte mit Widgets Sie verwenden. Im letzteren werden Links hinterlegt, die zu Ihren Auftritten in den Sozialen Medien führen. Die Links dazu können über das Menü “Design >Theme Options > Social Links” anpassen (die Links zu den Sozialen Netzwerken erscheinen auch in der Fußzeile Ihres Blogs).

Wenn Sie nicht möchten, dass in der Kopfzeile “Explorer” und “Folgen Sie uns” angezeigt wird, klicken Sie im Menü “Design >Theme Options > Layout” und klicken Sie bei “Sidebar Top Boxes” auf “off”.

Wenn Sie die unterschiedlichen Spalten erstellt und nach Ihren Wünschen positioniert haben, wählen Sie die Widgets aus, die in den Spalten angezeigt werden sollen. Dies machen Sie wie gewohnt im Menü “Design > Widgets”.

Auf der linken Seite finden Sie alle verfügbaren Widgets, die Sie an die verschiedenen Stellen auf der rechten Seite ziehen können. Die Anordnungen entsprechen Ihren verschiedenen Widget-Spalten und dem Widget-Bereich in Ihrer Fußzeile. Die Fußzeilen-Widgets werden nur dann angezeigt, wenn sie diese auch in den Optionen aktiviert haben.

footer3

6. Widgets: einige Neuheiten

Unter „Design > Widgets“ befinden sich alle verfügbaren Widgets, die im Blog aktiviert und in verschiedenen Widgetzonen positioniert werden können. Zusätzlich zu den klassischen Hypotheses-Widgets gibt es bei Hueman einige neue Möglichkeiten:

AIxPosts ermöglicht eine sehr schöne Darstellung verschiedener Artikel des Blogs. Im Feld „Title“ kann dem Widget eine eigene Überschrift gegeben werden. Dabei kann man sich aussuchen, ob die Artikel mit oder ohne Vorschaubild dargestellt werden sollen, indem „Show thumbnails“ aktiviert bzw. deaktiviert wird. Außerdem kann festgelegt werden, welche Artikel angezeigt werden sollen, beispielsweise nur die Artikel einer bestimmten Kategorie oder alle publizierten Artikel. Die Reihenfolge dieser Artikel kann ebenfalls angepasst werden, beispielsweise nach dem Publikationsdatum, der Anzahl der Kommentare oder nach einer zufälligen Auswahl. Der Unterpunkt „Posts from“ ermöglicht es, nur Artikel aus einem bestimmten Zeitraum anzuzeigen. Darüber hinaus können zusätzliche Informationen im Widget ein- bzw. ausgeblendet werden, beispielsweise die Kategorie des Artikels und das Publikationsdatum, jeweils durch Ankreuzen der Felder „Show categories“ und „Show dates“.

showdates1showdates2

AlxVideo bietet eine einfache Möglichkeit, ein Video auf dem Blog zu zeigen, indem entweder die URL oder der “Embed code” eingefügt wird.

AlxVideo

alxvideo2

Ein weiteres interessantes Widget ist AlxTabs und besteht aus bis zu vier Reitern:

  • Der Reiter “Recent Posts” zeigt die zuletzt publizierten Artikel des Blogs an. Wird “Show thumbnails” ausgewählt, wird zudem das Artikelbild angezeigt, sofern eines eingestellt wurde. Unter “Items to show” kann die Anzahl der angezeigten Artikel festgelegt werden. Mit dem Dropdown-Menü “Category” kann ausgewählt werden, ob die zuletzt publizierten Artikel aus allen Kategorien (indem “All” ausgewählt wird) oder ob lediglich Artikel aus einer bestimmten Kategorie angezeigt werden sollen. Soll der Reiter “Recent Posts” im Widget AlxTabs nicht angezeigt werden, muss die Auswahl “Enable recent posts” aufgehoben werden.
  • Der Reiter “Most Popular” zeigt die “beliebtesten” Blogartikel des Blogs an. Diese Auswahl beruht auf der Anzahl der Kommentare unter den jeweiligen Artikeln. Die Einstellungen für diesen Reiter entsprechen denen unter “Recent Posts”. Auch hier: Soll der Reiter “Most Popular” nicht angezeigt werden, muss die Auswahl “Enable most popular posts” aufgehoben werden.
  • Der Reister “Recent Comments”, der ebenfalls durch Aufheben der Auswahl bei “Enable recent comments” verborgen werden kann, zeigt die letzten Kommentare auf dem Blog an. Die Profilbilder der Verfasser der Kommentare können wahlweise angezeigt werden, indem “Show avatars” angekreuzt wird. Auch kann die Anzahl der angezeigten Kommentare unter “Items to show” bestimmt werden.
  • Der letzte Reiter, “Tag”, zeigt die Schlagworte der verschiedenen Blogartikel an. Indem die Auswahl “Enable tags” aufgehoben wird, kann dieser Reiter verborgen werden.
    Der Abschnitt “Tab Order” ermöglicht das Neuordnen der vier Reiter, indem ihnen die Zahlen 1 bis 4 zugeordnet werden, wobei derjenige mit der 1 als erstes angezeigt wird.

Im Abschnitt “Tab Infos” kann schließlich bestimmt werden, ob die Kategorien und/oder das Publikationsdatum der Artikel unter den Reitern “Recent Posts” und “Most Popular” angezeigt werden sollen.

tagcloud

Nun steht der Einrichtung des Blogs mit Hueman nichts mehr im Weg. Sollten noch Unsicherheiten bestehen, kann das interaktive Tutorial helfen. Und falls weitere Fragen auftauchen, kann man sich an die Community der Bloggenden wenden (deutschsprachige-blogs [at] groups.openedition.org), die gerne untereinander Erfahrungen mit dem neuen Theme austauscht. Wenn Sie noch nicht bei der Mailingliste abonniert sind, melden Sie sich einfach bei blogs [at] maxweberstiftung.de.

Viel Erfolg beim Umstieg und bis bald bei Hypotheses!

_______________________

Abbildung: ripples von Dick Pountain, Lizenz CC BY-NC-SA 2.0


Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.