SlideShare a Scribd company logo
1 of 117
Download to read offline
Joomla! Template JSN Epic
                    Konfigurationshandbuch
                                        (für JSN Epic 4.x)




Diese Dokumentation ist unter Creative Commons Attribution-Non-Commercial-Share Alike 3.0 Unported
       Licence freigegeben. Es ist erlaubt für den freien Gebrauch auszudrucken und zu benutzen.
                       Copyright © 2008 - 2012 http://www.joomlashine.com
Joomla! template JSN Tendo Konfigurationshandbuch ©
                                       Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                                     Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine

Inhaltsverzeichnis
Joomla! Template JSN Epic Konfigurationshandbuch ................................................................................. 1
  Inhaltsverzeichnis ................................................................................................................................................................2
  Einleitung ...............................................................................................................................................................................3
  Wichtige Funktionsüberblick ............................................................................................................................................4
  Erste Schritte.......................................................................................................................................................................16
  Favicon-Konfiguration ......................................................................................................................................................22
  Logo.......................................................................................................................................................................................24
  Layout....................................................................................................................................................................................26
  Farbvariationen...................................................................................................................................................................34
  Menüs ....................................................................................................................................................................................38
  Schriftarten ..........................................................................................................................................................................59
  Module...................................................................................................................................................................................66
  Typografie ............................................................................................................................................................................69
  Seitenwerkzeuge ................................................................................................................................................................89
  SEO & System.....................................................................................................................................................................91
  Mobile Edition ...................................................................................................................................................................103
  Multilinguale Unterstützung ..........................................................................................................................................111
  Was kommt als Nächstes? ............................................................................................................................................117




                                                                                             2
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine

Einleitung




Vielen Dank für Ihr Interesse am JSN Epic Template. Wir begrüßen Ihre Entscheidung und hoffen natürlich, dass
unser Produkt Sie in Sachen Website und Business bereichern wird.
Damit Sie möglichst schnell und effizient den Umgang mit Templates erlernen, empfehlen wir Ihnen die Anleitung
in der folgenden Reihenfolge systematisch abzuhandeln:
   1. JSN Epic Schnellstart Video – ein kurzes Video-Tutorial, welches Ihnen auf dem schnellsten Wege einen
      wichtigen Überblick über das JSN Epic Template verschafft. Klicken Sie hier, um zum Video-Tutorial zu
      gelangen.
   2. JSN Epic Konfigurationshandbuch – Hier erfahren Sie ausführliche Informationen über jedes
      Funktionstemplate und wie Sie diese in Ihre eigene Webseite einbauen können.
   3. JSN Epic Anpassungshandbuch– Hier erfahren Sie, wie Sie die verschiedenen Templates an Ihren
      Bedürfnissen anpassen können.
Sie können auch jederzeit alle Dokumente ausdrucken, um ein komfortables Lesen zu gewährleisten.

Achtung!
Funktionen, die mit    gekennzeichnet sind, können NUR in der JSN Epic PRO Edition verwendet werden
und sind NICHT in der Free Edition vorhanden.
Los geht’s!




                                                      3
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Wichtige Funktionsüberblick

Separate Produktversionen für Joomla! 1.7/2.5 und 1.5




Sämtliche JoomlaShine-Produkte sind in zwei separaten Versionen lieferbar – und mit Joomla! 1.7/2.5 und 1.5
kompatibel!




Im Kundenbereich können Sie die Installationsdatei für die entsprechende Joomla!-Version herunterladen.




                                                       4
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Mobile Edition
Alle Templates auf JoomlaShine.com besitzen eine integrierte Edition, die speziell auf moderne Mobilgeräte wie
z.B. iPhone oder auf android- und windowsbasierte Mobilgeräte ausgerichtet ist. Im Gegensatz zu anderen
Template-Anbietern, entwickeln wir keine mobilen Anwendungen, die durch komplizierte Menügestaltung schwer
zu handhaben sind. Wir haben nämlich eine kompakte und leichte Template-Version erstellt, um eine möglichst
originale Optik sowie Haptik beizubehalten.




              Kopfzeile und Top Content                                       Main Body




                                                      5
Joomla! template JSN Tendo Konfigurationshandbuch ©
                       Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                     Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine




                   Bottom Content                                    Mobilmenü und Fußzeile
Die darüberliegenden Screenshots wurden von einem iPhone 4S aufgenommen, jedoch lässt sich die mobile
Edition auch auf allen anderen modernen Großbildgeräten, basierend auf Android und Windows mobile,
einwandfrei anzeigen.




                                                     6
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
CSS/JS-Komprimierung
Auf JoomlaShine.com, haben wir uns stets um eine Optimierung unserer Templates mit verschiedenen Techniken
wie Image Sprites-Anwendungen, einer saubereren HTML-Code-Programmierung bemüht – neu hinzu kommt die
CSS/JS-Komprimierung
Diese kombiniert alle CSS/JS-Dateien zu einer einzigen Datei, die in gzip-komprimierter Form an den Browser
gesendet wird.




                                 Vor der Freigabe der CSS/JS-Komprimierung




                                Nach der Freigabe der CSS/JS-Komprimierung


                                                      7
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Diese Funktion reduziert erheblich die Anzahl der Serveranfragen sowie die Gesamtladegröße, was in diesem Fall
einer Leistungssteigerung von 35% entspricht.
Für weitere Informationen, lesen Sie bitte den Abschnitt CSS/JS-Komprimierung in diesem Handbuch.




                                                       8
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
UniIcons
JSN Epic ist mit 20 sorgfältig ausgewählten Icons bereitgestellt, die für vielerlei Zwecke eingesetzt werden
können. Dieses Konzept nennen wir UniIcons.

      - “article”                  - “download”                  - “info”                 - “selection”

      - “calendar”                 - “folder”                    - “mail”                 - “settings”

      - “cart”                     - “help”                      - “online”               - “star”

      - “comment”                  - “home”                      - “rss”                  - “statistics”

      - “display”                  - “image”                     - “search”               - “user”
Hier sehen Sie einige Beispiele, in denen Icons besonders effektiv und anschaulich verwendet wurden.




                                         UniIcons an Menügegenständen




                                                UniIcons an Links




                                                        9
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine




             UniIcons an Modulkopfzeilen                            UniIcons an Listengegenständen


Mehrere Icons, ein Bild
JSN Epic verwendet die Image Sprite CSS-Technik, um die Zahl an Serveranfragen zu reduzieren. Technisch
gesehen, werden alle Icons zu einer einzelnen Bilddatei zusammengeführt, wodurch es nun möglich ist, mit einer
Serveranfrage alle Icons zu erhalten. Wenn Sie Näheres zu diesem Themengebiet wissen möchten, hier weitere
Informationen über CSS Sprites.




                                                      10
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Native RTL Unterstützung




                                        Rechts-Links JSN Epic-Layout
Jede JoomlaShine-Template ist mit einer nativen RTL-Unterstützung ausgestattet. Dafür haben wir eine Menge
an Zeit investiert, die wir damit verbracht haben jedes noch so kleine Detail zu optimieren, damit es im RTL-
Modus eine besonders große Wirkung erzielt. Alles ist horizontal gedreht einschließlich der Klappmenüs von
Haupt- und Seitenmenüs.
Um den RTL-Modus zu aktivieren, benötigen Sie hier keine zusätzlichen Template-Konfigurationen. Geben Sie
dafür lediglich die RTL-Sprache in die Joomla!-Verwaltung ein – unser Template wird dies automatisch erkennen.




                                                      11
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Multilinguale Unterstützung
In den JoomlaShine.com-Templates wird der gesamte Text des Backend und Frontend zu Sprachdateien geleitet,
wodurch eine Übersetzung in jede beliebige Sprache möglich ist. Derzeit unterstützen unsere Templates 12
Primärsprachen, wobei weitere in Zukunft hinzukommen werden.




                                                   Englisch




                                                    Deutsch
Für weitere Informationen über unterstützte Sprachen, lesen Sie bitte den Abschnitt Multilinguale Unterstützung
in diesem Handbuch.




                                                      12
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Flash-Galerie
Ein weiteres Produkt von JoomlaShine.com ist die Flash-Galerie, die Sie auf unserer Demo-Webseite sehen - JSN
ImageShow. Dieses Produkt ist mit einer Komponente, mit einem Modul und einem Inhalts-Plugin, sodass Sie
Ihre Galerie überall und auf jeder Webseite präsentieren können. Mit Flash-Technologie angewandt, versichern wir
Ihnen, dass die Galerie auf allen Browsern konsistent angezeigt wird.
JSN ImageShow ist NICHT im Template-Paket enthalten, jedoch steht es kostenlos als Download zur Verfügung.
Lernen Sie mehr über JSN ImageShow.

Modulpräsentation
Hier sehen Sie, wie JSN ImageShow als Slideshow-Modul in der promo-Position dargestellt wird.




                                     JSN ImageShow als Slideshow-Modul




                                                      13
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Pluginpräsentation
Hier wiederum sehen Sie, wie JSN ImageShow als vollfunktionsfähige Galerie einschließlich Miniaturansichten
angezeigt wird.




                              JSN ImageShow als Galerie im Main Body Content




                                                     14
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Mobile Optimierung
Für Mobilgeräte, haben wir eine extra leichte JavaScript-Version entwickelt – ideal für Bildpräsentationen.




                    Mobil optimierte Präsentation (Screenshot mit iPhone 3GS aufgenommen)




                                                        15
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Erste Schritte

Template-Installation
Laden Sie sich die Template-Installationsdatei jsn_epic_XXX_jY.Y_Z.Z.Z.zip herunter, wobei:

      XXX die Template-Edition ist. Sie haben die Auswahl zwischen free und pro.

      Y.Y die von Templates unterstützte Joomla-Version ist. Verfügbar sind die Versionen 1.5 und 1.7/2.5.

      Z.Z.Z die Template-Version ist.
Es handelt sich hierbei um eine Standardinstallationsdatei, die wie üblich in der Joomla!-Verwaltung installiert
wird. Zur Erinnerung, hier die wichtigsten Schritte:
Für Joomla! 1.7/2.5:
   1. In der Joomla!-Verwaltung, gehen Sie zum Menü Erweiterungen -> Erweiterungen.
   2. Wenn Sie bei den Erweiterungen sind, klicken Sie auf Durchsuchen und wählen die Installationsdatei
      jsn_epic_XXX_jY.Y_4.Z.Z.zip aus. Anschließend klicken Sie auf Hochladen & Installieren.
   3. Die Installationsdatei wird daraufhin auf ihrem Server hochgeladen und in Joomla! installiert.
   4. Setzen Sie die Template-Einstellungen auf Standard und gehen Sie danach zum Menü Erweiterungen ->
      Templates.
Für Joomla! 1.5:
   1. In der Joomla!-Verwaltung, gehen Sie zum Menü Erweiterungen -> Installieren/Deinstallieren.
   2. Wenn Sie bei den Erweiterungen sind, klicken Sie auf Durchsuchen und wählen die Installationsdatei
      jsn_epic_XXX_jY.Y_4.Z.Z.zip aus. Anschließend klicken Sie auf Hochladen & Installieren.
   3. Die Installationsdatei wird daraufhin auf ihrem Server hochgeladen und in Joomla! installiert.
   4. Setzen Sie die Template-Einstellungen auf Standard und gehen Sie danach zum Menü Erweiterungen ->
      Templates.




                                                         16
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Template-Parameter




                                   Template-Parameter in Bereiche geordnet
Alle JoomlaShine-Templates können mühelos durch Template-Parameter eingestellt werden. In der Template-
Konfiguration finden Sie insgesamt 55 Template-Parameter, die nach logischen Gruppen für das praktische
Arbeiten arrangiert sind.
Um Zugang zur Konfiguration zu erhalten, befolgen Sie bitte die folgenden Schritte:
Für Joomla! 1.7/2.5:
   1. Zu den Templates gelangen Sie, indem Sie ins Menü Erweiterungen -> Templates gehen.
   2. Klicken Sie auf den Template-Namen JSN_Epic_XXX. Hierbei bezieht sich XXX auf Ihre entsprechende
      Template-Edition.
   3. Bei der Template Bearbeitung, finden Sie eine Liste mit Template-Parametern im Abschnitt Parameter.
   4. Klicken Sie auf Speichern oder Speichern & Schließen, um Ihre Einstellungen zu speichern.
Für Joomla! 1.5:
   1. Zu den Templates gelangen Sie, indem Sie ins Menü Erweiterungen -> Templates gehen.
   2. Klicken Sie auf den Template-Namen JSN_Epic_XXX. Hierbei bezieht sich XXX auf Ihre entsprechende
      Template-Edition.
   3. Bei der Template Bearbeitung, finden Sie eine Liste mit Template-Parametern im Abschnitt Parameter.

                                                       17
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
   4. Klicken Sie auf Speichern oder Anwenden, um Ihre Einstellungen zu speichern.

Template Informationen und automatische Update Benachrichtigungen




Der erste Parameterabschnitt ist INFORMATIONEN, wo sich die wichtigsten Informationen über die aktuelle
Template-Version befinden. Da wir unsere Templates als Software verstehen, ist eine kontinuierliche Verbesserung
unerlässlich. Achten Sie deshalb bitte immer darauf, dass Sie die aktuelle Version benutzen.
Zusätzlich finden Sie in diesem Abschnitt relevante Informationen zu Autor und Copyright.




                                                      18
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Seit JSN Epic Version 4.3.0 prüft der Template automatisch nach den spätesten verfügbaren Download. Klicken
Sie auf dem Link jetzt Updaten. Danach erscheint ein neues Fenster auf Ihren Webbrowser.
Der erste Schritt, loggen Sie sich mit Ihren JoomlaShine Benutzerdaten ein. Der zweite Schritt, loggen Sie sich mit
dem Super Admin Benutzerkonto auf Ihre Webseite ein. Danach klicken Sie auf den Knopf Update template.
Somit wird Ihre Template automatisch auf dem neusten Stand aktualisiert.




Der Upgrade Prozess dauert etwa eine Minute, danach erscheint eine Fenster mit erfolgreichem Upgrade in Ihrem
Webbrowser.
Bitte beachten Sie dass bei angepassten CSS auf dem originalen Template die Veränderungen vollständig
überschrieben werden. Machen Sie ein Backup der CSS-Datei bevor Sie mit dem Upgrade Prozess beginnen.


                                                        19
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Installation von Beispieldateien




Sämtliche Templates von JoomlaShine besitzen die einzigartige Funktion, Beispieldateien zu installieren, wodurch
Ihre Muster-Webseite genauso aussieht wie auf der Template-Demo-Webseite. Im Gegensatz zu anderen
Template-Anbietern, die ein umfangreiches Paket mit allen Dateien und der Datenbank der Demo-Webseite
liefern, geben wir Ihnen nur einen einzigen Installationslink der direkt auf Ihre aktuelle Webseite installiert.
Damit Sie Probedateien installieren können, müssen Sie bitte Folgendes tun:
   1. Als Erstes gehen Sie zur Template-Konfiguration, öffnen den Abschnitt BEISPIELDATEIEN und klicken
      auf Beispieldateien installieren.
   2. Anschließend befolgen Sie auf der Seite JSN Epic Beispieldateien Installation die
      Bildschirmanweisungen, um den Prozess zu starten.
   3. Haben Sie alles richtig gemacht, dann werden Sie zur letzten Seite umgeleitet, von dort aus Sie nun auf
      folgende Optionen zurückgreifen können:

              Download backup file  Herunterladen der Backup-Datei des Originalinhaltes, der durch die
               Beispieldatei ersetzt wurde. Lesen Sie im nächsten Abschnitt mehr über den Umgang mit Backup-
               Dateien und die damit verbundene Wiederherstellung von Originaldateien.

              Return to template settings page  Zur Template-Konfiguration zurückkehren für weitere
               Konfigurationen.

              Go to website front-page  Zur Startseite gehen, um sicherzustellen, dass Ihre Muster-Webseite
               genauso wie die Demo-Webseite aussieht.




                                                       20
Joomla! template JSN Tendo Konfigurationshandbuch ©
                     Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                   Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Wiederherstellung von Originaldateien
Vor dem Installationsprozess der Beispieldatei werden von allen Originaldateien Ihrer Webseite Backups erstellt.
Die Backup-Datei befindet sich im Ordner /tmp im Joomla!-Hauptordner auf Ihrem Server. Technisch gesehen ist
dies eine zip-Datei, die eine gewöhnliche Textdatei mit SQL-Anweisungen für die Ausführung auf Ihrer Joomla!-
Datenbank enthält.
Die Wiederherstellung von Originaldateien erfolgt durch die Software phpMyAdmin 3.2.1.
   1. Melden Sie sich zuerst bei phpMyAdmin an und wählen Ihre Joomla!-Datenbank aus der linken Spalte.
   2. Wählen Sie als Nächstes Import auf der horizontalen Menüleiste.
   3. Klicken Sie auf Durchsuchen.. und wählen die Backup-Datei aus, die zip-komprimiert ist. Gehen Sie
      anschließend in der rechten Ecke der Seite auf Go.
Nach der Skript-Ausführung können Sie nun wieder auf Ihre Webseite gehen und stellen fest, dass die
Originaldateien wiederhergestellt wurden.




                                                       21
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Favicon-Konfiguration
Favicon ist ein kleines Icon, welches links von der Adresszeile Ihres Browsers positioniert ist. In Joomla! sieht das
Icon standardmäßig folgendermaßen aus:




                                             Standard Joomla!-Favicon
Natürlich kann es sein, dass Sie auf Ihrer Webseite Ihr eigenes Icon benutzen möchten, wie wir auch auf
joomlashine.com.




                                               JoomlaShine-Favicon
Dazu müssen Sie bitte folgende Schritte beachten:

Schritt 1: Entwerfen einer eigenen Favicon-Datei
Favicon ist technisch eine reguläre 16px * 16px-Icon-Datei mit Namen favicon.ico. In den meisten Fällen ist
Favicon eine verkleinerte Version des Firmenlogos, welches im Icon-Format abgespeichert ist. Teilweise sind
jedoch die Logos zu speziell, wodurch Favicon von Grund auf neu erstellt werden muss.
Dafür gibt es einige professionelle Editor-Software wie z.B. Axialis IconWorkshop und Iconcool Editor. Sie können
aber natürlich Online Favicon-Generatoren verwenden. Auf der einen Seite können Sie bei der ersten Methode
eine hochqualitative Qualität erwarten, was aber auch einiges an Arbeit verlangt. Auf der anderen Seite ist die
zweite Methode wesentlich einfacher, was sich jedoch in der Qualität entsprechend widerspiegelt.




                                                         22
Joomla! template JSN Tendo Konfigurationshandbuch ©
                      Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                   Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Schritt 2: Hochladen der Favion-Datei auf den Server
