Anwendung

Das Template ist genau wie die meisten anderen Templates – nach „Download“ und Ablage im Templateordner – sofort einsatzbereit. Willst du es in der Form wie hier verwenden, musst du nichts weiter tun, als es zu aktivieren, das Logo im Header auszutauschen und deine Inhalte einzufügen.

Das Template ist ausschließlich für Seiten auf Menülevel 1 vorbereitet. Untere Level werden einfach nicht angezeigt, können allerdings für die Verwendung in Plugins (z.B. acDIVs) angelegt und verwendet werden.

Theoretisch wären durchaus mehrere Menü-Ebenen möglich. Dann musst du aber noch irgendwo ein Menü für die tieferen Level hinbauen. Im vorliegenden Template habe ich darauf verzichtet. Grund: Durch das Menü (rechts) sind tiefe Strukturierungen innerhalb einer Seite auf Desktop-Rechnern gut möglich. Auf mobilen Geräten mit kleineren Viewports gibt es (fast) immer Touch-Support, sodass man schön zügig nach oben und unten wischen kann – auch ohne Menü.

Voraussetzungen

  • CMSimple_XH ab Version 1.7.0
  • korrekte Überschriften-Struktur[1]
  • aktueller Browser
  • Plugin: jQuery for CMSimple[2]
  • Plugin: Fa_XH[3]

[1] Für das korrekte Funktionieren des Anchorific-Menüs ist es wichtig, dass die Überschriften in richtiger Reihenfolge angeordnet sind (Seitenstruktur). Was passiert, wenn das nicht der Fall ist, kannst du auf der Seite FALSCH sehen.

[2] jQuery wird mit CMSimple_XH ausgeliefert. Es wird durch das Template aktiviert.

[3] Fa_XH wird mit CMSimple_XH ausgeliefert. Es wird durch das Template aktiviert. Damit es in der Druckansicht ebenfalls wirksam ist, muss in der Plugin-Konfiguration  Require Auto angehakt werden.

 

Menü-Optionen

In der Datei „template.htm“ findest du (ziemlich weit unten) individuelle Einstellmöglichkeiten für das Anchorific-Menü. Das Aussehen des zusätzlichen Menüs kannst du überwiegend in der Datei „anchorific.css“ (bzw. „anchorific.min.css“) beeinflussen.

Typografie

Schriften

Im Template „fhs-anchorific-pure“ sind folgende Schriftarten enthalten:
„Droid-Serif“ für den Fließtext und „PTsans-Narrow“ für die Überschriften und Menüs.

Vielleicht ist es dir schon aufgefallen: Auf dieser Site wird kursiver Text tatsächlich in einem kursiven Schrift-Schnitt (italic) dargestellt – und nicht, wie (früher) im Netz oder in diversen Textprogrammen – einfach schräg verbogen. Auch für fett (bold) ist ein extra-Schriftschnitt vorhanden.

Im Normalfall kannst du im Editor einfach auf die entsprechenden Symbole klicken – das Thema erledigt sich von selbst. Es sei denn, du willst neuen Elementen diese Eigenschaften per CSS zuweisen, dann musst du explizit auch den Schnitt dazu festlegen.

Tipps

Wie immer gibt es hier noch ein paar kleine Extra-Tipps am Rande, die nicht unbedingt zum Template gehören. Ich nutze sie gleich um Listen zu testen.

  • Achte auf korrekte Anführungszeichen, je nachdem für welches Land/ welche Sprache du schreibst. Im BRD-Deutschen sind es meist diese: „“ (genannt Gänsefüßchen: vorne 99 und hinten 66) oder auch diese: »« (genannt umgekehrte Guillemets, nicht Guillemots wie es z.B. Adobe fälschlich tut). In der Schweiz werden zumeist diese «» verwendet (ebenfalls Guillemets, aber Chevrons genannt). Ziemlich verwirrend das Ganze.
    Die im Netz oft verwendeten geraden Dinger "" sind zwar gut auf der Tastatur erreichbar, sind allerdings eigentlich Zoll-Zeichen. Kann man mögen, muss es aber nicht.* Versuche innerhalb einer Publikation strikt nur einen Typ zu verwenden. Niemals mischen.
  • Die drei Punkte … sind ein echtes einzelnes Satzzeichen und heißen richtig Auslassungspunkte. Du kannst dieses Zeichen im Editor unter Sonderzeichen finden (im Tinymce das Omega-Symbol Ω). Du schreibst somit nicht nur richtig, sondern verhinderst auch eine mögliche Trennung bei einem Zeilenumbruch.
  • Versuche Deppenapostrophe zu vermeiden. Keine Macht dem Deppenapostroph! (Ich bin nicht davor gefeit! Siehe unten.)

* Eine kleine Erweiterung für den Tinymce4, um die deutschen Anführungszeichen mit einem Klick zu setzen, gibt es unter „Download“.
Das ZIP entpacken und die darin enthaltenen Dateien entsprechend der Ordnerstruktur in den Pluginordner „tinymce4“ kopieren.
Danach in der Konfiguration von Tinymce4 unter Init: „fontawesome-quotes“ wählen – Fertig.
Nun kannst du im Editor einen Textabschnitt markieren und auf den neuen Button „“ klicken. Der markierte Text erhält automatisch die korrekten Anführungszeichen.
Du kannst übrigens zwischen den beiden deutschen und den schweizerischen Anführungszeichen wählen. Aber bitte: Innerhalb einer Publikation immer nur eine Sorte. ;-)

Einige Tests zur Demonstration

Hi_Fancybox

cherry-thumb.png

Hi Holger, da ich ja nun schon mal dabei bin, kann ich die neueste (Update: nicht mehr ganz so neue) Fancybox auch gleich mal hier im Zusammenspiel mit den anderen Scripts (Skripten) testen.

Mich deucht, es funktioniert.

„Dabinschabborfrooo“  – würden jetzt sicher einige Leute aus meiner Location sagen.

Blindtext zum Auffüllen der Seite, damit ich endlich unter’s Bild komme …

(„unter’s“ hat hier, glaube ich, (k)einen Deppenapostroph – oder?) ;-)))

Interne Links

Wie du hier auf dieser Seite schon sehen kannst, gibt es Probleme mit händisch gesetzen internen Ankerzielen (Link oben unter Tipps, Linkziel unter Hi-Fancybox).

Das ist ein Javascript/jQuery-Problem, bei dessen Lösung ich auf eure Mithilfe hoffe.

Gelöst! Dank an lck.

無為 / 无为

Das ist ein Test mit chinesischen Schriftzeichen. Ich weiß nicht, was da steht. Wikipedia sagt: „wu wei“ in zwei verschiedenen Dialekten. Lässt man es mit Google übersetzten, heißt es „Tatenlosigkeit“ – ich verstehe die Bedeutung eher so: „verändern ohne einzugreifen“.

Mal sehen, was passiert.

Ergebnis:
Die chinesische Überschrift kann nicht angesprungen werden.

Gelöst! Dank an Holger.

Александр Солженицын

Das ist ein Test mit russischen (kyrillischen) Buchstaben. Hier weiß ich, dass es Alexander Solschenizyn heißt.

Schaunmermal.

Ergebnis:
Klappt. Aber nur, wenn nur eine kyrillische Überschrift vorhanden ist.
Bei mehreren geht es nicht mehr.

 Gelöst! Dank an Holger.

Update: Im neuen Template ist eine erweiterte Version des PTsans-Narrow-Zeichensatzes enthalten, sodass auch die kyrillischen Zeichen korrekt dargestellt werden.

еще один тест <h4>

Das heißt: Jetzt noch ein Test.