Nachdem Sie Ihre gewünschte Favicon-Datei haben, ist es an der Zeit diese auf Ihren Server hochzuladen. Dazu
müssen Sie die Standarddatei überschreiben, indem Sie die Icon-Datei auf Ihren Template-Ordner hochladen. Der
Ordner lautet joomla_root_folder/templates/jsn_epic_XXX/, wobei XXX Ihrer Template-Edition entspricht.
Falls Sie während des Gebrauchs mit FTP Schwierigkeiten mit Zugriffsberechtigungen haben, empfehlen wir
Ihnen Joomla!-Erweiterung JoomlaXplorer. Damit bleibt Ihnen sämtliches Festlegen der Logobreite/-höhe erspart
– das Template wird so präsentiert, wie es selbst auch vorhanden ist.
Übrigens, falls Sie Ihr neues Icon nicht ausfindig machen können, dann heißt das nicht zwangsläufig, dass Sie
etwas falsch gemacht haben. Browser sind so ausgelegt, dass sie den Datenverkehr so gering wie möglich halten,
d.h. jedes Mal wenn eine Seite angezeigt wird, wird das Favicon nicht immer aktualisiert. Auch das erneute
Aktualisieren der Seite (F5) wird nichts bringen. Sie müssen deshalb also gründlicher an die Sache herangehen:

      Mozilla / Firefox / Safari: Halten Sie Shift gedrückt während Sie auf Aktualisieren klicken oder drücken
       Sie Strg-Shift-R (Cmd-Shift-R auf Apple Mac).

      Internet Explorer: Halten Sie Strg gedrückt während Sie auf Aktualisieren klicken oder drücken Sie Strg-
       F5.

      Konqueror: Klicken Sie auf Aktualisieren oder drücken Sie F5.

      Opera: Nutzer müssen eventuell ihren Cache komplette löschen; gehen Sie hierfür zu Werkzeuge ->
       Einstellungen.

      Chrome: Drücken Sie Shift-F5.
Passiert dann immer noch nichts, dann empfiehlt es sich, die temporären Internetdateien sowie den Verlauf zu
löschen. Öffnen Sie Ihre Seite anschließend erneut.




                                                       23
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Logo




Das Logo JSN Epic ist ein Standardmusterlogo, welches Sie mit Ihrem eigenen Logo ersetzen. Das Logo ist
eigentlich eine Bilddatei namens logo.png , welches der Ordner
joomla_root_ordner/templates/jsn_epic_XXX/images/ beinhaltet. Hierbei bezieht sich XXX auf Ihre
entsprechende Template-Edition.
Ihre Logo-Datei können Sie manuell durch den Template-Parameter Logo File auswählen. Hinzukommt, dass das
Festlegen der jeweiligen Logobreite/-höhe völlig entfällt, da das Template in seiner tatsächlichen Form angezeigt
wird.
Wenn die Logo-Datei bereit ist, sind folgende Parametereinstellungen möglich:

      Logo Verknüpfung – Legen Sie die URL fest, auf die das Logobild verlinken soll. Sie können dies hier
       festlegen:

              Absoluter Link wie http://www.joomlashine.com

              Relativer Link vom Joomla!-Hauptordner wie index.php
       Lassen Sie diesen Parameter frei, falls Sie nicht möchten, dass man überhaupt auf das Logo klicken kann.

      Logo Slogan – Fügen Sie den Slogan-Text in das Logobildattribut alt ein. Der Text im alt-Attribut ist für
       alle Screenreaders sichtbar (gut für die Zugänglichkeit) und Suchmaschinen (gut für SEO).

      Farbiges Logo aktivieren – Definieren Sie ein spezielles Farblogo für jede Template-Farbe. Die Farblogo-
       Datei befindet sich im Ordner images/colors/{farb_name}/.

Einrichten von rich-media-Logos durch Module in der logo-Position
JSN Epic stellt Ihnen eine Modulposition mit dem Namen logo bereit, wo Sie jedes benutzerdefiniertes HTML-
Modul mit einem rich-media Logo hinzufügen können. Ein weiterer Vorteil besteht darin, dass Sie nun mehrere
Module mit verschiedenen Logos erstellen und diese in unterschiedlichen Seiten anzeigen lassenkönnen – mithilfe
der Funktion der Menümodulzuweisung in Joomla!.

Achtung!

                                                       24
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Falls das Template erkennt, dass einige Module in der logo-Position vorhanden sind, dann wird das Standardlogo
mit all ihren Logoparametern deaktiviert: Farbiges Logo aktivieren, Logo Verknüpfung und Logo Slogan.




                                                      25
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Layout

Modulpositionen
JSN Epic bietet insgesamt 36 Modulpositionen an und erlaubt Ihnen multiple Layouteinstellungen. Jede
Modulposition ist klappbar, d.h. unbenutzte Positionen erscheinen bezüglich benachbarter Module leer.




                                                      26
Joomla! template JSN Tendo Konfigurationshandbuch ©
  Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine




                              27
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Layoutdimensionen




JSN Epic erlaubt Ihnen die Veränderung der Breite von mehreren entscheidenden Layout-Elementen. Alle
Einstellungen erfolgen durch Template-Parameter im Abschnitt LAYOUT EINSTELLUNGEN.

Template-Breite
Die Template-Breite kann auf drei verschiedenen Möglichkeiten eingestellt werden:

Konfiguration der Template-Parameter (niedrigste Priorität)
                                    Die Breite des Templates kann durch den Parameter Template Breite
                                    eingestellt werden. Dabei stehen Ihnen drei Optionen zur Verfügung:

                                           Eng – Template-Breite (in Pixel) wird definiert durch den Parameter
                                            'Eng' Definition (px).

                                           Breit - Template-Breite (in Pixel) wird definiert durch den Parameter
                                            'Breit' Definition (px).

                                           Dynamisch - Template-Breite (in Prozent) wird definiert durch den
                                            Parameter 'Dynamisch' Definition (%).
                                    Dies ist die Standardeinstellung und hat die niedrigste Priorität.




                                                       28
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine

Konfiguration der Seitenklasse (hohe Priorität)
                                    Die Template-Breite kann durch die Seitenklasse eines Menü-Items mit der
                                    Syntax custom-width-xxx eingestellt werden, wobei xxx für den gewählten
                                    Breitenwert steht.
                                    Möglich sind die folgenden Werte: eng, breit und dynamisch.
                                    Beispiel:

                                           custom-width-float
                                    Diese Einstellung wird die Standardeinstellungen mithilfe des Template-
                                    Parameters Template Breite überschreiben.

Konfiguration des Seitenwerkzeugbereiches (höchste Priorität)
                                    Die Template-Breite kann durch den Seitenbreiten-Schalter aus dem
                                    Seitenwerkzeugbereich ausgewählt werden.
                                    Diese Einstellung wird vom Besucher besonders bevorzugt und hat demnach
                                    die höchstmögliche Priorität. Es überschreibt die Page Class sowie die
                                    Standardeinstellungen des Parameters Template Breite.


Promo-Links-Breite
Sie können die Breite der Modulposition promo-left auf zwei verschiedene Möglichkeiten einstellen:
   1. Durch den Template-Parameter Promo Links Breite. Dies ist die Standardeinstellung und hat die
      niedrigste Priorität.
   2. Durch Page Class eines Menü-Items mit der Syntax custom-promoleftwidth-xx; xx ist der gewünschte
      Breitenwert. Beispiel: custom-promoleftwidth-30
Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen
nicht.

Promo-Rechts-Breite
Sie können die Breite der Modulposition promo-right auf zwei verschiedene Möglichkeiten einstellen:
   1. Durch den Template-Parameter Promo Rechts Breite. Dies ist die Standardeinstellung und hat die
      niedrigste Priorität.



                                                      29
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                     Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
   2. Durch Seitenklasse eines Menü-Items mit der Syntax custom-promorightwidth-xx; xx ist der gewünschte
      Breitenwert. Beispiel: custom-promorightwidth-30
Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen
nicht.

Linke Spaltenbreite
Sie können die Breite der Modulposition left-column auf zwei verschiedene Möglichkeiten einstellen:
   1. Durch den Template-Parameter Linke Spaltenbreite. Dies ist die Standardeinstellung und hat die
      niedrigste Priorität.
   2. Durch Seitenklasse eines Menü-Items mit der Syntax custom-leftwidth-xx; xx ist der gewünschte
      Breitenwert. Beispiel: custom-leftwidth-30
Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen
nicht.

Rechte Spaltenbreite
Sie können die Breite der Modulposition right-column auf zwei verschiedene Möglichkeiten einstellen:
   1. Durch den Template-Parameter Rechte Spaltenbreite. Dies ist die Standardeinstellung und hat die
      niedrigste Priorität.
   2. Durch Page Class eines Menü-Items mit der Syntax custom-rightwidth-xx; xx ist der gewünschte
      Breitenwert. Beispiel: custom-rightwidth-30
Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen
nicht.

Innere-linke-Spaltenbreite
Sie können die Breite der Modulposition inner-left-column auf zwei verschiedene Möglichkeiten einstellen:
   1. Durch den Template-Parameter Innere linke Spaltenbreite. Dies ist die Standardeinstellung und hat die
      niedrigste Priorität.
   2. Durch Seitenklasse eines Menü-Items mit der Syntax custom-innerleftwidth-xx; xx ist der gewünschte
      Breitenwert. Beispiel: custom-innerleftwidth-30
Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen
nicht.




                                                      30
Joomla! template JSN Tendo Konfigurationshandbuch ©
                      Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                    Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Innere-rechte-Spaltenbreite
Sie können die Breite der Modulposition inner-right-column auf zwei verschiedene Möglichkeiten einstellen:
   1. Durch den Template-Parameter Innere rechte Spaltenbreite. Dies ist die Standardeinstellung und hat die
      niedrigste Priorität.
   2. Durch Seitenklasse eines Menü-Items mit der Syntax custom-innerrirghtwidth-xx; xx ist der gewünschte
      Breitenwert. Beispiel: custom-innerrightwidth-30
Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen
nicht.

“Main Body” auf der Startseite
Einige Webseiten verwenden keinen main body Inhaltsbereich auf der Startseite, sondern nur Module. Mit
diesem von JSN Epic entwickelten Parameter können Sie nun flexibel die Anzeige des main body kontrollieren.
Wählen Sie No, wenn Sie den main body nur auf Ihrer Homepage ausblenden möchten. Andernfalls wählen Sie
Yes, um diesen auf allen Seiten normal anzeigen zu lassen.

Gleiche Höhe
Mit dieser Funktion von JSN Epic erstellt man alle Module, innerhalb des horizontalen Layouts, die die gleiche
Höhe haben. Auch wenn dies ein sehr kreativer Fortschritt für das Template-Layout darstellt, unterstützt diese
Technik keine dynamischen Inhaltsmodule.




                 Vor der Freigabe der Funktion „Gleiche Höhe” in der content-bottom-Position




                                                      31
Joomla! template JSN Tendo Konfigurationshandbuch ©
       Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
     Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine




Nach der Freigabe der Funktion „Gleiche Höhe” in der content-bottom-Position




                                    32
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Haftpositionen
Das Template-Layout enthält 6 mögliche Haftpositionen: stick-lefttop, stick-leftmiddle, stick-leftbottom, stick-
righttop, stick-rightmiddle und stick-rightbottom. Sie können den genannten Positionen jegliche Module
zuweisen oder in ihnen benutzerdefinierte HTML-Module erstellen – alles dient lediglich einer besseren
Webseitenpräsentation. Wortwörtlich „haften“ die Module an Ihrem Layout, sodass, wenn Sie mit der Maus nach
oben bzw. nach unten scrollen, sich die zugewiesenden Module in die entsprechende Richtung bewegen.
Schauen wir doch mal, wie man ein benutzerdefiniertes HTML-Modul erstellt und dieses anschließend in die stick-
lefttop-Position platziert.
   1. Gehen Sie in der Joomla!-Verwaltung auf Erweiterungen -> Module
   2. Klicken Sie auf Neu und wählen Eigene HTML
   3. Füllen Sie die Einstellungsfelder aus:

              Titel: Mein Haftmodul

              Titel anzeigen: Verbergen

              Position: stick-lefttop

              Status: Freigegeben

              Benutzerdefinierte Ausgabe: *HTML-Code*
 Nun haben wir neue Module, die der Position stick-lefttop zugewiesen sind, erstellt. Sie können jetzt weitere
Module auf die restlichen Positionen festlegen: stick-leftmiddle, stick-leftbottom, stick-righttop, stick-
rightmiddle, stick-rightbottom.




                                                        33
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Farbvariationen

Template-Farbe
JSN Epic bietet insgesamt 6 Primärfarbvariationen zur Auswahl an. Jede Farbvariation bedeckt nicht nur den
Haupthintergrund, sondern füllt u.a. auch das Klappmenü, Links und den Tabellenkopf.
Alle verfügbaren Farben werden im Folgenden dargelegt:




                                                    Blau




                                                     Rot

                                                     34
Joomla! template JSN Tendo Konfigurationshandbuch ©
  Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine




                            Grün




                            Violett




                              35
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine




                                                   Orange




                                                    Grau
Die Template-Farbe kann auf drei verschiedenen Möglichkeiten eingestellt werden:




                                                      36
Joomla! template JSN Tendo Konfigurationshandbuch ©
                       Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                     Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Konfiguration der Template-Parameter (niedrigste Priorität)
                                   Die Template-Farbe kann durch den Template-Parameter Farbschema
                                   eingestellt werden.
                                   Dies ist die Standardeinstellung und hat die niedrigste Priorität.




Konfiguration der Seitenklasse (hohe Priorität)
                                   Die Template-Farbe kann durch die Seitenklasse eines Menü-Items mit der
                                   Syntax custom-color-xxx eingestellt werden, wobei xxx für die gewählte
                                   Farbe steht.
                                   Möglich sind die folgenden Werte: blue, red, green, violet, orange und
                                   grey.
                                   Beispiel:

                                         custom-color-red
                                   Diese Einstellung wird die Standardeinstellungen mithilfe des Template-
                                   Parameters Farbschema überschreiben.

Konfiguration des Seitenwerkzeugbereiches (höchste Priorität)
                                  Die Template-Farbe kann durch den Farbschema-Schalter aus
                                  Seitenwerkzeugbereich ausgewählt werden.
                                  Diese Einstellung wird vom Besucher besonders bevorzugt und hat demnach
                                  die höchstmögliche Priorität. Es überschreibt die Seitenklasse sowie die
                                  Standardeinstellungen des Parameters Farbschema.




                                                      37
Joomla! template JSN Tendo Konfigurationshandbuch ©
                           Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                         Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Menüs
JSN Epic bietet insgesamt 5 Menüstile zur Präsentation Ihrer Webseiten-Navigation an. Da das integrierte
Standard Joomla! Menümodul (mod_mainmenu) angewandt wird, brauchen Sie sich nicht mehr um eine externe
Menümodulinstallation zu kümmern.

Obermenü




Mit dem Obermenü können Sie Ihre Menü-Items horizontal anordnen und Ihnen Icons zuweisen. Alle Icons
werden direkt in der Menüitems-Konfiguration eingestellt, was sehr praktisch ist.
Um das Obermenü einzurichten, wählen Sie bitte das gewünschte Menümodul aus und stellen die Parameter
folgendermaßen ein:
Für Joomla! 1.7/2.5:

      Titel: Top Menu

      Titel anzeigen: Verbergen

      Position: top

      Zugriffsebene: public

      Sprache: alle

      Menü wählen: Top Menu

      Erste Ebene: 1

      Letzte Ebene: 2

      Untermenüeinträge anzeigen: Nein

      Menü-Klassen-Suffix: menu-topmenu menu-iconmenu
Für Joomla! 1.5:

      Titel: Top Menu
                                                       38
Joomla! template JSN Tendo Konfigurationshandbuch ©
                           Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                         Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
      Titel anzeigen: Nein

      Position: top

      Menüs: alle

      Menü wählen: topmenu

      Menüstil: Liste

      Erste Ebene: 0

      Letzte Ebene: 1

      Untermenüeinträge anzeigen: Nein

      Menü-Klassen-Suffix: menu-topmenu menu-iconmenu

Achtung!
Es kommt häufig zu einer Verwechslung zwischen Menü-Klassen-Suffix und Modul-Klassen-Suffix, die beide
völlig verschiedene Parameter sind. Achten Sie deshalb bitte sorgfältig auf die jeweiligen Einstellungen.




                                                       39
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Obermenü-Icons
Sie können beliebig UniIcons an Obermenü-Items anhängen, um diese ansprechender zu gestalten. UniIcons ist
ein Set bestehend aus 20 voreingestellten Icon, die für vielerlei Zwecke verwendet werden können. Lesen Sie bitte
den Abschnitt UniIcons in diesem Handbuch, um mehr über die verfügbaren Icons und ihre Namen zu erfahren.
Für die Einstellung der Icons müssen Sie zur Menü-Items-Konfiguration gehen. Gehen Sie hierfür folgendermaßen
vor:
Für Joomla! 1.7/2.5
Fügen Sie die Symbolkombination icon-xxx zum Parameter Link-CSS-Stil hinzu, wobei xxx für das gewünschte
Icon steht.




                                                       40
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Für Joomla! 1.5
Fügen Sie die Symbolkombination (icon-xxx) zum Titel hinzu, wobei xxx für das gewünschte Icon steht.




                                                     41
Joomla! template JSN Tendo Konfigurationshandbuch ©
                          Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                        Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Hauptmenü




Das Hauptmenü ist ein beeindruckendes Funktionsmenü mit einwandfreiem Zugang zur XHTML-Code-Struktur
und effektiven Klappmenüs der Untermenübereiche.
Um das Hauptmenü einzurichten, wählen Sie bitte das gewünschte Menümodul aus und stellen die Parameter
folgendermaßen ein:
Für Joomla! 1.7/2.5:

      Titel: Main Menu

      Titel anzeigen: Verbergen

      Position: mainmenu

      Zugriffsebene: public

      Sprache: alle

      Menü wählen: Main Menu

      Erste Ebene: 1

      Letzte Ebene: All

      Untermenüeinträge anzeigen: Ja

      Menü-Klassen-Suffix: menu-mainmenu menu-iconmenu menu-richmenu




                                                      42
Joomla! template JSN Tendo Konfigurationshandbuch ©
                           Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                         Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Für Joomla! 1.5:

      Titel: Main Menu

      Titel anzeigen: Nein

      Position: mainmenu

      Menüs: alle

      Menü wählen: mainmenu

      Menüstil: Liste

      Erste Ebene: 0

      Letzte Ebene: 0

      Untermenüeinträge anzeigen: Ja

      Menü-Klassen-Suffix: menu-mainmenu menu-iconmenu menu-richmenu

Achtung!
Es kommt häufig zu einer Verwechslung zwischen Menü-Klassen-Suffix und Modul-Klassen-Suffix, die beide
völlig verschiedene Parameter sind. Achten Sie deshalb bitte sorgfältig auf die jeweiligen Einstellungen.




                                                       43
Joomla! template JSN Tendo Konfigurationshandbuch ©
                      Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                    Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Visuelle Spezialeffekte

Hauptmenü-Effekt
JSN Epic bietet Ihnen eine flüssige und ruckfreie Klappanimation für Untermenübereiche an. Dank der integrierten
Joomla! MooTools-JavaScript-Library ist das Einbauen anderer JavaScript-Frameworks überflüssig. Zur
Aktivierung müssen Sie den Template-Parameter ‘Main Menu’ Position Effect in der Template-Konfiguration auf
Ja setzen.

Hauptmenü-Transparenz
Ein weiterer visueller Effekt besteht in der Transparenz für Untermenübereiche (etwa 90%). Um diese zu
aktiveren, setzen Sie den Template-Parameter 'Main Menu' Position Transparenz auf Ja.




                                                      44
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Hauptmenü-Icons




Sie können beliebig UniIcons an Menü-Items anhängen, um diese ansprechender zu gestalten. Für die Einstellung
der Icons müssen Sie zur Menü-Items-Konfiguration gehen. Gehen Sie hierfür folgendermaßen vor:
Für Joomla! 1.7/2.5
Fügen Sie die Symbolkombination icon-xxx zum Parameter Link-CSS-Stil hinzu, wobei xxx für das gewünschte
Icon steht.




                                                     45
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Für Joomla! 1.5
Fügen Sie die Symbolkombination (icon-xxx) zum Titel hinzu, wobei xxx für das gewünschte Icon steht.




UniIcons ist ein Set bestehend aus 20 voreingestellten Icon, die für vielerlei Zwecke verwendet werden können.
Lesen Sie bitte den Abschnitt UniIcons in diesem Handbuch, um mehr über die verfügbaren Icons und ihre Namen
zu erfahren.




                                                      46
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Obermenü- Rich Text




                                                                                             Sie können einen
          Beschreibungstext für Menü-Items hinzufügen, um diese klarer und ersichtlicher darzustellen.
Um einen Beschreibungstext zu erstellen, müssen Sie zu den Einstellungen der Menü-Items gehen und folgende
Schritte beachten:
Für Joomla! 1.7/2.5
Fügen Sie einen Beschreibungstext zum Menü-Items-Parameter Link-Titel-Attribut hinzu.




                                                      47
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Für Joomla! 1.5
Fügen Sie die Symbolkombination (=) als Trennzeichen zwischen Haupt- und Beschreibungstext im Menü-Items-
Titel hinzu.




Im darüberliegenden Beispiel ist Home der Haupttext und Start here... der Beschreibungstext. Das Trennzeichen
zwischen Ihnen besteht aus der Symbolkombination (=).




                                                      48
Joomla! template JSN Tendo Konfigurationshandbuch ©
                   Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                 Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Hauptmenü-Icons und Rich Text in Kombination




Sie können Menü-Items aus der Kombination zwischen Icons und Rich Text einrichten.
Für Joomla! 1.7/2.5




                                                    49
Joomla! template JSN Tendo Konfigurationshandbuch ©
                    Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                  Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Für Joomla! 1.5




                                                50
Joomla! template JSN Tendo Konfigurationshandbuch ©
                          Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                        Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Seitemenü




Das Seitenmenü ist ein einzigartiges Vertikalmenü mit Schiebebereichen. Dieses Menü ist äußerst effizient, wenn
Sie eine komplexe Navigation mit vielen Menü-Items haben.
Um das Seitenmenü einzurichten, wählen Sie bitte das gewünschte Menümodul aus und stellen die Parameter
folgendermaßen ein:
Für Joomla! 1.7/2.5:

      Titel: Side Menu

      Titel anzeigen: Anzeigen

      Position: left

      Zugriffsebene: public

      Sprache: alle

      Menü wählen: Main Menu

      Erste Ebene: 1

      Letzte Ebene: Alle

      Untermenüeinträge anzeigen: Ja

      Menü-Klassen-Suffix: menu-sidemenu menu-iconmenu menu-richmenu




                                                       51
Joomla! template JSN Tendo Konfigurationshandbuch ©
                           Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                         Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Für Joomla! 1.5:

      Titel: Side Menu

      Position: left

      Menüs: Alle

      Menü wählen: mainmenu

      Menüstil: Liste

      Erste Ebene: 0

      Letzte Ebene: 0

      Untermenüeinträge anzeigen: Ja

      Menü-Klassen-Suffix: menu-sidemenu menu-iconmenu menu-richmenu

Achtung!
Es kommt häufig zu einer Verwechslung zwischen Menü-Klassen-Suffix und Modul-Klassen-Suffix, die beide
völlig verschiedene Parameter sind. Achten Sie deshalb bitte sorgfältig auf die jeweiligen Einstellungen.




                                                       52
Joomla! template JSN Tendo Konfigurationshandbuch ©
                      Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                    Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Visuelle Spezialeffekte

Seitliche Menü-Effekte
Ähnlich dem Hauptmenü, bietet JSN Epic eine flüssige und ruckfreie Schiebeanimation für Untermenübereiche des
seitlichen Menüs an. Dank der integrierten Joomla! MooTools-JavaScript-Library ist das Einbauen anderer
JavaScript-Frameworks überflüssig. Zur Aktivierung müssen Sie den Template-Parameter Sub Menu (Seitliches
Menü) in der Template-Konfiguration auf Ja setzen.

Seitliche Menütransparenz
Die Untermenübereiche des Seitenmenüs können auch semi-transparent sein. Um dies zu aktiveren, setzen Sie den
Template-Parameter Seitliche Menütransparenz auf Ja.

Seitliche Menü-Icons und Rich Text




Wie im Hauptmenü können Sie Menü-Items aus der Kombination zwischen Icons und Rich Text einrichten.




                                                     53
Joomla! template JSN Tendo Konfigurationshandbuch ©
                           Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                         Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Baummenü




Das Baummenü veranschaulicht Menü-Items in einer baumähnlichen Rangordnung, was sehr angemessen für
Indexmenüs ist. Sämtliche Untermenü-Items sind bis zur Auswahl des Hauptmenü-Items klappbar.
Um das Baummenü einzurichten, wählen Sie bitte das gewünschte Menümodul aus und stellen die Parameter
folgendermaßen ein:
Für Joomla! 1.7/2.5:

      Titel: Tree Menu

      Titel anzeigen: Anzeigen

      Position: right

      Zugriffsebene: public

      Sprache: alle

      Menü wählen: Main Menu

      Erste Ebene: 1

      Letzte Ebene: Alle

      Untermenüeinträge anzeigen: Nein

      Menü-Klassen-Suffix: menu-treemenu menu-iconmenu menu-richmenu




                                                       54
Joomla! template JSN Tendo Konfigurationshandbuch ©
                           Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                         Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Für Joomla! 1.5:

      Titel: Tree Menu

      Position: left

      Menüs: alle

      Menü wählen: mainmenu

      Menüstil: Liste

      Erste Ebene: 0

      Letzte Ebene: 0

      Untermenüeinträge anzeigen: Nein

      Menü-Klassen-Suffix: menu-treemenu menu-iconmenu menu-richmenu




                                                       55
Joomla! template JSN Tendo Konfigurationshandbuch ©
                  Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Baummenü-Icons und Rich Text




Wie im Hauptmenü können Sie Menü-Items aus der Kombination zwischen Icons und Rich Text einrichten.




                                                   56
Joomla! template JSN Tendo Konfigurationshandbuch ©
                            Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                          Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Div-Menü




Das Div-Menü ist eine simple aber dennoch sehr anschauliche Menüleiste, die Items durch kaum sichtbare Striche
voneinander trennt. Dieses Menü ist daher ziemlich geeignet für die Präsentation von Fußzeilen.
Um das Div-Menüeinzurichten, wählen Sie bitte das gewünschte Menümodul aus und stellen die Parameter
folgendermaßen ein:
Für Joomla! 1.7/2.5:
      Titel: Div Menu

      Titel anzeigen: Verbergen

      Position: footer

      Zugriffsebene: public

      Sprache: alle

      Menü wählen: othermenu

      Erste Ebene: 1

      Letzte Ebene: 1

      Untermenüeinträge anzeigen: Nein

      Menü-Klassen-Suffix: menu-divmenu




                                                        57
Joomla! template JSN Tendo Konfigurationshandbuch ©
                           Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                         Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Für Joomla! 1.5:

      Titel: Div Menu

      Titel anzeigen: Nein

      Position: bottom

      Menüs: alle

      Menü wählen: othermenu

      Menüstil: Liste

      Erste Ebene: 0

      Letzte Ebene: 1

      Untermenüeinträge anzeigen: Nein

      Menü-Klassen-Suffix: menu-divmenu

Achtung!
Es kommt häufig zu einer Verwechslung zwischen Menü-Klassen-Suffix und Modul-Klassen-Suffix, die beide
völlig verschiedene Parameter sind. Achten Sie deshalb bitte sorgfältig auf die jeweiligen Einstellungen.




                                                       58
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Schriftarten

Schriftarten
JSN Epic bietet 3 Schriftartoptionen für wesentliche Webseitentypen an. Eigentlich besteht jede Schriftartoption
aus einer Kombination aus zwei Schriftarten: Eine für den Inhaltstext, die andere für die Überschrift und den
Hauptnavigationstext. Zusätzlich existiert für jede Schriftart eine Spezialschriftart – powered by Google Font
Directory.




                                                       59
Joomla! template JSN Tendo Konfigurationshandbuch ©
                    Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                  Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Geschäftliche Webseite (Standard)




                                                Normale Schriftart




                                                 Spezialschriftart
Dieser kompakte und ordentliche Schriftstil ist eine exzellente Wahl für businessorientierte Webseiten sowie
Unternehmenswebseiten. Die Kombination aus Verdana und Arial erscheint als sehr natürlich und ist für die
meisten Nutzer geläufig, da diese die meistbenutzten Schriftarten im Internet sind.
Darunter finden Sie eine Beschreibung für die jeweilige Schriftart:

                                 Schriftart für PC            Schriftart für Mac
                                                                                            Spezialschriftart
                                    (Standard)                   (Standard)

Überschrift/Menütext                  Verdana                         Geneva                     Nobile

Inhaltstext                             Arial                         Helvetica                   N/A



                                                        60
Joomla! template JSN Tendo Konfigurationshandbuch ©
                     Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                   Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Personelle / Blog Webseite




                                                Normale Schriftart




                                                 Spezialschriftart
Der Schriftstil ist hier ein wenig größer als üblich und somit ideal für kleinere Webseiten wie persönliche
Webseiten und Blogs. Durch die Kombination aus Georgia und Trebuchet MS ist der Inhalt leicht zu lesen und
wird dadurch stärker hervorgehoben.
Darunter finden Sie eine Beschreibung für die jeweilige Schriftart:

                                 Schriftart für PC            Schriftart für Mac
                                                                                         Spezialschriftart
                                    (Standard)                   (Standard)

Überschrift/Menütext                  Georgia                           serif                 Lobster

Inhaltstext                        Trebuchet MS                       Helvetica                N/A



                                                        61
Joomla! template JSN Tendo Konfigurationshandbuch ©
                     Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                   Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Online Nachrichten / Magazin Webseiten




                                                Normale Schriftart




                                                 Spezialschriftart
In diesem Schriftstil wird eine weitere, sehr populäre Schriftart namens Times New Roman angewandt. Diese
Schriftart ist bei Druckindustrien weit verbreitet und wird auch in einigen sehr bekannten Online-Nachrichtenseiten
wie The New York Times verwendet. Also, falls Sie mit dem Gedanken spielen so etwas zumachen, dann lohnt es
sich diese Schriftartkombination auszuprobieren.
Darunter finden Sie eine Beschreibung für die jeweilige Schriftart:

                                 Schriftart für PC            Schriftart für Mac
                                                                                            Spezialschriftart
                                    (Standard)                   (Standard)

Überschrift/Menütext             Palatino Linotype                    Palatino                 Droid Serif

Inhaltstext                     Times New Romam                        Times                      N/A

                                                        62
Joomla! template JSN Tendo Konfigurationshandbuch ©
                       Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                     Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Schriftstil-Konfiguration
Der Template-Schriftstil kann auf zwei verschiedenen Möglichkeiten eingestellt werden:

Konfiguration der Template-Parameter (niedrigste Priorität)
                                    Der Template-Schriftstil kann durch den Parameter Schriftstil eingestellt
                                    werden.
                                    Dies ist die Standardeinstellung und hat die niedrigste Priorität.




Konfiguration der Seitenklasse (hohe Priorität)
                                    Der Template-Schriftstil kann durch die Seitenklasse des Menü-Items mit
                                    der Syntax custom-textstyle-xxx eingestellt werden, wobei xxx für den
                                    gewählten Schriftstil steht.
                                    Möglich sind die folgenden Werte: Geschäftliche Webseite, Personelle /
                                    blog Webseite und Online Nachrichten / Magazin Webseite.
                                    Beispiel:

                                           custom-textstyle-personal
                                    Diese Einstellung wird die Standardeinstellungen durch den Template-
                                    Parameter Schriftstil überschreiben.




                                                       63
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Schriftgrade
JSN Epic bietet insgesamt 3 Schriftgrößenoptionen für wesentliche Webseitentypen an.




                                             Kleine Schriftgröße




                                            Mittlere Schriftgröße




                                             Große Schriftgröße

                                                     64
Joomla! template JSN Tendo Konfigurationshandbuch ©
                       Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                     Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Die Template-Textgröße kann auf drei verschiedenen Möglichkeiten eingestellt werden

Konfiguration der Template-Parameter (niedrigste Priorität)
                                   Der Template-Textgröße kann durch den Parameter Template Schriftgröße
                                   eingestellt werden.
                                   Dies ist die Standardeinstellung und hat die niedrigste Priorität.




Konfiguration der Seitenklasse (hohe Priorität)
                                   Der Template-Textgröße kann durch die Seitenklasse des Menü-Items mit
                                   der Syntax custom-textsize-xxx eingestellt werden, wobei xxx für die
                                   gewählte Textgröße steht.
                                   Möglich sind die folgenden Werte: small, medium und big.
                                   Beispiel:

                                         custom-textsize- big
                                   Diese Einstellung wird die Standardeinstellungen mithilfe des Template-
                                   Parameters Template Schriftgröße überschreiben.

Konfiguration des Seitenwerkzeug-Bereiches
                                  Die Template-Schriftgröße kann durch den Schriftgrößen-Schalter aus dem
                                  Seitenwerkzeugbereich ausgewählt werden.
                                  Diese Einstellung wird vom Besucher besonders bevorzugt und hat demnach
                                  die höchstmögliche Priorität. Es überschreibt die Seitenklasse sowie die
                                  Standardeinstellungen des Parameters Template Schriftgröße.




                                                      65
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Module
JSN Epic bietet Ihnen insgesamt 4 Box-Designs für das Gestalten von Modulhintergründen an, die in Verbindung
mit UniIcons auch für Modulüberschriften geeignet sind. Modulstile werden durch den Modul-Parameter Modul-
Klassen-Suffix eingestellt. Die verfügbaren Werte sind im Folgenden beschrieben und sind ohne
Anführungszeichen anzuwenden.

Modul-Box-Designs
Anwendung der Box-Designs auf Module:




                       “richbox-1”                                         “richbox-2”




                                                     66
Joomla! template JSN Tendo Konfigurationshandbuch ©
                    Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                  Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Verfügbare Boxdesigns in der PRO Edition




                     “lightbox-1”                                     “lightbox-2”




                       “solid-1”                                       “solid-2”




                                                 67
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Modul-Icon-Designs
Sie können beliebig UniIcons an Modulüberschriften anhängen. Für die Einstellung von Icons, müssen Sie die
Zeichenkette icon-xxx am Modul-Klassen-Suffix hinzufügen, wobei xxx für das gewünschte Icon steht.




                        “icon-star”                                         “icon-online”
Sämtliche Icon-Design können in Verbindung mit Modul-Box-Designs verwendet werden:




                  “box-green icon-user”                             “box-yellow icon-comment”
Lesen Sie bitte den Abschnitt UniIcons in diesem Handbuch, um mehr über die verfügbaren Icons und ihre Namen
zu erfahren.




                                                      68
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Typografie
Mit einem starken Fokus auf Typografie sind wir der Meinung, dass JSN Epic ein äußerst umfassendes
Leistungsvermögen auf dem Gebiet der Inhaltspräsentation besitzt. Überschriften, Text, Links, Tabellen, Bilder –
alles wurde mit einem hohen Grad an Verfeinerung gestaltet. Sehen wir uns das Ganze doch mal an.




                                                       69
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine

Inhaltsspalten
Häufig müssen Sie Ihren Inhalt in mehreren Spalten unterbringen - JSN Epic bietet Ihnen dazu eine sehr praktische
Methode an, mit der Sie ohne jegliche Probleme Spalteninhalte erstellen können. Das ist ein weitreichender
Fortschritt, da nun Tabellen-Tags am Inhalt überflüssig geworden sind und diese nur für das Anzeigen
tabellarischer Daten vonnöten sind.
Sie können Ihren Inhalt in beliebig viele Spalten organisieren. JSN Epic erkennt Ihre Spaltenanzahl und ordnet Sie
automatisch. Das Einzige, was Sie hier erledigen müssen, ist das Einstellen der grid-layout-Klasse bezüglich des
Haupt-DIV-Tags.
Unten sehen Sie Screenshots zur Veranschaulichung dieser Funktion und ihrer Funktionsweise:

2-Spalten-Inhalt




Anwendung:
<div class=”grid-layout”>
   <div>Text in column 1</div>
   <div> Text in column 2</div>
</div>

3-Spalten-Inhalt




Anwendung:
<div class=”grid-layout”>
  <div>Text in column 1</div>
  <div>Text in column 2</div>

                                                       70
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
   <div> Text in column 3</div>
</div>

Überschriften




Wie wir ja alle wissen, “betiteln” Überschriften Textblöcke, weswegen Sie sich rein optisch gesehen unterscheiden
müssen. Dazu stellt uns JSN Epic 5 Gestaltungsmöglichkeiten für Hauptüberschriften zur Verfügung. Um diese
anzuwenden, müssen Sie nur den Überschriftentext in normale Überschriften-Tags wie <h1>…</h1>,
<h2>…</h2>, <h3>…</h3>, usw. setzen.




                                                       71
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Texte
JSN Epic bietet Ihnen 12 verschiedene Schriftstile zur einfacheren Handhabung Ihres Inhaltes an. Wie diese
aussehen, zeigen wir Ihnen im Folgenden:

Vorformatierter Text
Sie können diesen Stil verwenden, wenn Sie einen Text in seiner exakten Darstellungsweise, d.h. inklusive
Weißräume, Tabulatoren und Zeilenumbrüche, innerhalb der <pre>-Tags anzeigen möchten.




Anwendung:
<pre>Vorformatierter Text</pre>

Zitiertext
Diesen Stil verwenden Sie, wenn Sie jemanden zitieren möchten (Reden, Artikel, Buchfragmente, Ideen, usw.).




Anwendung:
<blockquote>Zitiertext</blockquote>




                                                       72
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Initiale
Initialen können Sie beispielsweise in Textparagraphen in Magazinen und Nachrichtenzeitungen einbauen.




Anwendung:
<p class=”text-dropcap”>Initiale</p>

Markierter Text
Wenden Sie diesen Stil an, um Schlüsselwörter/-ausdrücke auf einer Suchergebnisseite zu markieren.




Anwendung:
<span class=”text-highlight”>Markierter Text</span>




                                                      73
Joomla! template JSN Tendo Konfigurationshandbuch ©
                   Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                 Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Meldungs-/Warnungstext
Um Nutzer auf wichtige Textparagraphen hinzuweisen, verwenden Sie Meldungs-/Warnungstexte.




Anwendung:
<p class="text-alert">Meldungs-/Warnungstext</p>.
<div class="text-alert">Meldungs-/Warnungstext</div>.

Infotext
Infotexte verwenden Sie, wenn Sie den Nutzer in über etwas Bestimmtes informieren möchten.




Anwendung:
<p class="text-info">Infotext</p>.
<div class="text-info"> Infotext </div>.




                                                     74
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Download-Text
Dieser Stil wird für informierende Textparagraphen bezüglich von Ladevorgängen angewendet.




Anwendung:
<p class="text-download"> Download-Text </p>.
<div class="text-download"> Download-Text</div>.

Tipptext
Tipptexte sind besonders geeignet für nützliche Informationen wie z.B. Tipps, Hinweise und Hilfetexte.




Anwendung:
<p class="text-tip"> Tipptext </p>
<div class="text-tip"> Tipptext </div>




                                                       75
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Kommentartext
Verwenden Sie diesen Stil um kommentierende Textparagraphen zu erstellen.




Anwendung:
<p class="text-comment"> Kommentartext </p>
<div class="text-comment"> Kommentartext </div>

Anhangstext
Für informierende Textparagraphen, die Dateianhänge enthalten, verwenden Sie Anhangstexte.




Anwendung:
<p class="text-attachment"> Anhangstext </p>.




                                                     76
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Videotext
Mit diesem Stil lassen sich Videodateien in beschreibenden Textparagraphen einfügen.




Anwendung:
<p class="text-video"> Videotext </p>
<div class="text-video"> Videotext </div>.

Audiotext
Verwenden Sie den Stil Audiotext für beschreibende Textparagraphen, wenn Sie Audiodateien einfügen möchten.




Anwendung:
<p class="text-audio"> Audiotext </p>
<div class="text-audio"> Audiotext</div>.




                                                      77
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Links

Icon-Links
Sie können beliebig UniIcons am vorderen Ende eines Links anhängen, indem Sie einfach eine Klasse hinzufügen.




Anwendung:
<a class="link-icon icon-xxx"> Linktext </a>, wobei xxx für das gewünschte Icon steht.
Beispiel:
<a class="link-icon icon-download"> Linktext</a>

Button-Links
JSN Epic bietet Ihnen ganze 6 verschiedene Button-Stile für die Dekoration jeglicher Aufruflinks, die sich in
Ihrem Inhalt befinden, an.




Anwendung:
<a class="link-button button-xxx"> Linktext </a>,
wobei xxx die gewünschte Button-Farbe ist. Zur Auswahl stehen folgende Farben: light, dark, green, orange,
blue und red.
                                                    78
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Beispiel:
<a class="link-button button-orange"> Linktext </a>

Button- und Icon-Links in Kombination
Sie können Button-Links und Icon-Links auch in Kombination verwenden.




Anwendung:
<a class="link-button button-xxx"><span class="link-icon icon-yyy"> Linktext </span></a>,
wobei xxx und yyy jeweils für die Button-Farbe bzw. für das gewünschte Icon steht.
Beispiel:
<span class="link-button button-green"><a class="link-icon icon-cart"> Linktext </a></span>

Erweiterungslink
JSN Epic ist nicht nur in der Lage Icons am vorderen Ende von Links hinzuzufügen, sondern stellt Ihnen auch 24
Erweiterungs-Icons für das hintere Ende von Links zur Verfügung.




                                                      79
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Dabei gibt es die Anwendung von Erweiterungs-Icons zwei Möglichkeiten.

Automatische Zuweisung
JSN Epic kann Links mit unzähligen, gängigen Dateierweiterungen erkennen und dementsprechend Icons
zuweisen. Mittels moderner CSS2-Spezifikation erlaubt Ihnen diese Funktion eine einwandfreie Zuweisung von
aussagekräftigen Icons, die keiner Modifikation im XHTML-Code bedarf. Zusätzlich werden dabei auch die
jeweiligen Protokolltypen zur Icon-Zuweisung bezüglich Instant-Messengers, E-Mail, usw. erkannt.

Manuelle Zuweisung
Wie bereits genannt, werden die meisten Browser-Icons dank moderner CSS2-Spezifikation automatisch
zugewiesen. Leider wird gerade diese Spezifikation vom IE6 nicht unterstützt, weswegen Sie die Einstellung
geeigneter Klassen für Links manuell betätigen müssen. Wenn Sie den Template-Parameter zur automatischen
Zuweisung ausgeschaltet haben, kann dies natürlich auch hilfreich sein, wenn Sie manuell Icons Links zuweisen
möchten.
Anwendung:<a class="link-icon-ext icon-ext-xxx">Linktext</a>, wobei xxx für das gewünschte Icon steht.

     - “aim”                       - “excel”                    - “movie”               - “skype”

     - “application”               - “feed”                     - “msn”                 - “text”

     - “archive”                   - “flash”                    - “music”               - “torrent”

     - “calendar”                  - “font”                     - “pdf”                 - “vcard”

     - “css”                       - “mail”                     - “powerpoint”          - “yahoo”

     - “doc”                       - “mobile”                   - “quicktime”           - “windowsmedia”
JSN Epic verwendet die Image Sprite CSS-Technik, um die Zahl an Serveranfragen zu reduzieren. Technisch
gesehen, werden alle Icons zu einer einzelnen Bilddatei zusammengeführt, wodurch es nun möglich ist, mit einer
Serveranfrage alle Icons zu erhalten. Wenn Sie Näheres zu diesem Themengebiet wissen möchten, hier weitere
Informationen über CSS Sprites.




                                                      80
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Tabellen
Tabellarische Daten zählen zu den verbreitesten Informationstypen auf dem Gebiet Webpräsentation.
Standardmäßig, sehen Tabellen nicht sehr ansprechend aus und sind zudem schwer leserlich. Hierbei stellt Ihnen
JSN Epic 3 Tabellentypen für die virtuelle Präsentation von tabellarischen Daten zur Verfügung.

Tabellenkopf-Farbstil




Anwendung:
<table class="table-style style-colorheader">...</table>

Farbstreifen-Stil




Anwendung:
<table class="table-style style-colorstripes">...</table>


                                                       81
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Graustreifen-Stil




Anwendung:
<table class="table-style style-greystripes">...</table>

Achtung:
Um eine korrekte Anzeige der Tabellenstile zu gewährleisten, müssen Sie einen zuverlässigen XHTML-Code
erstellen.
<table width="100%" class="table-style style-colorheader">
        <thead>
                <tr>
                        <th>Table header</th>
                        <th>Column header 1</th>
                        <th class=”highlight”>Column header 2</th>
                        <th>Column header 3</th>
                </tr>
        </thead>
        <tfoot>
                <tr>
                        <th>Table footer</th>
                        <td colspan="3">Footer data</td>
                </tr>
        </tfoot>
        <tbody>
                <tr class="odd">
                        <th>Row header 1</th>
                        <td>Lorem ipsum</td>
                        <td class=”highlight”>Dolor sit amet</td>
                        <td>Lorem ipsum</td>
                </tr>
        </tbody>
</table>



                                                      82
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine

Listen
Listen sind wesentliche Bestandteile eines jeden Inhaltes – dies gilt nicht nur für Online-Webseiten. Sie erleichtern
den Zugang zum Inhalt erheblich und ermöglichen schon auf dem ersten Blick eine rasche Aufnahme von
wichtigen Informationen.

Standardlisten

Ungeordnete Liste                                           Geordnete Liste




Anwendung:                                                  Anwendung:
<ul><li>…</li></ul>                                         <ol><li>…</li></ol>

Liste ohne Aufzählungszeichen                               Horizontale Liste




Anwendung:                                                  Anwendung:
<ul class="list-nobullet"><li>…</li></ul>                   < ul class="list-horizontal"><li>…</li></ul>




                                                         83
Joomla! template JSN Tendo Konfigurationshandbuch ©
                      Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                    Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Pfeillisten

Pfeilliste - Rot                                          Pfeilliste - Blau




Anwendung:                                                Anwendung:
<ul class="list-arrow arrow-red"><li>…</li></ul>          <ul class="list-arrow arrow-blue"><li>…</li></ul>

Pfeilliste - Grün




Anwendung:
<ul class="list-arrow arrow-green"><li>…</li></ul>




                                                     84
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Icon-Listen
Sie können beliebig UniIcons an Listengegenständen anhängen. Für die Einstellung von Icons, müssen Sie die
Zeichenkette icon-xxx an die <ul>-Klasse hinzufügen, wobei xxx für das gewünschte Icon steht.

Artikel-Icon-Liste                                      Ordner-Icon-Liste




Anwendung:                                              Anwendung:
<ul class="list-icon icon-article"><li>…</li></ul>      <ul class="list-icon icon-folder"><li>…</li></ul>

Lesen Sie bitte den Abschnitt UniIcons in diesem Handbuch, um mehr über die verfügbaren Icons und ihre Namen
zu erfahren.




                                                      85
Joomla! template JSN Tendo Konfigurationshandbuch ©
                       Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                     Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Numerische Listen

Numerische Liste - Blau                              Numerische Liste - Grün




Anwendung:                                           Anwendung:
<ul class="list-number-bullet bullet-blue"><li>…     <ul class="list-number-bullet bullet-green"><li>…

Numerische Liste - Grau                              Numerische Liste- Orange




Anwendung:                                           Anwendung:
<ul class="list-number-bullet bullet-grey"><li>…     <ul class="list-number-bullet bullet-orange"><li>…




                                                   86
Joomla! template JSN Tendo Konfigurationshandbuch ©
                       Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                     Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine

Numerische Liste - Rot                               Numerische Liste - Violett




Anwendung:                                           Anwendung:
<ul class="list-number-bullet bullet-red"><li>…      <ul class="list-number-bullet bullet-violet"><li>…

Numerische Liste – Blaue Ziffern                     Numerische Liste – Grüner Ziffern




Anwendung:                                           Anwendung:
<ul class="list-number-digit digit-blue"><li>…       <ul class="list-number-digit digit-green"><li>…




                                                   87
Joomla! template JSN Tendo Konfigurationshandbuch ©
                       Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                     Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine

Numerische Liste – Graue Ziffern                     Numerische Ziffern – Orange Ziffern




Anwendung:                                           Anwendung:
<ul class="list-number-digit digit-grey"><li>…       <ul class="list-number-digit digit-orange"><li>…

Numerische Liste – Rote Ziffern                      Numerische Liste – Violtte Ziffern




Anwendung:                                           Anwendung:
<ul class="list-number-digit digit-red"><li>…        <ul class="list-number-digit digit-violet"><li>…




                                                   88
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Seitenwerkzeuge
JSN Epic bietet Ihnen drei neue Funktionen zur Steigerung Ihrer Nutzererfahrung an: Seitenbreiten-Schalter,
Schriftgrößen-Schalter und Farbschema-Schalter. Durch Freigabe dieser Sektoren wird ein bestmögliches
Erlebnis für die Besucher Ihrer Webseite gesichert. Alle Einstellungen der Seitenwerkzeuge werden beim Besucher
als Browser-Cookies für den weiteren Gebrauch gespeichert. Bei Deaktivierung aller Sektoren, werden keine
Seitenwerkzeuge angezeigt.

Präsentation von Seitenwerkzeugen
Für die Präsentation von Seitenwerkzeugen gibt es zwei mögliche Optionen.

Klappmenü




Mit dieser Option sind alle Schalter elegant im Untermenübereich angeordnet. Die Klappanimation, die
Transparenz Hintergrundfarbeinstellungen werden von den Hauptmenüeinstellungen übernommen.

Inline-Reihe




Wählen Sie diese Option, wenn Sie alle Sektoren direkt auf Ihrer Hauptmenüleiste anzeigen wollen. Zudem ist
diese Option sehr geeignet, wenn Sie nur einige Schalter freigeben möchten.




                                                      89
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Seitenbreiten-Schalter
                                    Diese Auswahl erlaubt Ihren Besuchern die optimale Template-Breite
                                    auszuwählen. Weitere Informationen über die Template-Breite finden Sie im
                                    Abschnitt Layoutdimensionen.
                                    Sie können diese Auswahl deaktivieren, indem Sie den Template-Parameter
                                    Aktiviere Seitenbreiten-Schalter auf Nein setzen.

Schriftgrößen-Schalter
                                    Diese Auswahl erlaubt Ihren Besuchern die optimale Textgröße auszuwählen
                                    und kommt beispielsweise Menschen mit Sehbeeinträchtigungen sehr
                                    gelegen. Weitere Informationen über Textgrößen finden Sie im Abschnitt
                                    Schriftgrade.
                                    Sie können diese Auswahl deaktivieren, indem Sie den Template-Parameter
                                    Aktiviere Schriftgrößen-Schalter auf Nein setzen.

Farbschema-Schalter
                                     Diese Auswahl erlaubt Ihren Besuchern das gewünschte Farbtheme
                                    auszuwählen und ist beispielsweise eine wirklich schöne Funktion auf
                                    sozialen Internetplattformen, wo auf Vorlieben des Besuchers besonders
                                    geachtet wird. Sie können bestimmte Farben in Ihre Auswahl einbinden,
                                    indem Sie sie im Template-Parameter Farben im Farbschema-Schalter
                                    definieren. Beispiel: blue,red,green.


Falls Ihre Webseite jedoch eine starke Identitätsfarbe besitzt und Sie es nicht wünschen, dass Besucher andere
Farben auswählen können, dann deaktivieren Sie diese Auswahl, indem Sie den Template-Parameter Aktiviere
Farbschema-Schalter auf Nein setzen.




                                                       90
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine

SEO & System

Quellenanordnung




Eine der wichtigsten SEO-Techniken ist es dafür zu sorgen, dass Suchmaschinen Ihren wesentlichen Inhalt
anzeigen. Um dies zu ermöglichen, generieren wir in unserer Template-Code-Struktur zuerst den “center” –
Abschnitt und erst danach die “left”- und “right”-Spalten.
Sie können dies mittels des Lynx-Browsers (online oder offline) überprüfen.




                                                       91
Joomla! template JSN Tendo Konfigurationshandbuch ©
                         Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                       Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Webseitenüberschrift




Diese Funktion erlaubt Ihnen einen bestimmten Wert, der durch den Parameter Name der Website bei Joomla!-
Globale Einstellungen definiert wird, zu nutzen und ihn im Tag <title> auf jeder Seite anzeigen zu lassen.
Standardmäßig, zeigt Joomla! den Name der Website nur auf dem Backend und auf der Offlineseite an.
Mit dem Parameter Seitentitel können Sie nun den Site Name am Fronend auf jeder Seite anwenden. Dies ist eine
sehr gute Funktion um Ihre Suchmaschinenoptimierung zu verbessern, da Sie Ihre Webseitenüberschrift mit
einigen wichtigen Schlüsselwörtern gezielt definieren können und diese auf jeder Seite anzeigen können. Beachten
Sie dass der Parameter nur in Joomla 1.5.x. vorhanden ist. Seit der Version Joomla 1.7.x. ist der Parameter in den
globalen Konfiguration von Joomla CMS inbegriffen.




                                                        92
Joomla! template JSN Tendo Konfigurationshandbuch ©
                        Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine
                      Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine
Top H-Tag




Mit dieser Funktion können Sie den Webseiten-Slogan in den <h1> -Tag setzen, was die SEO und die
Zugänglichkeit begünstigt. <h1> ist der wichtigste Inhalts-Tag, dessen Inhalt besondere Beachtung bei
Suchmaschinen findet. Haben Sie bereits eine kennwortgeschützte Webseitenüberschrift sowie einen Slogan
eingestellt, können Sie diese im ersten <h1> -Tag einbinden, um Ihren SEO-Rank zu erhöhen.




                                                     93
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch
JSN Epic konfigurationshandbuch

More Related Content

What's hot

JSN ImageShow Konfigurationshandbuch
JSN ImageShow KonfigurationshandbuchJSN ImageShow Konfigurationshandbuch
JSN ImageShow KonfigurationshandbuchJoomlaShine
 
JSN Cube Konfigurationshandbuch
JSN Cube KonfigurationshandbuchJSN Cube Konfigurationshandbuch
JSN Cube KonfigurationshandbuchJoomlaShine
 
JSN Dome Konfigurationshandbuch
JSN Dome KonfigurationshandbuchJSN Dome Konfigurationshandbuch
JSN Dome KonfigurationshandbuchJoomlaShine
 
Joomla 2.5 Leicht Gemacht | Kostenlos Buch
Joomla 2.5 Leicht Gemacht | Kostenlos BuchJoomla 2.5 Leicht Gemacht | Kostenlos Buch
Joomla 2.5 Leicht Gemacht | Kostenlos BuchJoomlaShine
 
Mini Handbuch-Joomla1.7
Mini Handbuch-Joomla1.7Mini Handbuch-Joomla1.7
Mini Handbuch-Joomla1.7schulpraxis
 
Input o2thinkbig
Input o2thinkbigInput o2thinkbig
Input o2thinkbigaseubert
 
Wordpress Praxisseminar HW Berlin
Wordpress Praxisseminar HW BerlinWordpress Praxisseminar HW Berlin
Wordpress Praxisseminar HW BerlinHagen Kohn
 
Website erstellen mit WordPress
Website erstellen mit WordPressWebsite erstellen mit WordPress
Website erstellen mit WordPressSkill Day
 
WordPress Tutorial
WordPress TutorialWordPress Tutorial
WordPress TutorialSkill Day
 

What's hot (10)

JSN ImageShow Konfigurationshandbuch
JSN ImageShow KonfigurationshandbuchJSN ImageShow Konfigurationshandbuch
JSN ImageShow Konfigurationshandbuch
 
JSN Cube Konfigurationshandbuch
JSN Cube KonfigurationshandbuchJSN Cube Konfigurationshandbuch
JSN Cube Konfigurationshandbuch
 
JSN Dome Konfigurationshandbuch
JSN Dome KonfigurationshandbuchJSN Dome Konfigurationshandbuch
JSN Dome Konfigurationshandbuch
 
Joomla 2.5 Leicht Gemacht | Kostenlos Buch
Joomla 2.5 Leicht Gemacht | Kostenlos BuchJoomla 2.5 Leicht Gemacht | Kostenlos Buch
Joomla 2.5 Leicht Gemacht | Kostenlos Buch
 
Joomla2.5 madeeasy
Joomla2.5 madeeasyJoomla2.5 madeeasy
Joomla2.5 madeeasy
 
Mini Handbuch-Joomla1.7
Mini Handbuch-Joomla1.7Mini Handbuch-Joomla1.7
Mini Handbuch-Joomla1.7
 
Input o2thinkbig
Input o2thinkbigInput o2thinkbig
Input o2thinkbig
 
Wordpress Praxisseminar HW Berlin
Wordpress Praxisseminar HW BerlinWordpress Praxisseminar HW Berlin
Wordpress Praxisseminar HW Berlin
 
Website erstellen mit WordPress
Website erstellen mit WordPressWebsite erstellen mit WordPress
Website erstellen mit WordPress
 
WordPress Tutorial
WordPress TutorialWordPress Tutorial
WordPress Tutorial
 

Viewers also liked

JSN Epic Customization Manual
JSN Epic Customization ManualJSN Epic Customization Manual
JSN Epic Customization ManualJoomlaShine
 
JSN Mobilize Webinar
JSN Mobilize WebinarJSN Mobilize Webinar
JSN Mobilize WebinarJoomlaShine
 
Segunda presentación
Segunda presentaciónSegunda presentación
Segunda presentaciónpreseta03
 
From system out to executable specifications (Ben Hamidene)
From system out to executable specifications (Ben Hamidene)From system out to executable specifications (Ben Hamidene)
From system out to executable specifications (Ben Hamidene)Anis Ben Hamidene
 
Geheimnisvolle Platz in der Welt
Geheimnisvolle Platz in der WeltGeheimnisvolle Platz in der Welt
Geheimnisvolle Platz in der WeltErasmus+
 
Grundladgen des Berichtwesen und Arbeiten mit Berichten
Grundladgen des Berichtwesen und Arbeiten mit BerichtenGrundladgen des Berichtwesen und Arbeiten mit Berichten
Grundladgen des Berichtwesen und Arbeiten mit Berichtenanthesis GmbH
 
2010-04-12 FNF BaaA - n°13-pakistan_von präsidial- zu parlamentsdemokratie
2010-04-12 FNF BaaA - n°13-pakistan_von präsidial- zu parlamentsdemokratie2010-04-12 FNF BaaA - n°13-pakistan_von präsidial- zu parlamentsdemokratie
2010-04-12 FNF BaaA - n°13-pakistan_von präsidial- zu parlamentsdemokratieOlaf Kellerhoff
 
virus y vacunas informaticas
virus y vacunas informaticasvirus y vacunas informaticas
virus y vacunas informaticassandracarvajal8
 
Equipo de alto rendimiento
Equipo de alto rendimientoEquipo de alto rendimiento
Equipo de alto rendimientoFantasticosumes
 
Prof. Dr. Anne Koenig: Mediencommunity.de - die Druckbranche erstellt ihr eig...
Prof. Dr. Anne Koenig: Mediencommunity.de - die Druckbranche erstellt ihr eig...Prof. Dr. Anne Koenig: Mediencommunity.de - die Druckbranche erstellt ihr eig...
Prof. Dr. Anne Koenig: Mediencommunity.de - die Druckbranche erstellt ihr eig...lernet
 
Tareas unificadas curso competencias clave
Tareas unificadas curso competencias claveTareas unificadas curso competencias clave
Tareas unificadas curso competencias clavejonybeisbol
 

Viewers also liked (20)

JSN Epic Customization Manual
JSN Epic Customization ManualJSN Epic Customization Manual
JSN Epic Customization Manual
 
JSN Mobilize Webinar
JSN Mobilize WebinarJSN Mobilize Webinar
JSN Mobilize Webinar
 
Clil
ClilClil
Clil
 
Segunda presentación
Segunda presentaciónSegunda presentación
Segunda presentación
 
From system out to executable specifications (Ben Hamidene)
From system out to executable specifications (Ben Hamidene)From system out to executable specifications (Ben Hamidene)
From system out to executable specifications (Ben Hamidene)
 
Geheimnisvolle Platz in der Welt
Geheimnisvolle Platz in der WeltGeheimnisvolle Platz in der Welt
Geheimnisvolle Platz in der Welt
 
Grundladgen des Berichtwesen und Arbeiten mit Berichten
Grundladgen des Berichtwesen und Arbeiten mit BerichtenGrundladgen des Berichtwesen und Arbeiten mit Berichten
Grundladgen des Berichtwesen und Arbeiten mit Berichten
 
GBI..
GBI..GBI..
GBI..
 
Finanzen im Kopf - Benzin im Blut
Finanzen im Kopf - Benzin im BlutFinanzen im Kopf - Benzin im Blut
Finanzen im Kopf - Benzin im Blut
 
Windows
WindowsWindows
Windows
 
Librosvirtuales
LibrosvirtualesLibrosvirtuales
Librosvirtuales
 
Rol pnp en_el_ncpp
Rol pnp en_el_ncppRol pnp en_el_ncpp
Rol pnp en_el_ncpp
 
Gamonal seminario-plantillas
Gamonal seminario-plantillasGamonal seminario-plantillas
Gamonal seminario-plantillas
 
2010-04-12 FNF BaaA - n°13-pakistan_von präsidial- zu parlamentsdemokratie
2010-04-12 FNF BaaA - n°13-pakistan_von präsidial- zu parlamentsdemokratie2010-04-12 FNF BaaA - n°13-pakistan_von präsidial- zu parlamentsdemokratie
2010-04-12 FNF BaaA - n°13-pakistan_von präsidial- zu parlamentsdemokratie
 
virus y vacunas informaticas
virus y vacunas informaticasvirus y vacunas informaticas
virus y vacunas informaticas
 
Equipo de alto rendimiento
Equipo de alto rendimientoEquipo de alto rendimiento
Equipo de alto rendimiento
 
Backplate Harness Kauftipps
Backplate Harness KauftippsBackplate Harness Kauftipps
Backplate Harness Kauftipps
 
Ensayofinal
EnsayofinalEnsayofinal
Ensayofinal
 
Prof. Dr. Anne Koenig: Mediencommunity.de - die Druckbranche erstellt ihr eig...
Prof. Dr. Anne Koenig: Mediencommunity.de - die Druckbranche erstellt ihr eig...Prof. Dr. Anne Koenig: Mediencommunity.de - die Druckbranche erstellt ihr eig...
Prof. Dr. Anne Koenig: Mediencommunity.de - die Druckbranche erstellt ihr eig...
 
Tareas unificadas curso competencias clave
Tareas unificadas curso competencias claveTareas unificadas curso competencias clave
Tareas unificadas curso competencias clave
 

More from JoomlaShine

Joomla 3.6 - The revolution in Joomla User Experience
Joomla 3.6 - The revolution in Joomla User ExperienceJoomla 3.6 - The revolution in Joomla User Experience
Joomla 3.6 - The revolution in Joomla User ExperienceJoomlaShine
 
HAPPY JOOMLA 10TH BIRTHDAY INFOGRAPHIC
HAPPY JOOMLA 10TH BIRTHDAY INFOGRAPHIC HAPPY JOOMLA 10TH BIRTHDAY INFOGRAPHIC
HAPPY JOOMLA 10TH BIRTHDAY INFOGRAPHIC JoomlaShine
 
Joomla 3.4 Made Easy
Joomla 3.4 Made EasyJoomla 3.4 Made Easy
Joomla 3.4 Made EasyJoomlaShine
 
Build a Joomla website by Drag n Drop with JSN PageBuilder and JSN PowerAdmin
Build a Joomla website by Drag n Drop with JSN PageBuilder and JSN PowerAdmin Build a Joomla website by Drag n Drop with JSN PageBuilder and JSN PowerAdmin
Build a Joomla website by Drag n Drop with JSN PageBuilder and JSN PowerAdmin JoomlaShine
 
Infographic 6 steps to build a Joomla website
Infographic 6 steps to build a Joomla websiteInfographic 6 steps to build a Joomla website
Infographic 6 steps to build a Joomla websiteJoomlaShine
 
JSN Escape Configuration Manual
JSN Escape Configuration ManualJSN Escape Configuration Manual
JSN Escape Configuration ManualJoomlaShine
 
JSN Mico Customization Manual
JSN Mico Customization ManualJSN Mico Customization Manual
JSN Mico Customization ManualJoomlaShine
 
JSN Mico Configuration Manual
JSN Mico Configuration ManualJSN Mico Configuration Manual
JSN Mico Configuration ManualJoomlaShine
 
JSN Air Configuration Manual
JSN Air Configuration ManualJSN Air Configuration Manual
JSN Air Configuration ManualJoomlaShine
 
Joomla 3.0 Leicht Gemacht | Kostenlos Buch
Joomla 3.0 Leicht Gemacht | Kostenlos BuchJoomla 3.0 Leicht Gemacht | Kostenlos Buch
Joomla 3.0 Leicht Gemacht | Kostenlos BuchJoomlaShine
 
Joomla 3.0 Made Easy | Free E-book
Joomla 3.0 Made Easy | Free E-book Joomla 3.0 Made Easy | Free E-book
Joomla 3.0 Made Easy | Free E-book JoomlaShine
 
JSN Boot Configuration Manual
JSN Boot Configuration Manual JSN Boot Configuration Manual
JSN Boot Configuration Manual JoomlaShine
 
JSN Neon Customization Manual
JSN Neon Customization ManualJSN Neon Customization Manual
JSN Neon Customization ManualJoomlaShine
 
JSN UniForm Configuration Manual
JSN UniForm Configuration ManualJSN UniForm Configuration Manual
JSN UniForm Configuration ManualJoomlaShine
 
JSN Kido Configuration Manual
JSN Kido Configuration ManualJSN Kido Configuration Manual
JSN Kido Configuration ManualJoomlaShine
 
JSN Vintage Configuration Manual
JSN Vintage Configuration ManualJSN Vintage Configuration Manual
JSN Vintage Configuration ManualJoomlaShine
 
JSN Vintage Customization Manual
JSN Vintage Customization ManualJSN Vintage Customization Manual
JSN Vintage Customization ManualJoomlaShine
 
JSN Decor Customization Manual
JSN Decor Customization ManualJSN Decor Customization Manual
JSN Decor Customization ManualJoomlaShine
 
JSN Decor Configuration Manual
JSN Decor Configuration ManualJSN Decor Configuration Manual
JSN Decor Configuration ManualJoomlaShine
 
JSN Pixel Customization Manual
JSN Pixel Customization ManualJSN Pixel Customization Manual
JSN Pixel Customization ManualJoomlaShine
 

More from JoomlaShine (20)

Joomla 3.6 - The revolution in Joomla User Experience
Joomla 3.6 - The revolution in Joomla User ExperienceJoomla 3.6 - The revolution in Joomla User Experience
Joomla 3.6 - The revolution in Joomla User Experience
 
HAPPY JOOMLA 10TH BIRTHDAY INFOGRAPHIC
HAPPY JOOMLA 10TH BIRTHDAY INFOGRAPHIC HAPPY JOOMLA 10TH BIRTHDAY INFOGRAPHIC
HAPPY JOOMLA 10TH BIRTHDAY INFOGRAPHIC
 
Joomla 3.4 Made Easy
Joomla 3.4 Made EasyJoomla 3.4 Made Easy
Joomla 3.4 Made Easy
 
Build a Joomla website by Drag n Drop with JSN PageBuilder and JSN PowerAdmin
Build a Joomla website by Drag n Drop with JSN PageBuilder and JSN PowerAdmin Build a Joomla website by Drag n Drop with JSN PageBuilder and JSN PowerAdmin
Build a Joomla website by Drag n Drop with JSN PageBuilder and JSN PowerAdmin
 
Infographic 6 steps to build a Joomla website
Infographic 6 steps to build a Joomla websiteInfographic 6 steps to build a Joomla website
Infographic 6 steps to build a Joomla website
 
JSN Escape Configuration Manual
JSN Escape Configuration ManualJSN Escape Configuration Manual
JSN Escape Configuration Manual
 
JSN Mico Customization Manual
JSN Mico Customization ManualJSN Mico Customization Manual
JSN Mico Customization Manual
 
JSN Mico Configuration Manual
JSN Mico Configuration ManualJSN Mico Configuration Manual
JSN Mico Configuration Manual
 
JSN Air Configuration Manual
JSN Air Configuration ManualJSN Air Configuration Manual
JSN Air Configuration Manual
 
Joomla 3.0 Leicht Gemacht | Kostenlos Buch
Joomla 3.0 Leicht Gemacht | Kostenlos BuchJoomla 3.0 Leicht Gemacht | Kostenlos Buch
Joomla 3.0 Leicht Gemacht | Kostenlos Buch
 
Joomla 3.0 Made Easy | Free E-book
Joomla 3.0 Made Easy | Free E-book Joomla 3.0 Made Easy | Free E-book
Joomla 3.0 Made Easy | Free E-book
 
JSN Boot Configuration Manual
JSN Boot Configuration Manual JSN Boot Configuration Manual
JSN Boot Configuration Manual
 
JSN Neon Customization Manual
JSN Neon Customization ManualJSN Neon Customization Manual
JSN Neon Customization Manual
 
JSN UniForm Configuration Manual
JSN UniForm Configuration ManualJSN UniForm Configuration Manual
JSN UniForm Configuration Manual
 
JSN Kido Configuration Manual
JSN Kido Configuration ManualJSN Kido Configuration Manual
JSN Kido Configuration Manual
 
JSN Vintage Configuration Manual
JSN Vintage Configuration ManualJSN Vintage Configuration Manual
JSN Vintage Configuration Manual
 
JSN Vintage Customization Manual
JSN Vintage Customization ManualJSN Vintage Customization Manual
JSN Vintage Customization Manual
 
JSN Decor Customization Manual
JSN Decor Customization ManualJSN Decor Customization Manual
JSN Decor Customization Manual
 
JSN Decor Configuration Manual
JSN Decor Configuration ManualJSN Decor Configuration Manual
JSN Decor Configuration Manual
 
JSN Pixel Customization Manual
JSN Pixel Customization ManualJSN Pixel Customization Manual
JSN Pixel Customization Manual
 

JSN Epic konfigurationshandbuch

  • 1. Joomla! Template JSN Epic Konfigurationshandbuch (für JSN Epic 4.x) Diese Dokumentation ist unter Creative Commons Attribution-Non-Commercial-Share Alike 3.0 Unported Licence freigegeben. Es ist erlaubt für den freien Gebrauch auszudrucken und zu benutzen. Copyright © 2008 - 2012 http://www.joomlashine.com
  • 2. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Inhaltsverzeichnis Joomla! Template JSN Epic Konfigurationshandbuch ................................................................................. 1 Inhaltsverzeichnis ................................................................................................................................................................2 Einleitung ...............................................................................................................................................................................3 Wichtige Funktionsüberblick ............................................................................................................................................4 Erste Schritte.......................................................................................................................................................................16 Favicon-Konfiguration ......................................................................................................................................................22 Logo.......................................................................................................................................................................................24 Layout....................................................................................................................................................................................26 Farbvariationen...................................................................................................................................................................34 Menüs ....................................................................................................................................................................................38 Schriftarten ..........................................................................................................................................................................59 Module...................................................................................................................................................................................66 Typografie ............................................................................................................................................................................69 Seitenwerkzeuge ................................................................................................................................................................89 SEO & System.....................................................................................................................................................................91 Mobile Edition ...................................................................................................................................................................103 Multilinguale Unterstützung ..........................................................................................................................................111 Was kommt als Nächstes? ............................................................................................................................................117 2
  • 3. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Einleitung Vielen Dank für Ihr Interesse am JSN Epic Template. Wir begrüßen Ihre Entscheidung und hoffen natürlich, dass unser Produkt Sie in Sachen Website und Business bereichern wird. Damit Sie möglichst schnell und effizient den Umgang mit Templates erlernen, empfehlen wir Ihnen die Anleitung in der folgenden Reihenfolge systematisch abzuhandeln: 1. JSN Epic Schnellstart Video – ein kurzes Video-Tutorial, welches Ihnen auf dem schnellsten Wege einen wichtigen Überblick über das JSN Epic Template verschafft. Klicken Sie hier, um zum Video-Tutorial zu gelangen. 2. JSN Epic Konfigurationshandbuch – Hier erfahren Sie ausführliche Informationen über jedes Funktionstemplate und wie Sie diese in Ihre eigene Webseite einbauen können. 3. JSN Epic Anpassungshandbuch– Hier erfahren Sie, wie Sie die verschiedenen Templates an Ihren Bedürfnissen anpassen können. Sie können auch jederzeit alle Dokumente ausdrucken, um ein komfortables Lesen zu gewährleisten. Achtung! Funktionen, die mit gekennzeichnet sind, können NUR in der JSN Epic PRO Edition verwendet werden und sind NICHT in der Free Edition vorhanden. Los geht’s! 3
  • 4. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Wichtige Funktionsüberblick Separate Produktversionen für Joomla! 1.7/2.5 und 1.5 Sämtliche JoomlaShine-Produkte sind in zwei separaten Versionen lieferbar – und mit Joomla! 1.7/2.5 und 1.5 kompatibel! Im Kundenbereich können Sie die Installationsdatei für die entsprechende Joomla!-Version herunterladen. 4
  • 5. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Mobile Edition Alle Templates auf JoomlaShine.com besitzen eine integrierte Edition, die speziell auf moderne Mobilgeräte wie z.B. iPhone oder auf android- und windowsbasierte Mobilgeräte ausgerichtet ist. Im Gegensatz zu anderen Template-Anbietern, entwickeln wir keine mobilen Anwendungen, die durch komplizierte Menügestaltung schwer zu handhaben sind. Wir haben nämlich eine kompakte und leichte Template-Version erstellt, um eine möglichst originale Optik sowie Haptik beizubehalten. Kopfzeile und Top Content Main Body 5
  • 6. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Bottom Content Mobilmenü und Fußzeile Die darüberliegenden Screenshots wurden von einem iPhone 4S aufgenommen, jedoch lässt sich die mobile Edition auch auf allen anderen modernen Großbildgeräten, basierend auf Android und Windows mobile, einwandfrei anzeigen. 6
  • 7. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine CSS/JS-Komprimierung Auf JoomlaShine.com, haben wir uns stets um eine Optimierung unserer Templates mit verschiedenen Techniken wie Image Sprites-Anwendungen, einer saubereren HTML-Code-Programmierung bemüht – neu hinzu kommt die CSS/JS-Komprimierung Diese kombiniert alle CSS/JS-Dateien zu einer einzigen Datei, die in gzip-komprimierter Form an den Browser gesendet wird. Vor der Freigabe der CSS/JS-Komprimierung Nach der Freigabe der CSS/JS-Komprimierung 7
  • 8. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Diese Funktion reduziert erheblich die Anzahl der Serveranfragen sowie die Gesamtladegröße, was in diesem Fall einer Leistungssteigerung von 35% entspricht. Für weitere Informationen, lesen Sie bitte den Abschnitt CSS/JS-Komprimierung in diesem Handbuch. 8
  • 9. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine UniIcons JSN Epic ist mit 20 sorgfältig ausgewählten Icons bereitgestellt, die für vielerlei Zwecke eingesetzt werden können. Dieses Konzept nennen wir UniIcons. - “article” - “download” - “info” - “selection” - “calendar” - “folder” - “mail” - “settings” - “cart” - “help” - “online” - “star” - “comment” - “home” - “rss” - “statistics” - “display” - “image” - “search” - “user” Hier sehen Sie einige Beispiele, in denen Icons besonders effektiv und anschaulich verwendet wurden. UniIcons an Menügegenständen UniIcons an Links 9
  • 10. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine UniIcons an Modulkopfzeilen UniIcons an Listengegenständen Mehrere Icons, ein Bild JSN Epic verwendet die Image Sprite CSS-Technik, um die Zahl an Serveranfragen zu reduzieren. Technisch gesehen, werden alle Icons zu einer einzelnen Bilddatei zusammengeführt, wodurch es nun möglich ist, mit einer Serveranfrage alle Icons zu erhalten. Wenn Sie Näheres zu diesem Themengebiet wissen möchten, hier weitere Informationen über CSS Sprites. 10
  • 11. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Native RTL Unterstützung Rechts-Links JSN Epic-Layout Jede JoomlaShine-Template ist mit einer nativen RTL-Unterstützung ausgestattet. Dafür haben wir eine Menge an Zeit investiert, die wir damit verbracht haben jedes noch so kleine Detail zu optimieren, damit es im RTL- Modus eine besonders große Wirkung erzielt. Alles ist horizontal gedreht einschließlich der Klappmenüs von Haupt- und Seitenmenüs. Um den RTL-Modus zu aktivieren, benötigen Sie hier keine zusätzlichen Template-Konfigurationen. Geben Sie dafür lediglich die RTL-Sprache in die Joomla!-Verwaltung ein – unser Template wird dies automatisch erkennen. 11
  • 12. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Multilinguale Unterstützung In den JoomlaShine.com-Templates wird der gesamte Text des Backend und Frontend zu Sprachdateien geleitet, wodurch eine Übersetzung in jede beliebige Sprache möglich ist. Derzeit unterstützen unsere Templates 12 Primärsprachen, wobei weitere in Zukunft hinzukommen werden. Englisch Deutsch Für weitere Informationen über unterstützte Sprachen, lesen Sie bitte den Abschnitt Multilinguale Unterstützung in diesem Handbuch. 12
  • 13. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Flash-Galerie Ein weiteres Produkt von JoomlaShine.com ist die Flash-Galerie, die Sie auf unserer Demo-Webseite sehen - JSN ImageShow. Dieses Produkt ist mit einer Komponente, mit einem Modul und einem Inhalts-Plugin, sodass Sie Ihre Galerie überall und auf jeder Webseite präsentieren können. Mit Flash-Technologie angewandt, versichern wir Ihnen, dass die Galerie auf allen Browsern konsistent angezeigt wird. JSN ImageShow ist NICHT im Template-Paket enthalten, jedoch steht es kostenlos als Download zur Verfügung. Lernen Sie mehr über JSN ImageShow. Modulpräsentation Hier sehen Sie, wie JSN ImageShow als Slideshow-Modul in der promo-Position dargestellt wird. JSN ImageShow als Slideshow-Modul 13
  • 14. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Pluginpräsentation Hier wiederum sehen Sie, wie JSN ImageShow als vollfunktionsfähige Galerie einschließlich Miniaturansichten angezeigt wird. JSN ImageShow als Galerie im Main Body Content 14
  • 15. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Mobile Optimierung Für Mobilgeräte, haben wir eine extra leichte JavaScript-Version entwickelt – ideal für Bildpräsentationen. Mobil optimierte Präsentation (Screenshot mit iPhone 3GS aufgenommen) 15
  • 16. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Erste Schritte Template-Installation Laden Sie sich die Template-Installationsdatei jsn_epic_XXX_jY.Y_Z.Z.Z.zip herunter, wobei:  XXX die Template-Edition ist. Sie haben die Auswahl zwischen free und pro.  Y.Y die von Templates unterstützte Joomla-Version ist. Verfügbar sind die Versionen 1.5 und 1.7/2.5.  Z.Z.Z die Template-Version ist. Es handelt sich hierbei um eine Standardinstallationsdatei, die wie üblich in der Joomla!-Verwaltung installiert wird. Zur Erinnerung, hier die wichtigsten Schritte: Für Joomla! 1.7/2.5: 1. In der Joomla!-Verwaltung, gehen Sie zum Menü Erweiterungen -> Erweiterungen. 2. Wenn Sie bei den Erweiterungen sind, klicken Sie auf Durchsuchen und wählen die Installationsdatei jsn_epic_XXX_jY.Y_4.Z.Z.zip aus. Anschließend klicken Sie auf Hochladen & Installieren. 3. Die Installationsdatei wird daraufhin auf ihrem Server hochgeladen und in Joomla! installiert. 4. Setzen Sie die Template-Einstellungen auf Standard und gehen Sie danach zum Menü Erweiterungen -> Templates. Für Joomla! 1.5: 1. In der Joomla!-Verwaltung, gehen Sie zum Menü Erweiterungen -> Installieren/Deinstallieren. 2. Wenn Sie bei den Erweiterungen sind, klicken Sie auf Durchsuchen und wählen die Installationsdatei jsn_epic_XXX_jY.Y_4.Z.Z.zip aus. Anschließend klicken Sie auf Hochladen & Installieren. 3. Die Installationsdatei wird daraufhin auf ihrem Server hochgeladen und in Joomla! installiert. 4. Setzen Sie die Template-Einstellungen auf Standard und gehen Sie danach zum Menü Erweiterungen -> Templates. 16
  • 17. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Template-Parameter Template-Parameter in Bereiche geordnet Alle JoomlaShine-Templates können mühelos durch Template-Parameter eingestellt werden. In der Template- Konfiguration finden Sie insgesamt 55 Template-Parameter, die nach logischen Gruppen für das praktische Arbeiten arrangiert sind. Um Zugang zur Konfiguration zu erhalten, befolgen Sie bitte die folgenden Schritte: Für Joomla! 1.7/2.5: 1. Zu den Templates gelangen Sie, indem Sie ins Menü Erweiterungen -> Templates gehen. 2. Klicken Sie auf den Template-Namen JSN_Epic_XXX. Hierbei bezieht sich XXX auf Ihre entsprechende Template-Edition. 3. Bei der Template Bearbeitung, finden Sie eine Liste mit Template-Parametern im Abschnitt Parameter. 4. Klicken Sie auf Speichern oder Speichern & Schließen, um Ihre Einstellungen zu speichern. Für Joomla! 1.5: 1. Zu den Templates gelangen Sie, indem Sie ins Menü Erweiterungen -> Templates gehen. 2. Klicken Sie auf den Template-Namen JSN_Epic_XXX. Hierbei bezieht sich XXX auf Ihre entsprechende Template-Edition. 3. Bei der Template Bearbeitung, finden Sie eine Liste mit Template-Parametern im Abschnitt Parameter. 17
  • 18. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine 4. Klicken Sie auf Speichern oder Anwenden, um Ihre Einstellungen zu speichern. Template Informationen und automatische Update Benachrichtigungen Der erste Parameterabschnitt ist INFORMATIONEN, wo sich die wichtigsten Informationen über die aktuelle Template-Version befinden. Da wir unsere Templates als Software verstehen, ist eine kontinuierliche Verbesserung unerlässlich. Achten Sie deshalb bitte immer darauf, dass Sie die aktuelle Version benutzen. Zusätzlich finden Sie in diesem Abschnitt relevante Informationen zu Autor und Copyright. 18
  • 19. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Seit JSN Epic Version 4.3.0 prüft der Template automatisch nach den spätesten verfügbaren Download. Klicken Sie auf dem Link jetzt Updaten. Danach erscheint ein neues Fenster auf Ihren Webbrowser. Der erste Schritt, loggen Sie sich mit Ihren JoomlaShine Benutzerdaten ein. Der zweite Schritt, loggen Sie sich mit dem Super Admin Benutzerkonto auf Ihre Webseite ein. Danach klicken Sie auf den Knopf Update template. Somit wird Ihre Template automatisch auf dem neusten Stand aktualisiert. Der Upgrade Prozess dauert etwa eine Minute, danach erscheint eine Fenster mit erfolgreichem Upgrade in Ihrem Webbrowser. Bitte beachten Sie dass bei angepassten CSS auf dem originalen Template die Veränderungen vollständig überschrieben werden. Machen Sie ein Backup der CSS-Datei bevor Sie mit dem Upgrade Prozess beginnen. 19
  • 20. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Installation von Beispieldateien Sämtliche Templates von JoomlaShine besitzen die einzigartige Funktion, Beispieldateien zu installieren, wodurch Ihre Muster-Webseite genauso aussieht wie auf der Template-Demo-Webseite. Im Gegensatz zu anderen Template-Anbietern, die ein umfangreiches Paket mit allen Dateien und der Datenbank der Demo-Webseite liefern, geben wir Ihnen nur einen einzigen Installationslink der direkt auf Ihre aktuelle Webseite installiert. Damit Sie Probedateien installieren können, müssen Sie bitte Folgendes tun: 1. Als Erstes gehen Sie zur Template-Konfiguration, öffnen den Abschnitt BEISPIELDATEIEN und klicken auf Beispieldateien installieren. 2. Anschließend befolgen Sie auf der Seite JSN Epic Beispieldateien Installation die Bildschirmanweisungen, um den Prozess zu starten. 3. Haben Sie alles richtig gemacht, dann werden Sie zur letzten Seite umgeleitet, von dort aus Sie nun auf folgende Optionen zurückgreifen können:  Download backup file  Herunterladen der Backup-Datei des Originalinhaltes, der durch die Beispieldatei ersetzt wurde. Lesen Sie im nächsten Abschnitt mehr über den Umgang mit Backup- Dateien und die damit verbundene Wiederherstellung von Originaldateien.  Return to template settings page  Zur Template-Konfiguration zurückkehren für weitere Konfigurationen.  Go to website front-page  Zur Startseite gehen, um sicherzustellen, dass Ihre Muster-Webseite genauso wie die Demo-Webseite aussieht. 20
  • 21. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Wiederherstellung von Originaldateien Vor dem Installationsprozess der Beispieldatei werden von allen Originaldateien Ihrer Webseite Backups erstellt. Die Backup-Datei befindet sich im Ordner /tmp im Joomla!-Hauptordner auf Ihrem Server. Technisch gesehen ist dies eine zip-Datei, die eine gewöhnliche Textdatei mit SQL-Anweisungen für die Ausführung auf Ihrer Joomla!- Datenbank enthält. Die Wiederherstellung von Originaldateien erfolgt durch die Software phpMyAdmin 3.2.1. 1. Melden Sie sich zuerst bei phpMyAdmin an und wählen Ihre Joomla!-Datenbank aus der linken Spalte. 2. Wählen Sie als Nächstes Import auf der horizontalen Menüleiste. 3. Klicken Sie auf Durchsuchen.. und wählen die Backup-Datei aus, die zip-komprimiert ist. Gehen Sie anschließend in der rechten Ecke der Seite auf Go. Nach der Skript-Ausführung können Sie nun wieder auf Ihre Webseite gehen und stellen fest, dass die Originaldateien wiederhergestellt wurden. 21
  • 22. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Favicon-Konfiguration Favicon ist ein kleines Icon, welches links von der Adresszeile Ihres Browsers positioniert ist. In Joomla! sieht das Icon standardmäßig folgendermaßen aus: Standard Joomla!-Favicon Natürlich kann es sein, dass Sie auf Ihrer Webseite Ihr eigenes Icon benutzen möchten, wie wir auch auf joomlashine.com. JoomlaShine-Favicon Dazu müssen Sie bitte folgende Schritte beachten: Schritt 1: Entwerfen einer eigenen Favicon-Datei Favicon ist technisch eine reguläre 16px * 16px-Icon-Datei mit Namen favicon.ico. In den meisten Fällen ist Favicon eine verkleinerte Version des Firmenlogos, welches im Icon-Format abgespeichert ist. Teilweise sind jedoch die Logos zu speziell, wodurch Favicon von Grund auf neu erstellt werden muss. Dafür gibt es einige professionelle Editor-Software wie z.B. Axialis IconWorkshop und Iconcool Editor. Sie können aber natürlich Online Favicon-Generatoren verwenden. Auf der einen Seite können Sie bei der ersten Methode eine hochqualitative Qualität erwarten, was aber auch einiges an Arbeit verlangt. Auf der anderen Seite ist die zweite Methode wesentlich einfacher, was sich jedoch in der Qualität entsprechend widerspiegelt. 22
  • 23. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Schritt 2: Hochladen der Favion-Datei auf den Server Nachdem Sie Ihre gewünschte Favicon-Datei haben, ist es an der Zeit diese auf Ihren Server hochzuladen. Dazu müssen Sie die Standarddatei überschreiben, indem Sie die Icon-Datei auf Ihren Template-Ordner hochladen. Der Ordner lautet joomla_root_folder/templates/jsn_epic_XXX/, wobei XXX Ihrer Template-Edition entspricht. Falls Sie während des Gebrauchs mit FTP Schwierigkeiten mit Zugriffsberechtigungen haben, empfehlen wir Ihnen Joomla!-Erweiterung JoomlaXplorer. Damit bleibt Ihnen sämtliches Festlegen der Logobreite/-höhe erspart – das Template wird so präsentiert, wie es selbst auch vorhanden ist. Übrigens, falls Sie Ihr neues Icon nicht ausfindig machen können, dann heißt das nicht zwangsläufig, dass Sie etwas falsch gemacht haben. Browser sind so ausgelegt, dass sie den Datenverkehr so gering wie möglich halten, d.h. jedes Mal wenn eine Seite angezeigt wird, wird das Favicon nicht immer aktualisiert. Auch das erneute Aktualisieren der Seite (F5) wird nichts bringen. Sie müssen deshalb also gründlicher an die Sache herangehen:  Mozilla / Firefox / Safari: Halten Sie Shift gedrückt während Sie auf Aktualisieren klicken oder drücken Sie Strg-Shift-R (Cmd-Shift-R auf Apple Mac).  Internet Explorer: Halten Sie Strg gedrückt während Sie auf Aktualisieren klicken oder drücken Sie Strg- F5.  Konqueror: Klicken Sie auf Aktualisieren oder drücken Sie F5.  Opera: Nutzer müssen eventuell ihren Cache komplette löschen; gehen Sie hierfür zu Werkzeuge -> Einstellungen.  Chrome: Drücken Sie Shift-F5. Passiert dann immer noch nichts, dann empfiehlt es sich, die temporären Internetdateien sowie den Verlauf zu löschen. Öffnen Sie Ihre Seite anschließend erneut. 23
  • 24. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Logo Das Logo JSN Epic ist ein Standardmusterlogo, welches Sie mit Ihrem eigenen Logo ersetzen. Das Logo ist eigentlich eine Bilddatei namens logo.png , welches der Ordner joomla_root_ordner/templates/jsn_epic_XXX/images/ beinhaltet. Hierbei bezieht sich XXX auf Ihre entsprechende Template-Edition. Ihre Logo-Datei können Sie manuell durch den Template-Parameter Logo File auswählen. Hinzukommt, dass das Festlegen der jeweiligen Logobreite/-höhe völlig entfällt, da das Template in seiner tatsächlichen Form angezeigt wird. Wenn die Logo-Datei bereit ist, sind folgende Parametereinstellungen möglich:  Logo Verknüpfung – Legen Sie die URL fest, auf die das Logobild verlinken soll. Sie können dies hier festlegen:  Absoluter Link wie http://www.joomlashine.com  Relativer Link vom Joomla!-Hauptordner wie index.php Lassen Sie diesen Parameter frei, falls Sie nicht möchten, dass man überhaupt auf das Logo klicken kann.  Logo Slogan – Fügen Sie den Slogan-Text in das Logobildattribut alt ein. Der Text im alt-Attribut ist für alle Screenreaders sichtbar (gut für die Zugänglichkeit) und Suchmaschinen (gut für SEO).  Farbiges Logo aktivieren – Definieren Sie ein spezielles Farblogo für jede Template-Farbe. Die Farblogo- Datei befindet sich im Ordner images/colors/{farb_name}/. Einrichten von rich-media-Logos durch Module in der logo-Position JSN Epic stellt Ihnen eine Modulposition mit dem Namen logo bereit, wo Sie jedes benutzerdefiniertes HTML- Modul mit einem rich-media Logo hinzufügen können. Ein weiterer Vorteil besteht darin, dass Sie nun mehrere Module mit verschiedenen Logos erstellen und diese in unterschiedlichen Seiten anzeigen lassenkönnen – mithilfe der Funktion der Menümodulzuweisung in Joomla!. Achtung! 24
  • 25. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Falls das Template erkennt, dass einige Module in der logo-Position vorhanden sind, dann wird das Standardlogo mit all ihren Logoparametern deaktiviert: Farbiges Logo aktivieren, Logo Verknüpfung und Logo Slogan. 25
  • 26. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Layout Modulpositionen JSN Epic bietet insgesamt 36 Modulpositionen an und erlaubt Ihnen multiple Layouteinstellungen. Jede Modulposition ist klappbar, d.h. unbenutzte Positionen erscheinen bezüglich benachbarter Module leer. 26
  • 27. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine 27
  • 28. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Layoutdimensionen JSN Epic erlaubt Ihnen die Veränderung der Breite von mehreren entscheidenden Layout-Elementen. Alle Einstellungen erfolgen durch Template-Parameter im Abschnitt LAYOUT EINSTELLUNGEN. Template-Breite Die Template-Breite kann auf drei verschiedenen Möglichkeiten eingestellt werden: Konfiguration der Template-Parameter (niedrigste Priorität) Die Breite des Templates kann durch den Parameter Template Breite eingestellt werden. Dabei stehen Ihnen drei Optionen zur Verfügung:  Eng – Template-Breite (in Pixel) wird definiert durch den Parameter 'Eng' Definition (px).  Breit - Template-Breite (in Pixel) wird definiert durch den Parameter 'Breit' Definition (px).  Dynamisch - Template-Breite (in Prozent) wird definiert durch den Parameter 'Dynamisch' Definition (%). Dies ist die Standardeinstellung und hat die niedrigste Priorität. 28
  • 29. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Konfiguration der Seitenklasse (hohe Priorität) Die Template-Breite kann durch die Seitenklasse eines Menü-Items mit der Syntax custom-width-xxx eingestellt werden, wobei xxx für den gewählten Breitenwert steht. Möglich sind die folgenden Werte: eng, breit und dynamisch. Beispiel:  custom-width-float Diese Einstellung wird die Standardeinstellungen mithilfe des Template- Parameters Template Breite überschreiben. Konfiguration des Seitenwerkzeugbereiches (höchste Priorität) Die Template-Breite kann durch den Seitenbreiten-Schalter aus dem Seitenwerkzeugbereich ausgewählt werden. Diese Einstellung wird vom Besucher besonders bevorzugt und hat demnach die höchstmögliche Priorität. Es überschreibt die Page Class sowie die Standardeinstellungen des Parameters Template Breite. Promo-Links-Breite Sie können die Breite der Modulposition promo-left auf zwei verschiedene Möglichkeiten einstellen: 1. Durch den Template-Parameter Promo Links Breite. Dies ist die Standardeinstellung und hat die niedrigste Priorität. 2. Durch Page Class eines Menü-Items mit der Syntax custom-promoleftwidth-xx; xx ist der gewünschte Breitenwert. Beispiel: custom-promoleftwidth-30 Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen nicht. Promo-Rechts-Breite Sie können die Breite der Modulposition promo-right auf zwei verschiedene Möglichkeiten einstellen: 1. Durch den Template-Parameter Promo Rechts Breite. Dies ist die Standardeinstellung und hat die niedrigste Priorität. 29
  • 30. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine 2. Durch Seitenklasse eines Menü-Items mit der Syntax custom-promorightwidth-xx; xx ist der gewünschte Breitenwert. Beispiel: custom-promorightwidth-30 Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen nicht. Linke Spaltenbreite Sie können die Breite der Modulposition left-column auf zwei verschiedene Möglichkeiten einstellen: 1. Durch den Template-Parameter Linke Spaltenbreite. Dies ist die Standardeinstellung und hat die niedrigste Priorität. 2. Durch Seitenklasse eines Menü-Items mit der Syntax custom-leftwidth-xx; xx ist der gewünschte Breitenwert. Beispiel: custom-leftwidth-30 Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen nicht. Rechte Spaltenbreite Sie können die Breite der Modulposition right-column auf zwei verschiedene Möglichkeiten einstellen: 1. Durch den Template-Parameter Rechte Spaltenbreite. Dies ist die Standardeinstellung und hat die niedrigste Priorität. 2. Durch Page Class eines Menü-Items mit der Syntax custom-rightwidth-xx; xx ist der gewünschte Breitenwert. Beispiel: custom-rightwidth-30 Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen nicht. Innere-linke-Spaltenbreite Sie können die Breite der Modulposition inner-left-column auf zwei verschiedene Möglichkeiten einstellen: 1. Durch den Template-Parameter Innere linke Spaltenbreite. Dies ist die Standardeinstellung und hat die niedrigste Priorität. 2. Durch Seitenklasse eines Menü-Items mit der Syntax custom-innerleftwidth-xx; xx ist der gewünschte Breitenwert. Beispiel: custom-innerleftwidth-30 Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen nicht. 30
  • 31. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Innere-rechte-Spaltenbreite Sie können die Breite der Modulposition inner-right-column auf zwei verschiedene Möglichkeiten einstellen: 1. Durch den Template-Parameter Innere rechte Spaltenbreite. Dies ist die Standardeinstellung und hat die niedrigste Priorität. 2. Durch Seitenklasse eines Menü-Items mit der Syntax custom-innerrirghtwidth-xx; xx ist der gewünschte Breitenwert. Beispiel: custom-innerrightwidth-30 Parameterwerte können nur ganzzahlig angegeben werden - beispielsweise wäre 25% korrekt, 25.5% hingegen nicht. “Main Body” auf der Startseite Einige Webseiten verwenden keinen main body Inhaltsbereich auf der Startseite, sondern nur Module. Mit diesem von JSN Epic entwickelten Parameter können Sie nun flexibel die Anzeige des main body kontrollieren. Wählen Sie No, wenn Sie den main body nur auf Ihrer Homepage ausblenden möchten. Andernfalls wählen Sie Yes, um diesen auf allen Seiten normal anzeigen zu lassen. Gleiche Höhe Mit dieser Funktion von JSN Epic erstellt man alle Module, innerhalb des horizontalen Layouts, die die gleiche Höhe haben. Auch wenn dies ein sehr kreativer Fortschritt für das Template-Layout darstellt, unterstützt diese Technik keine dynamischen Inhaltsmodule. Vor der Freigabe der Funktion „Gleiche Höhe” in der content-bottom-Position 31
  • 32. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Nach der Freigabe der Funktion „Gleiche Höhe” in der content-bottom-Position 32
  • 33. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Haftpositionen Das Template-Layout enthält 6 mögliche Haftpositionen: stick-lefttop, stick-leftmiddle, stick-leftbottom, stick- righttop, stick-rightmiddle und stick-rightbottom. Sie können den genannten Positionen jegliche Module zuweisen oder in ihnen benutzerdefinierte HTML-Module erstellen – alles dient lediglich einer besseren Webseitenpräsentation. Wortwörtlich „haften“ die Module an Ihrem Layout, sodass, wenn Sie mit der Maus nach oben bzw. nach unten scrollen, sich die zugewiesenden Module in die entsprechende Richtung bewegen. Schauen wir doch mal, wie man ein benutzerdefiniertes HTML-Modul erstellt und dieses anschließend in die stick- lefttop-Position platziert. 1. Gehen Sie in der Joomla!-Verwaltung auf Erweiterungen -> Module 2. Klicken Sie auf Neu und wählen Eigene HTML 3. Füllen Sie die Einstellungsfelder aus:  Titel: Mein Haftmodul  Titel anzeigen: Verbergen  Position: stick-lefttop  Status: Freigegeben  Benutzerdefinierte Ausgabe: *HTML-Code* Nun haben wir neue Module, die der Position stick-lefttop zugewiesen sind, erstellt. Sie können jetzt weitere Module auf die restlichen Positionen festlegen: stick-leftmiddle, stick-leftbottom, stick-righttop, stick- rightmiddle, stick-rightbottom. 33
  • 34. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Farbvariationen Template-Farbe JSN Epic bietet insgesamt 6 Primärfarbvariationen zur Auswahl an. Jede Farbvariation bedeckt nicht nur den Haupthintergrund, sondern füllt u.a. auch das Klappmenü, Links und den Tabellenkopf. Alle verfügbaren Farben werden im Folgenden dargelegt: Blau Rot 34
  • 35. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Grün Violett 35
  • 36. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Orange Grau Die Template-Farbe kann auf drei verschiedenen Möglichkeiten eingestellt werden: 36
  • 37. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Konfiguration der Template-Parameter (niedrigste Priorität) Die Template-Farbe kann durch den Template-Parameter Farbschema eingestellt werden. Dies ist die Standardeinstellung und hat die niedrigste Priorität. Konfiguration der Seitenklasse (hohe Priorität) Die Template-Farbe kann durch die Seitenklasse eines Menü-Items mit der Syntax custom-color-xxx eingestellt werden, wobei xxx für die gewählte Farbe steht. Möglich sind die folgenden Werte: blue, red, green, violet, orange und grey. Beispiel:  custom-color-red Diese Einstellung wird die Standardeinstellungen mithilfe des Template- Parameters Farbschema überschreiben. Konfiguration des Seitenwerkzeugbereiches (höchste Priorität) Die Template-Farbe kann durch den Farbschema-Schalter aus Seitenwerkzeugbereich ausgewählt werden. Diese Einstellung wird vom Besucher besonders bevorzugt und hat demnach die höchstmögliche Priorität. Es überschreibt die Seitenklasse sowie die Standardeinstellungen des Parameters Farbschema. 37
  • 38. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Menüs JSN Epic bietet insgesamt 5 Menüstile zur Präsentation Ihrer Webseiten-Navigation an. Da das integrierte Standard Joomla! Menümodul (mod_mainmenu) angewandt wird, brauchen Sie sich nicht mehr um eine externe Menümodulinstallation zu kümmern. Obermenü Mit dem Obermenü können Sie Ihre Menü-Items horizontal anordnen und Ihnen Icons zuweisen. Alle Icons werden direkt in der Menüitems-Konfiguration eingestellt, was sehr praktisch ist. Um das Obermenü einzurichten, wählen Sie bitte das gewünschte Menümodul aus und stellen die Parameter folgendermaßen ein: Für Joomla! 1.7/2.5:  Titel: Top Menu  Titel anzeigen: Verbergen  Position: top  Zugriffsebene: public  Sprache: alle  Menü wählen: Top Menu  Erste Ebene: 1  Letzte Ebene: 2  Untermenüeinträge anzeigen: Nein  Menü-Klassen-Suffix: menu-topmenu menu-iconmenu Für Joomla! 1.5:  Titel: Top Menu 38
  • 39. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine  Titel anzeigen: Nein  Position: top  Menüs: alle  Menü wählen: topmenu  Menüstil: Liste  Erste Ebene: 0  Letzte Ebene: 1  Untermenüeinträge anzeigen: Nein  Menü-Klassen-Suffix: menu-topmenu menu-iconmenu Achtung! Es kommt häufig zu einer Verwechslung zwischen Menü-Klassen-Suffix und Modul-Klassen-Suffix, die beide völlig verschiedene Parameter sind. Achten Sie deshalb bitte sorgfältig auf die jeweiligen Einstellungen. 39
  • 40. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Obermenü-Icons Sie können beliebig UniIcons an Obermenü-Items anhängen, um diese ansprechender zu gestalten. UniIcons ist ein Set bestehend aus 20 voreingestellten Icon, die für vielerlei Zwecke verwendet werden können. Lesen Sie bitte den Abschnitt UniIcons in diesem Handbuch, um mehr über die verfügbaren Icons und ihre Namen zu erfahren. Für die Einstellung der Icons müssen Sie zur Menü-Items-Konfiguration gehen. Gehen Sie hierfür folgendermaßen vor: Für Joomla! 1.7/2.5 Fügen Sie die Symbolkombination icon-xxx zum Parameter Link-CSS-Stil hinzu, wobei xxx für das gewünschte Icon steht. 40
  • 41. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Für Joomla! 1.5 Fügen Sie die Symbolkombination (icon-xxx) zum Titel hinzu, wobei xxx für das gewünschte Icon steht. 41
  • 42. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Hauptmenü Das Hauptmenü ist ein beeindruckendes Funktionsmenü mit einwandfreiem Zugang zur XHTML-Code-Struktur und effektiven Klappmenüs der Untermenübereiche. Um das Hauptmenü einzurichten, wählen Sie bitte das gewünschte Menümodul aus und stellen die Parameter folgendermaßen ein: Für Joomla! 1.7/2.5:  Titel: Main Menu  Titel anzeigen: Verbergen  Position: mainmenu  Zugriffsebene: public  Sprache: alle  Menü wählen: Main Menu  Erste Ebene: 1  Letzte Ebene: All  Untermenüeinträge anzeigen: Ja  Menü-Klassen-Suffix: menu-mainmenu menu-iconmenu menu-richmenu 42
  • 43. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Für Joomla! 1.5:  Titel: Main Menu  Titel anzeigen: Nein  Position: mainmenu  Menüs: alle  Menü wählen: mainmenu  Menüstil: Liste  Erste Ebene: 0  Letzte Ebene: 0  Untermenüeinträge anzeigen: Ja  Menü-Klassen-Suffix: menu-mainmenu menu-iconmenu menu-richmenu Achtung! Es kommt häufig zu einer Verwechslung zwischen Menü-Klassen-Suffix und Modul-Klassen-Suffix, die beide völlig verschiedene Parameter sind. Achten Sie deshalb bitte sorgfältig auf die jeweiligen Einstellungen. 43
  • 44. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Visuelle Spezialeffekte Hauptmenü-Effekt JSN Epic bietet Ihnen eine flüssige und ruckfreie Klappanimation für Untermenübereiche an. Dank der integrierten Joomla! MooTools-JavaScript-Library ist das Einbauen anderer JavaScript-Frameworks überflüssig. Zur Aktivierung müssen Sie den Template-Parameter ‘Main Menu’ Position Effect in der Template-Konfiguration auf Ja setzen. Hauptmenü-Transparenz Ein weiterer visueller Effekt besteht in der Transparenz für Untermenübereiche (etwa 90%). Um diese zu aktiveren, setzen Sie den Template-Parameter 'Main Menu' Position Transparenz auf Ja. 44
  • 45. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Hauptmenü-Icons Sie können beliebig UniIcons an Menü-Items anhängen, um diese ansprechender zu gestalten. Für die Einstellung der Icons müssen Sie zur Menü-Items-Konfiguration gehen. Gehen Sie hierfür folgendermaßen vor: Für Joomla! 1.7/2.5 Fügen Sie die Symbolkombination icon-xxx zum Parameter Link-CSS-Stil hinzu, wobei xxx für das gewünschte Icon steht. 45
  • 46. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Für Joomla! 1.5 Fügen Sie die Symbolkombination (icon-xxx) zum Titel hinzu, wobei xxx für das gewünschte Icon steht. UniIcons ist ein Set bestehend aus 20 voreingestellten Icon, die für vielerlei Zwecke verwendet werden können. Lesen Sie bitte den Abschnitt UniIcons in diesem Handbuch, um mehr über die verfügbaren Icons und ihre Namen zu erfahren. 46
  • 47. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Obermenü- Rich Text Sie können einen Beschreibungstext für Menü-Items hinzufügen, um diese klarer und ersichtlicher darzustellen. Um einen Beschreibungstext zu erstellen, müssen Sie zu den Einstellungen der Menü-Items gehen und folgende Schritte beachten: Für Joomla! 1.7/2.5 Fügen Sie einen Beschreibungstext zum Menü-Items-Parameter Link-Titel-Attribut hinzu. 47
  • 48. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Für Joomla! 1.5 Fügen Sie die Symbolkombination (=) als Trennzeichen zwischen Haupt- und Beschreibungstext im Menü-Items- Titel hinzu. Im darüberliegenden Beispiel ist Home der Haupttext und Start here... der Beschreibungstext. Das Trennzeichen zwischen Ihnen besteht aus der Symbolkombination (=). 48
  • 49. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Hauptmenü-Icons und Rich Text in Kombination Sie können Menü-Items aus der Kombination zwischen Icons und Rich Text einrichten. Für Joomla! 1.7/2.5 49
  • 50. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Für Joomla! 1.5 50
  • 51. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Seitemenü Das Seitenmenü ist ein einzigartiges Vertikalmenü mit Schiebebereichen. Dieses Menü ist äußerst effizient, wenn Sie eine komplexe Navigation mit vielen Menü-Items haben. Um das Seitenmenü einzurichten, wählen Sie bitte das gewünschte Menümodul aus und stellen die Parameter folgendermaßen ein: Für Joomla! 1.7/2.5:  Titel: Side Menu  Titel anzeigen: Anzeigen  Position: left  Zugriffsebene: public  Sprache: alle  Menü wählen: Main Menu  Erste Ebene: 1  Letzte Ebene: Alle  Untermenüeinträge anzeigen: Ja  Menü-Klassen-Suffix: menu-sidemenu menu-iconmenu menu-richmenu 51
  • 52. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Für Joomla! 1.5:  Titel: Side Menu  Position: left  Menüs: Alle  Menü wählen: mainmenu  Menüstil: Liste  Erste Ebene: 0  Letzte Ebene: 0  Untermenüeinträge anzeigen: Ja  Menü-Klassen-Suffix: menu-sidemenu menu-iconmenu menu-richmenu Achtung! Es kommt häufig zu einer Verwechslung zwischen Menü-Klassen-Suffix und Modul-Klassen-Suffix, die beide völlig verschiedene Parameter sind. Achten Sie deshalb bitte sorgfältig auf die jeweiligen Einstellungen. 52
  • 53. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Visuelle Spezialeffekte Seitliche Menü-Effekte Ähnlich dem Hauptmenü, bietet JSN Epic eine flüssige und ruckfreie Schiebeanimation für Untermenübereiche des seitlichen Menüs an. Dank der integrierten Joomla! MooTools-JavaScript-Library ist das Einbauen anderer JavaScript-Frameworks überflüssig. Zur Aktivierung müssen Sie den Template-Parameter Sub Menu (Seitliches Menü) in der Template-Konfiguration auf Ja setzen. Seitliche Menütransparenz Die Untermenübereiche des Seitenmenüs können auch semi-transparent sein. Um dies zu aktiveren, setzen Sie den Template-Parameter Seitliche Menütransparenz auf Ja. Seitliche Menü-Icons und Rich Text Wie im Hauptmenü können Sie Menü-Items aus der Kombination zwischen Icons und Rich Text einrichten. 53
  • 54. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Baummenü Das Baummenü veranschaulicht Menü-Items in einer baumähnlichen Rangordnung, was sehr angemessen für Indexmenüs ist. Sämtliche Untermenü-Items sind bis zur Auswahl des Hauptmenü-Items klappbar. Um das Baummenü einzurichten, wählen Sie bitte das gewünschte Menümodul aus und stellen die Parameter folgendermaßen ein: Für Joomla! 1.7/2.5:  Titel: Tree Menu  Titel anzeigen: Anzeigen  Position: right  Zugriffsebene: public  Sprache: alle  Menü wählen: Main Menu  Erste Ebene: 1  Letzte Ebene: Alle  Untermenüeinträge anzeigen: Nein  Menü-Klassen-Suffix: menu-treemenu menu-iconmenu menu-richmenu 54
  • 55. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Für Joomla! 1.5:  Titel: Tree Menu  Position: left  Menüs: alle  Menü wählen: mainmenu  Menüstil: Liste  Erste Ebene: 0  Letzte Ebene: 0  Untermenüeinträge anzeigen: Nein  Menü-Klassen-Suffix: menu-treemenu menu-iconmenu menu-richmenu 55
  • 56. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Baummenü-Icons und Rich Text Wie im Hauptmenü können Sie Menü-Items aus der Kombination zwischen Icons und Rich Text einrichten. 56
  • 57. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Div-Menü Das Div-Menü ist eine simple aber dennoch sehr anschauliche Menüleiste, die Items durch kaum sichtbare Striche voneinander trennt. Dieses Menü ist daher ziemlich geeignet für die Präsentation von Fußzeilen. Um das Div-Menüeinzurichten, wählen Sie bitte das gewünschte Menümodul aus und stellen die Parameter folgendermaßen ein: Für Joomla! 1.7/2.5:  Titel: Div Menu  Titel anzeigen: Verbergen  Position: footer  Zugriffsebene: public  Sprache: alle  Menü wählen: othermenu  Erste Ebene: 1  Letzte Ebene: 1  Untermenüeinträge anzeigen: Nein  Menü-Klassen-Suffix: menu-divmenu 57
  • 58. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Für Joomla! 1.5:  Titel: Div Menu  Titel anzeigen: Nein  Position: bottom  Menüs: alle  Menü wählen: othermenu  Menüstil: Liste  Erste Ebene: 0  Letzte Ebene: 1  Untermenüeinträge anzeigen: Nein  Menü-Klassen-Suffix: menu-divmenu Achtung! Es kommt häufig zu einer Verwechslung zwischen Menü-Klassen-Suffix und Modul-Klassen-Suffix, die beide völlig verschiedene Parameter sind. Achten Sie deshalb bitte sorgfältig auf die jeweiligen Einstellungen. 58
  • 59. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Schriftarten Schriftarten JSN Epic bietet 3 Schriftartoptionen für wesentliche Webseitentypen an. Eigentlich besteht jede Schriftartoption aus einer Kombination aus zwei Schriftarten: Eine für den Inhaltstext, die andere für die Überschrift und den Hauptnavigationstext. Zusätzlich existiert für jede Schriftart eine Spezialschriftart – powered by Google Font Directory. 59
  • 60. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Geschäftliche Webseite (Standard) Normale Schriftart Spezialschriftart Dieser kompakte und ordentliche Schriftstil ist eine exzellente Wahl für businessorientierte Webseiten sowie Unternehmenswebseiten. Die Kombination aus Verdana und Arial erscheint als sehr natürlich und ist für die meisten Nutzer geläufig, da diese die meistbenutzten Schriftarten im Internet sind. Darunter finden Sie eine Beschreibung für die jeweilige Schriftart: Schriftart für PC Schriftart für Mac Spezialschriftart (Standard) (Standard) Überschrift/Menütext Verdana Geneva Nobile Inhaltstext Arial Helvetica N/A 60
  • 61. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Personelle / Blog Webseite Normale Schriftart Spezialschriftart Der Schriftstil ist hier ein wenig größer als üblich und somit ideal für kleinere Webseiten wie persönliche Webseiten und Blogs. Durch die Kombination aus Georgia und Trebuchet MS ist der Inhalt leicht zu lesen und wird dadurch stärker hervorgehoben. Darunter finden Sie eine Beschreibung für die jeweilige Schriftart: Schriftart für PC Schriftart für Mac Spezialschriftart (Standard) (Standard) Überschrift/Menütext Georgia serif Lobster Inhaltstext Trebuchet MS Helvetica N/A 61
  • 62. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Online Nachrichten / Magazin Webseiten Normale Schriftart Spezialschriftart In diesem Schriftstil wird eine weitere, sehr populäre Schriftart namens Times New Roman angewandt. Diese Schriftart ist bei Druckindustrien weit verbreitet und wird auch in einigen sehr bekannten Online-Nachrichtenseiten wie The New York Times verwendet. Also, falls Sie mit dem Gedanken spielen so etwas zumachen, dann lohnt es sich diese Schriftartkombination auszuprobieren. Darunter finden Sie eine Beschreibung für die jeweilige Schriftart: Schriftart für PC Schriftart für Mac Spezialschriftart (Standard) (Standard) Überschrift/Menütext Palatino Linotype Palatino Droid Serif Inhaltstext Times New Romam Times N/A 62
  • 63. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Schriftstil-Konfiguration Der Template-Schriftstil kann auf zwei verschiedenen Möglichkeiten eingestellt werden: Konfiguration der Template-Parameter (niedrigste Priorität) Der Template-Schriftstil kann durch den Parameter Schriftstil eingestellt werden. Dies ist die Standardeinstellung und hat die niedrigste Priorität. Konfiguration der Seitenklasse (hohe Priorität) Der Template-Schriftstil kann durch die Seitenklasse des Menü-Items mit der Syntax custom-textstyle-xxx eingestellt werden, wobei xxx für den gewählten Schriftstil steht. Möglich sind die folgenden Werte: Geschäftliche Webseite, Personelle / blog Webseite und Online Nachrichten / Magazin Webseite. Beispiel:  custom-textstyle-personal Diese Einstellung wird die Standardeinstellungen durch den Template- Parameter Schriftstil überschreiben. 63
  • 64. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Schriftgrade JSN Epic bietet insgesamt 3 Schriftgrößenoptionen für wesentliche Webseitentypen an. Kleine Schriftgröße Mittlere Schriftgröße Große Schriftgröße 64
  • 65. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Die Template-Textgröße kann auf drei verschiedenen Möglichkeiten eingestellt werden Konfiguration der Template-Parameter (niedrigste Priorität) Der Template-Textgröße kann durch den Parameter Template Schriftgröße eingestellt werden. Dies ist die Standardeinstellung und hat die niedrigste Priorität. Konfiguration der Seitenklasse (hohe Priorität) Der Template-Textgröße kann durch die Seitenklasse des Menü-Items mit der Syntax custom-textsize-xxx eingestellt werden, wobei xxx für die gewählte Textgröße steht. Möglich sind die folgenden Werte: small, medium und big. Beispiel:  custom-textsize- big Diese Einstellung wird die Standardeinstellungen mithilfe des Template- Parameters Template Schriftgröße überschreiben. Konfiguration des Seitenwerkzeug-Bereiches Die Template-Schriftgröße kann durch den Schriftgrößen-Schalter aus dem Seitenwerkzeugbereich ausgewählt werden. Diese Einstellung wird vom Besucher besonders bevorzugt und hat demnach die höchstmögliche Priorität. Es überschreibt die Seitenklasse sowie die Standardeinstellungen des Parameters Template Schriftgröße. 65
  • 66. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Module JSN Epic bietet Ihnen insgesamt 4 Box-Designs für das Gestalten von Modulhintergründen an, die in Verbindung mit UniIcons auch für Modulüberschriften geeignet sind. Modulstile werden durch den Modul-Parameter Modul- Klassen-Suffix eingestellt. Die verfügbaren Werte sind im Folgenden beschrieben und sind ohne Anführungszeichen anzuwenden. Modul-Box-Designs Anwendung der Box-Designs auf Module: “richbox-1” “richbox-2” 66
  • 67. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Verfügbare Boxdesigns in der PRO Edition “lightbox-1” “lightbox-2” “solid-1” “solid-2” 67
  • 68. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Modul-Icon-Designs Sie können beliebig UniIcons an Modulüberschriften anhängen. Für die Einstellung von Icons, müssen Sie die Zeichenkette icon-xxx am Modul-Klassen-Suffix hinzufügen, wobei xxx für das gewünschte Icon steht. “icon-star” “icon-online” Sämtliche Icon-Design können in Verbindung mit Modul-Box-Designs verwendet werden: “box-green icon-user” “box-yellow icon-comment” Lesen Sie bitte den Abschnitt UniIcons in diesem Handbuch, um mehr über die verfügbaren Icons und ihre Namen zu erfahren. 68
  • 69. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Typografie Mit einem starken Fokus auf Typografie sind wir der Meinung, dass JSN Epic ein äußerst umfassendes Leistungsvermögen auf dem Gebiet der Inhaltspräsentation besitzt. Überschriften, Text, Links, Tabellen, Bilder – alles wurde mit einem hohen Grad an Verfeinerung gestaltet. Sehen wir uns das Ganze doch mal an. 69
  • 70. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Inhaltsspalten Häufig müssen Sie Ihren Inhalt in mehreren Spalten unterbringen - JSN Epic bietet Ihnen dazu eine sehr praktische Methode an, mit der Sie ohne jegliche Probleme Spalteninhalte erstellen können. Das ist ein weitreichender Fortschritt, da nun Tabellen-Tags am Inhalt überflüssig geworden sind und diese nur für das Anzeigen tabellarischer Daten vonnöten sind. Sie können Ihren Inhalt in beliebig viele Spalten organisieren. JSN Epic erkennt Ihre Spaltenanzahl und ordnet Sie automatisch. Das Einzige, was Sie hier erledigen müssen, ist das Einstellen der grid-layout-Klasse bezüglich des Haupt-DIV-Tags. Unten sehen Sie Screenshots zur Veranschaulichung dieser Funktion und ihrer Funktionsweise: 2-Spalten-Inhalt Anwendung: <div class=”grid-layout”> <div>Text in column 1</div> <div> Text in column 2</div> </div> 3-Spalten-Inhalt Anwendung: <div class=”grid-layout”> <div>Text in column 1</div> <div>Text in column 2</div> 70
  • 71. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine <div> Text in column 3</div> </div> Überschriften Wie wir ja alle wissen, “betiteln” Überschriften Textblöcke, weswegen Sie sich rein optisch gesehen unterscheiden müssen. Dazu stellt uns JSN Epic 5 Gestaltungsmöglichkeiten für Hauptüberschriften zur Verfügung. Um diese anzuwenden, müssen Sie nur den Überschriftentext in normale Überschriften-Tags wie <h1>…</h1>, <h2>…</h2>, <h3>…</h3>, usw. setzen. 71
  • 72. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Texte JSN Epic bietet Ihnen 12 verschiedene Schriftstile zur einfacheren Handhabung Ihres Inhaltes an. Wie diese aussehen, zeigen wir Ihnen im Folgenden: Vorformatierter Text Sie können diesen Stil verwenden, wenn Sie einen Text in seiner exakten Darstellungsweise, d.h. inklusive Weißräume, Tabulatoren und Zeilenumbrüche, innerhalb der <pre>-Tags anzeigen möchten. Anwendung: <pre>Vorformatierter Text</pre> Zitiertext Diesen Stil verwenden Sie, wenn Sie jemanden zitieren möchten (Reden, Artikel, Buchfragmente, Ideen, usw.). Anwendung: <blockquote>Zitiertext</blockquote> 72
  • 73. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Initiale Initialen können Sie beispielsweise in Textparagraphen in Magazinen und Nachrichtenzeitungen einbauen. Anwendung: <p class=”text-dropcap”>Initiale</p> Markierter Text Wenden Sie diesen Stil an, um Schlüsselwörter/-ausdrücke auf einer Suchergebnisseite zu markieren. Anwendung: <span class=”text-highlight”>Markierter Text</span> 73
  • 74. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Meldungs-/Warnungstext Um Nutzer auf wichtige Textparagraphen hinzuweisen, verwenden Sie Meldungs-/Warnungstexte. Anwendung: <p class="text-alert">Meldungs-/Warnungstext</p>. <div class="text-alert">Meldungs-/Warnungstext</div>. Infotext Infotexte verwenden Sie, wenn Sie den Nutzer in über etwas Bestimmtes informieren möchten. Anwendung: <p class="text-info">Infotext</p>. <div class="text-info"> Infotext </div>. 74
  • 75. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Download-Text Dieser Stil wird für informierende Textparagraphen bezüglich von Ladevorgängen angewendet. Anwendung: <p class="text-download"> Download-Text </p>. <div class="text-download"> Download-Text</div>. Tipptext Tipptexte sind besonders geeignet für nützliche Informationen wie z.B. Tipps, Hinweise und Hilfetexte. Anwendung: <p class="text-tip"> Tipptext </p> <div class="text-tip"> Tipptext </div> 75
  • 76. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Kommentartext Verwenden Sie diesen Stil um kommentierende Textparagraphen zu erstellen. Anwendung: <p class="text-comment"> Kommentartext </p> <div class="text-comment"> Kommentartext </div> Anhangstext Für informierende Textparagraphen, die Dateianhänge enthalten, verwenden Sie Anhangstexte. Anwendung: <p class="text-attachment"> Anhangstext </p>. 76
  • 77. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Videotext Mit diesem Stil lassen sich Videodateien in beschreibenden Textparagraphen einfügen. Anwendung: <p class="text-video"> Videotext </p> <div class="text-video"> Videotext </div>. Audiotext Verwenden Sie den Stil Audiotext für beschreibende Textparagraphen, wenn Sie Audiodateien einfügen möchten. Anwendung: <p class="text-audio"> Audiotext </p> <div class="text-audio"> Audiotext</div>. 77
  • 78. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Links Icon-Links Sie können beliebig UniIcons am vorderen Ende eines Links anhängen, indem Sie einfach eine Klasse hinzufügen. Anwendung: <a class="link-icon icon-xxx"> Linktext </a>, wobei xxx für das gewünschte Icon steht. Beispiel: <a class="link-icon icon-download"> Linktext</a> Button-Links JSN Epic bietet Ihnen ganze 6 verschiedene Button-Stile für die Dekoration jeglicher Aufruflinks, die sich in Ihrem Inhalt befinden, an. Anwendung: <a class="link-button button-xxx"> Linktext </a>, wobei xxx die gewünschte Button-Farbe ist. Zur Auswahl stehen folgende Farben: light, dark, green, orange, blue und red. 78
  • 79. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Beispiel: <a class="link-button button-orange"> Linktext </a> Button- und Icon-Links in Kombination Sie können Button-Links und Icon-Links auch in Kombination verwenden. Anwendung: <a class="link-button button-xxx"><span class="link-icon icon-yyy"> Linktext </span></a>, wobei xxx und yyy jeweils für die Button-Farbe bzw. für das gewünschte Icon steht. Beispiel: <span class="link-button button-green"><a class="link-icon icon-cart"> Linktext </a></span> Erweiterungslink JSN Epic ist nicht nur in der Lage Icons am vorderen Ende von Links hinzuzufügen, sondern stellt Ihnen auch 24 Erweiterungs-Icons für das hintere Ende von Links zur Verfügung. 79
  • 80. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Dabei gibt es die Anwendung von Erweiterungs-Icons zwei Möglichkeiten. Automatische Zuweisung JSN Epic kann Links mit unzähligen, gängigen Dateierweiterungen erkennen und dementsprechend Icons zuweisen. Mittels moderner CSS2-Spezifikation erlaubt Ihnen diese Funktion eine einwandfreie Zuweisung von aussagekräftigen Icons, die keiner Modifikation im XHTML-Code bedarf. Zusätzlich werden dabei auch die jeweiligen Protokolltypen zur Icon-Zuweisung bezüglich Instant-Messengers, E-Mail, usw. erkannt. Manuelle Zuweisung Wie bereits genannt, werden die meisten Browser-Icons dank moderner CSS2-Spezifikation automatisch zugewiesen. Leider wird gerade diese Spezifikation vom IE6 nicht unterstützt, weswegen Sie die Einstellung geeigneter Klassen für Links manuell betätigen müssen. Wenn Sie den Template-Parameter zur automatischen Zuweisung ausgeschaltet haben, kann dies natürlich auch hilfreich sein, wenn Sie manuell Icons Links zuweisen möchten. Anwendung:<a class="link-icon-ext icon-ext-xxx">Linktext</a>, wobei xxx für das gewünschte Icon steht. - “aim” - “excel” - “movie” - “skype” - “application” - “feed” - “msn” - “text” - “archive” - “flash” - “music” - “torrent” - “calendar” - “font” - “pdf” - “vcard” - “css” - “mail” - “powerpoint” - “yahoo” - “doc” - “mobile” - “quicktime” - “windowsmedia” JSN Epic verwendet die Image Sprite CSS-Technik, um die Zahl an Serveranfragen zu reduzieren. Technisch gesehen, werden alle Icons zu einer einzelnen Bilddatei zusammengeführt, wodurch es nun möglich ist, mit einer Serveranfrage alle Icons zu erhalten. Wenn Sie Näheres zu diesem Themengebiet wissen möchten, hier weitere Informationen über CSS Sprites. 80
  • 81. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Tabellen Tabellarische Daten zählen zu den verbreitesten Informationstypen auf dem Gebiet Webpräsentation. Standardmäßig, sehen Tabellen nicht sehr ansprechend aus und sind zudem schwer leserlich. Hierbei stellt Ihnen JSN Epic 3 Tabellentypen für die virtuelle Präsentation von tabellarischen Daten zur Verfügung. Tabellenkopf-Farbstil Anwendung: <table class="table-style style-colorheader">...</table> Farbstreifen-Stil Anwendung: <table class="table-style style-colorstripes">...</table> 81
  • 82. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Graustreifen-Stil Anwendung: <table class="table-style style-greystripes">...</table> Achtung: Um eine korrekte Anzeige der Tabellenstile zu gewährleisten, müssen Sie einen zuverlässigen XHTML-Code erstellen. <table width="100%" class="table-style style-colorheader"> <thead> <tr> <th>Table header</th> <th>Column header 1</th> <th class=”highlight”>Column header 2</th> <th>Column header 3</th> </tr> </thead> <tfoot> <tr> <th>Table footer</th> <td colspan="3">Footer data</td> </tr> </tfoot> <tbody> <tr class="odd"> <th>Row header 1</th> <td>Lorem ipsum</td> <td class=”highlight”>Dolor sit amet</td> <td>Lorem ipsum</td> </tr> </tbody> </table> 82
  • 83. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Listen Listen sind wesentliche Bestandteile eines jeden Inhaltes – dies gilt nicht nur für Online-Webseiten. Sie erleichtern den Zugang zum Inhalt erheblich und ermöglichen schon auf dem ersten Blick eine rasche Aufnahme von wichtigen Informationen. Standardlisten Ungeordnete Liste Geordnete Liste Anwendung: Anwendung: <ul><li>…</li></ul> <ol><li>…</li></ol> Liste ohne Aufzählungszeichen Horizontale Liste Anwendung: Anwendung: <ul class="list-nobullet"><li>…</li></ul> < ul class="list-horizontal"><li>…</li></ul> 83
  • 84. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Pfeillisten Pfeilliste - Rot Pfeilliste - Blau Anwendung: Anwendung: <ul class="list-arrow arrow-red"><li>…</li></ul> <ul class="list-arrow arrow-blue"><li>…</li></ul> Pfeilliste - Grün Anwendung: <ul class="list-arrow arrow-green"><li>…</li></ul> 84
  • 85. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Icon-Listen Sie können beliebig UniIcons an Listengegenständen anhängen. Für die Einstellung von Icons, müssen Sie die Zeichenkette icon-xxx an die <ul>-Klasse hinzufügen, wobei xxx für das gewünschte Icon steht. Artikel-Icon-Liste Ordner-Icon-Liste Anwendung: Anwendung: <ul class="list-icon icon-article"><li>…</li></ul> <ul class="list-icon icon-folder"><li>…</li></ul> Lesen Sie bitte den Abschnitt UniIcons in diesem Handbuch, um mehr über die verfügbaren Icons und ihre Namen zu erfahren. 85
  • 86. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Numerische Listen Numerische Liste - Blau Numerische Liste - Grün Anwendung: Anwendung: <ul class="list-number-bullet bullet-blue"><li>… <ul class="list-number-bullet bullet-green"><li>… Numerische Liste - Grau Numerische Liste- Orange Anwendung: Anwendung: <ul class="list-number-bullet bullet-grey"><li>… <ul class="list-number-bullet bullet-orange"><li>… 86
  • 87. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Numerische Liste - Rot Numerische Liste - Violett Anwendung: Anwendung: <ul class="list-number-bullet bullet-red"><li>… <ul class="list-number-bullet bullet-violet"><li>… Numerische Liste – Blaue Ziffern Numerische Liste – Grüner Ziffern Anwendung: Anwendung: <ul class="list-number-digit digit-blue"><li>… <ul class="list-number-digit digit-green"><li>… 87
  • 88. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Numerische Liste – Graue Ziffern Numerische Ziffern – Orange Ziffern Anwendung: Anwendung: <ul class="list-number-digit digit-grey"><li>… <ul class="list-number-digit digit-orange"><li>… Numerische Liste – Rote Ziffern Numerische Liste – Violtte Ziffern Anwendung: Anwendung: <ul class="list-number-digit digit-red"><li>… <ul class="list-number-digit digit-violet"><li>… 88
  • 89. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Seitenwerkzeuge JSN Epic bietet Ihnen drei neue Funktionen zur Steigerung Ihrer Nutzererfahrung an: Seitenbreiten-Schalter, Schriftgrößen-Schalter und Farbschema-Schalter. Durch Freigabe dieser Sektoren wird ein bestmögliches Erlebnis für die Besucher Ihrer Webseite gesichert. Alle Einstellungen der Seitenwerkzeuge werden beim Besucher als Browser-Cookies für den weiteren Gebrauch gespeichert. Bei Deaktivierung aller Sektoren, werden keine Seitenwerkzeuge angezeigt. Präsentation von Seitenwerkzeugen Für die Präsentation von Seitenwerkzeugen gibt es zwei mögliche Optionen. Klappmenü Mit dieser Option sind alle Schalter elegant im Untermenübereich angeordnet. Die Klappanimation, die Transparenz Hintergrundfarbeinstellungen werden von den Hauptmenüeinstellungen übernommen. Inline-Reihe Wählen Sie diese Option, wenn Sie alle Sektoren direkt auf Ihrer Hauptmenüleiste anzeigen wollen. Zudem ist diese Option sehr geeignet, wenn Sie nur einige Schalter freigeben möchten. 89
  • 90. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Seitenbreiten-Schalter Diese Auswahl erlaubt Ihren Besuchern die optimale Template-Breite auszuwählen. Weitere Informationen über die Template-Breite finden Sie im Abschnitt Layoutdimensionen. Sie können diese Auswahl deaktivieren, indem Sie den Template-Parameter Aktiviere Seitenbreiten-Schalter auf Nein setzen. Schriftgrößen-Schalter Diese Auswahl erlaubt Ihren Besuchern die optimale Textgröße auszuwählen und kommt beispielsweise Menschen mit Sehbeeinträchtigungen sehr gelegen. Weitere Informationen über Textgrößen finden Sie im Abschnitt Schriftgrade. Sie können diese Auswahl deaktivieren, indem Sie den Template-Parameter Aktiviere Schriftgrößen-Schalter auf Nein setzen. Farbschema-Schalter Diese Auswahl erlaubt Ihren Besuchern das gewünschte Farbtheme auszuwählen und ist beispielsweise eine wirklich schöne Funktion auf sozialen Internetplattformen, wo auf Vorlieben des Besuchers besonders geachtet wird. Sie können bestimmte Farben in Ihre Auswahl einbinden, indem Sie sie im Template-Parameter Farben im Farbschema-Schalter definieren. Beispiel: blue,red,green. Falls Ihre Webseite jedoch eine starke Identitätsfarbe besitzt und Sie es nicht wünschen, dass Besucher andere Farben auswählen können, dann deaktivieren Sie diese Auswahl, indem Sie den Template-Parameter Aktiviere Farbschema-Schalter auf Nein setzen. 90
  • 91. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine SEO & System Quellenanordnung Eine der wichtigsten SEO-Techniken ist es dafür zu sorgen, dass Suchmaschinen Ihren wesentlichen Inhalt anzeigen. Um dies zu ermöglichen, generieren wir in unserer Template-Code-Struktur zuerst den “center” – Abschnitt und erst danach die “left”- und “right”-Spalten. Sie können dies mittels des Lynx-Browsers (online oder offline) überprüfen. 91
  • 92. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Webseitenüberschrift Diese Funktion erlaubt Ihnen einen bestimmten Wert, der durch den Parameter Name der Website bei Joomla!- Globale Einstellungen definiert wird, zu nutzen und ihn im Tag <title> auf jeder Seite anzeigen zu lassen. Standardmäßig, zeigt Joomla! den Name der Website nur auf dem Backend und auf der Offlineseite an. Mit dem Parameter Seitentitel können Sie nun den Site Name am Fronend auf jeder Seite anwenden. Dies ist eine sehr gute Funktion um Ihre Suchmaschinenoptimierung zu verbessern, da Sie Ihre Webseitenüberschrift mit einigen wichtigen Schlüsselwörtern gezielt definieren können und diese auf jeder Seite anzeigen können. Beachten Sie dass der Parameter nur in Joomla 1.5.x. vorhanden ist. Seit der Version Joomla 1.7.x. ist der Parameter in den globalen Konfiguration von Joomla CMS inbegriffen. 92
  • 93. Joomla! template JSN Tendo Konfigurationshandbuch © Folgen Sie uns auf Twitter http://www.twitter.com/joomlashine Folgen Sie uns auf Facebook http://www.facebook.com/joomlashine Top H-Tag Mit dieser Funktion können Sie den Webseiten-Slogan in den <h1> -Tag setzen, was die SEO und die Zugänglichkeit begünstigt. <h1> ist der wichtigste Inhalts-Tag, dessen Inhalt besondere Beachtung bei Suchmaschinen findet. Haben Sie bereits eine kennwortgeschützte Webseitenüberschrift sowie einen Slogan eingestellt, können Sie diese im ersten <h1> -Tag einbinden, um Ihren SEO-Rank zu erhöhen. 93