Apollon für Siquando Web & Shop 10

„Apollon“ für Siquando Shop- und Web 10 von KARO ist ein abgewandelte Variante des Designs „PAN“ und besticht durch das Mega-Menü, auf Wunsch mit Bild, einer One Pager Navigation und Panorama-Absätzen (in voller Browserbreite). Wenn genügend Raum zur Verfügung steht, kann die linke und/oder rechte Kontextspalte fixiert werden. Pro Seite können Sie datenschutzfreundliche Social-Media-Buttons (c't Shariff ) unter dem Inhalt anzeigen lassen.

Bekannte Features von „KARO“ wie ein Hintergrundbild pro Seite, die Lightbox, Google Fonts, eine umfangreiche Slideshow, BB-Code und teilbare Aufmacher sind selbstverständlich bereits integriert.

Neben den umfangreichen Farbeinstellungen für verschiedene Boxen, der Social- Und Infoleiste, den Überschriften und weiteren Bereichen wie Mega- und OnePager-Menü glänzt das Design besonders in der Konfigurierbarkeit der einspaltigen Aufmacher. So können Sie diesen nun in 1 bis 6 Spalten teilen, Sie können die Hintergrundfarbe und vieles mehr bestimmen.

Hier finden Sie eine Live-Demo einer benutzerdefinierten Variante.

Beachten Sie bitte die Lizenzbedingungen . Eine Webmasterlizenz für das Apollon Web 10 Design finden Sie unter Apollon Web 10 für Webmaster , die Webmasterversion für Apollon Shop 10 finden Sie hingegen unter Apollon Shop 10 für Webmaster .

Apollon 10 Web Template

Das responsive Template „Apollon“ für Siquando Web 10 (& Shop 10) besticht durch das Mega-Menü, auf Wunsch mit Bild, einer One Pager Navigation und Panorama-Absätzen. Die linke und/oder rechte Sidebar kann fixiert werden und pro Seite können Sie datenschutzfreundliche Social-Media-Buttons (c't Shariff) unter dem Inhalt anzeigen lassen. (K-034)
49,99 EUR (inkl. 19% USt. zzgl. Versand)

Apollon 10 Shop Template

„Apollon“ für Siquando Shop 10 mit Mega-Menü, auf Wunsch mit Bild, einer One Pager Navigation und Panorama-Absätzen (in voller Breite) ist ideal für Webshops. Ist der Warenkorb mit mindestens einem Artikel gefüllt wird neben dem Symbol im Menü eine Warenkorb-Box angezeigt. Fixieren Sie dazu die Sidebar hat Ihr Besucher den perfekten Überblick über die Artikel im Warenkorb. (K-035)
69,99 EUR (inkl. 19% USt. zzgl. Versand)


neue, globale Eigenschaften in Apollon 10

  • Darstellungsstil der Schaltflächen (Buttons): zu den Auswahlmöglichkeiten zählen (Standard), Scharf, Outline, Verlauf, Rund, Button und Runder Button
  • CDN's (wenn möglich) verwenden
  • Downloadschutz für Bilder
  • Cookie Warnseite Position
  • Kontextspalten-Sichtbarkeit bei mobiler Ansicht
  • Skalierung durch Benutzer zulassen
  • Zeichencodierung
  • geteilte Aufmacher im Card-Design darstellen
  • Radius der abgerundeten Ecken bei geteilten Aufmachern
  • Weiterleitung nach Direkt-Anmeldung
  • neue Farbeinstellung: Schriftfarbe in Kästen
  • neue Farbeinstellung: Registerkarten: Hintergrundfarbe
  • neue Farbeinstellung: Cookie-Warner & Warenkorb-Info: Hintergrundfarbe
  • neue Farbeinstellung: Cookie-Warner & Warenkorb-Info: Schriftfarbe

komplett, überarbeitete Tabellen

Der Tabellenabsatz wurde in Version 10 des Design komplett überarbeitet und der unnötige Bootstrap-Ballast entfernt. Neben den bereits bekannten Farbeinstellungen wie bespielsweise für den Tabellenkopf - oder der Hintergrundfarbe, sind nun pro Tabelle diese erweiteren Einstellungen möglich:

  • Verhalten auf kleinen Bildschirmen: Scrollbarer Ausschnitt | Spalten in Zeilen reorganisieren
  • Grafiken: Bilder, füllen Zellen aus | Symbole, werden nicht vergrößert
  • Tabellenrahmen: Tabellenrahmen darstellen | nur horizontaler Rahmen | keinen Rahmen darstellen
  • Innenabstand in den Zellen: 10px (Standard), 5px oder 2px
  • Tabellenhintergrund: Standardhintergrund | wechselnder Hintergrund | transparenter Hintergrund
  • Tabelle mit runden Ecken
  • Tabelle mit Hovereffekten

„Apollon's“ Funktionen im Detail

  • responsive Slideshow, mit umfangreiche Einstellungsmöglichkeiten und Touchgesten auf Smartphones ( die Slideshow kann auch im Inhaltsbereich angelegt werden)
  • Positionseinstellungen (Infoseiten, Kopfzeile, Social-Icons und Suchfeld)
  • Aufmacher: Sie können die 1-spaltigen Aufmacher in bis zu 6 Spalten teilen (nun auch 5), zusätzlich können die Aufmacher in gleicher Höhe dargestellt werden. Weitere Einstellungen gibt es für die Buttons und den Direktlinks. Außerdem können Sie den Kurztext ausblenden.
  • die Breite des Absatzbildes kann pro Absatz angegeben werden
  • Absatzbildstile: Thumbnail, abgerundete Ecken, Bild kreisförmig darstellen oder keinen Stil anwenden
  • Kontextspalten-Konfiguration pro Hauptseite: beide Sidebars anzeigen oder abschalten, linke oder rechte Kontextspalte anzeigen
  • Google Webfont integriert (für Überschriften, dem Inhaltsbereich und „Schriftart im Menü wie in den Überschriften”)
  • Verwendung von Font-Awesome-Icons in Listen, Links oder per BBCode
  • verschiedene Boxtypen: Linie links oder rechts oder als Zitat, sowie farbige, helle oder dunkle Box (die Farben sind konfigurierbar)
  • integrierte Lightbox mit zusätzlichen Funktionen wie eigenem Beschreibungstext
  • integrierter BB-Code: mit Funktionen wie Icons oder auch Zeilenumbrüchen, zum Beispiel im Aufmacherkurztext (hier finden Sie eine genaue Beschreibung)
  • Smartphone-Einstellungen: Sie können verschiedene Bereiche auf Bildschirmen die schmaler sind als 768 Pixel ausblenden, dazu zählen der Logo-Bereich, der Slider, das Footermenü sowie die linke und rechte Kontextspalte
  • responsive Absätze: auf allen Ausgabegeräten, auf Smartphones anzeigen, auf Tablets anzeigen, auf Desktops anzeigen, auf Desktops größer als 1200px anzeigen, auf Smartphones verstecken, auf Tablets verstecken, auf Desktops verstecken und auf Desktops größer als 1200px verstecken (abhängig davon erfolgt die Ausgabe des Absatzes nur auf den gewählten Geräten)
  • Akkordion und Registerkarten im neuen Look
  • verlinkbare Registerkarten bzw. Tabs
  • Auswahl verschiedener Tabellenstile
  • Tooltip bei verlinkten Bildern (und Eingabe einer Beschreibung)
  • benutzerabhängige Absätze (angemeldeter Benutzer oder Besucher)
  • CSS zur Druckausgabe (verzichten Sie auf das Häkchen „druckbare Seiten erzeugen“, das Design erstellt automatisch druckfähige Seiten)
  • angepasstes Feedback-Plugin (als zusätzliches Modul erhältlich)
  • .... und vielen weiteren Möglichkeiten zur Anpassung des Designs

allgemeine Website-Eigenschaften

  • Animationsstil der Absatzbereiche: Absatzbereiche können Sie per animate.css animieren. Unter daneden.github.io/animate.css/ können Sie die verschiedenen Animationsstile testen
  • Fixierung der Kontextspalte: wählen Sie ob die linke und/oder die rechte Kontextspalte fixiert werden soll
  • wiederholendes Hintergrundbild (für den Inhaltsbereich, auf Wunsch mit Fixierung)
  • Position der Infoseiten: in der Kopfzeile oder im Footerbereich
  • Position der Kopfzeile: über dem Menü oder über dem Footer
  • Position der Social-Icons: in der Kopfzeile oder Icons nicht anzeigen
  • Position des Suchfeldes: in der horizontalen Navigation, in Kopfzeile als Icon, in der linken Sidebar oder in der rechten Sidebar
  • Ausrichtung des Textes
  • Registerkarten zentrieren
  • Bilder in Tabellen skalieren
  • Cookie Warnhinweis
  • HTML-Fußzeilentext (plus Ausrichtung der Fußzeile)
  • „nach oben“ Icon anzeigen
  • Sie sind hier-Navigation
  • Suchbegriffe vorschlagen
  • Touch-Icon (der Dateiname sollte „apple-touch-icon-144-precomposed.png“ lauten)
  • Zurück Schaltfläche am Ende des Inhaltsbereiches anzeigen
  • Überschriften verlinken
  • LESS-Version: wählen Sie auf welcher Weise die CSS-Datei (style.css) ersstellt werden soll

über 670 verschiedene Symbole, mit einer Schrift

Für Listen und Downloads kann jedes Font Awesome 4 Icon verwendet werden. Beispielsweise wird links die FontAwesome Flage mit 4-facher Größe angezeigt. Das Vertika Template verwendet diese Icons bei verlinkten Bildern, Links, Downloads oder auch Aufzählungen. Die Siquando Shop Variante des Designs nutzt die Schrifticons zusätzlich für die verschiedensten Shopsymbolen, bspw. während des Bestellprozesses.


Menüeinstellungen

Neben dem Mega-Menü unter der Socialicons- und Infoleiste, das in den verschiedensten Farben konfiguriert werden kann, kann ein Menü im Footer und in der Kontextspalte angezeigt werden. Wieviele Spalten im Footer angezeigt werden sollen, können Sie natürlich per erweiterter Eigenschaft angeben. Auch das Menü in der Sidebar bietet verschiedene Möglichkeiten , so können Sie pro Hauptseite wählen ob die „erste und zweite Ebene” oder „zweite und dritte Ebene” angezeigt werden soll.

  • Menü (oder OnePager) an oberer Kante fixieren
  • Schriftgrößen der ersten und auch zweiten Ebene für das vertikale Menü und auch für das Footermenü
  • Schriftart wie Überschriften (Google Fonts: https://www.google.com/fonts )
  • Footer: Anzeige des Menüs aktivieren
  • Footer: Anzahl der Spalten (von 1 bis 12)
  • PNG-Bild als Icon und Verlinkung für die Startseite
  • Mega-Menü-Dropdown Spalter
  • Menü mit einem Schatten versehen
  • zusätzliches Menü in linker oder rechten Sidebar

Farbeinstellungen

Die wichtigsten 5 Farben können Sie wie gewohnt in den Einstellungen der Farbpalette vornehmen. Zu diesen 5 Farben zählen Hintergrundfarbe der Kopfzeile, des Menüs, des Inhaltsbereiches, sowie die Schriftfarbe des Inhaltsbereiches.

Viele weitere Farben können unter Website- und FTP-Eigenschaften Erweitert im Bereich „Design (Farben)” bestimmt werden, dazu zählen:

  • Allgemeine Farben: Farbe der H1-, H2- und H3-Überschriften, Schriftfarbe der Links und Schriftfarbe der Links beim Darüberfahren, Hintergrundfarbe der Splitaufmacher
  • Seiten- und Social-Icons Leiste: Farbe der Schrift, Linkfarbe und Linkfrabe beim Darüberfahren
  • Boxen: Hintergrundfarben der hellen, farbigen und dunklen Box
  • „Sie sind hier”-Navigation (Brotkrumennavigation): Hintergrundfarbe und Schriftfarbe (inkl. Links)
  • Buttons: Farbe der Primary-Buttons (z.B. „In den Warenkorb”) - diese Farbe gilt auch für die Paginations (den 1 - 2 -3 Links) sowie für den aktiven Bereich des Menüs in der Sidebar
  • Kästen und Tabellen: alternative Hintergrundfarbe in Tabellen, Hintergrundfarbe des Tabellenkopfes, Hintergrundfarbe von Kästen und Tabellen, Rahmenfarbe von Kästen und Tabellen, Rahmenfarbe von fehlerhaften Kästen, Schriftfarbe des Tabellenkopfes
  • Eingabe- und Auswahlfelder (Shopbereiche): Hintergrundfarbe, Rahmenfarbe und Schriftfarbe

Farbeinstellungen für das Menü

  • 1. Ebene des Menüs: Hintergrund beim Darüberfahren, Schriftfarbe und Schriftfarbe beim Darüberfahren
  • 2. Menüebene: Schriftfarbe, Schriftfarbe beim Darüberfahren und Schriftfarbe des aktives Elementes, sowie Hintergrundfarbe und Hintergrundfarbe beim Darüberfahren

Konfiguration der Schriften

  • Google Fonts für Überschriften und/oder dem Inhaltsbereich: wählen Sie zwischen mehr als 800 Schriftarten. Suchen Sie sich einfach auf fonts.google.com eine Schriftart aus und kopieren den Namen, fügen Sie den Namen der Schriftart in die Eigenschaft ein und das Design kümmert sich um den Rest
  • Schriftgröße der Inhaltsbereiches
  • Schriftgröße der H1-Überschriften
  • Schriftgröße der H2-Überschriften
  • Schriftgröße der H3-Überschriften

benutzerabhängiger Absatz

benutzerabhängige Absätze in web to date 8.0
Klicken Sie auf das Bild um es zu vergrößern.

Diese Eigenschaft eröffnet Ihnen die Möglichkeit Absätze erst für angemeldete Benutzer sichtbar zu machen. Da Sie auch Absätze für Gäste anlegen können, kann ein Besucher Ihrer Website zu einer Registrierung aufgefordert werden, damit weiterer Inhalt angezeigt wird.

Die Standardeinstellung ist hier natürlich „den Absatz immer anzeigen“. Weitere Einstellungsmöglichkeiten sind „nur für Besucher“ und „nur für Registrierte“. Ein deutlich erweiterte Variante mit mehr Optionen finden Sie hier .

Die auf Basis des Flexsliders für web- und shop to date 8 angepasste Slideshow bietet eine Fülle an Optionen . Pro Seite kann zwischen den folgenden Optionen gewählt werden.

Eyecatcher-Optionen

Eigenschafts-Dialog für die verschiedenen Eyecatcher
  • kein Logo anzeigen: die H1-Überschrift befindet sich im Kopfbereich, welcher durch ein wiederholendes Hintergrundbild und einem farblichen Verlauf hervorgehoben wird
  • nur Logo anzeigen: bei dieser Auswahl kann für jede Hauptseite ein eigenes Bild ausgewählt werden
  • Google Map als Eyecatcher (ideal für Ihre Kontaktseite): dafür kann in den globalen, erweiterten Eigenschaften die Adresse, der Typ, die Höhe und der Zoomfaktor angegeben werden
  • Slideshow Einstellungen der Website & FTP-Eigenschaften verwenden: in den globalen, erweiterten Eigenschaften können bis zu 8 Bilder gewählt werden. Zusätzlich kann pro Bild die Verlinkung des Buttons und BB-Code angegeben werden
  • Hauptseiten durchlaufen: hierbei werden alle sichtbaren Hauptseiten/Warengruppen durchsucht und sobald ein Bild auf der Seite ausgewählt wurde, wird dieses auf der Seite angezeigt (auch hier kann zusätzlich BB-Code/Text und eine Verlinkung angegeben werden)
  • Hauptseiteneigenschaften verwenden: diese Eigenschaft ähnelt sehr der Einstellung „Slideshow Einstellungen der Website & FTP-Eigenschaften verwenden“, jedoch erfolgt die Einstellung auf der Hauptseite

Thomas K. schrieb am 30.07.2018 um 07:10

Im Kundenkonto kann ab heute Version 10.0.2 des Designs heruntergeladen werden. Die folgenden Änderungen wurden vorgenommen:
  • interne Webfonts hinzugefügt: Open Sans, Alegreya Sans, Arimo, Calibri, Corbel, Fira Sans, Lato, Noto Sans, Noto Serif, PT Sans, Roboto, Roboto Condensed, Signika, Source Sans Pro, Titillium Web
  • neue Absatzeigenschaft: Überschrift Typ (H2 bis H6)
  • neue Shop-Eigenschaft: Position der Warenkorb-Info mit neuer Option Popover beim Darüberfahren des Warenkorbsymbols
  • Menü-Optimierung bei mobilen Geräten
  • Umstrukturierung der includes für den Shop (aufgrund der internen include Begrenzung)
  • HTML-Code bearbeiten vor Google Analytics verschoben, um die gaOptout() Funktion korrekt positionieren zu können
  • Fehlerbehebung: Farbe der H3-Überschrift wurde nicht übernommen

Thomas K. schrieb am 30.01.2018 um 14:41

Im Kundenbereich ist nun Version 1.0.2 verfügbar. Geändert wurde:
  • Shop: Behebt einen Fehler bei der Feldlänge von Firma bei der Anmeldung
  • Fehlerbehebung: unter bestimmten Umständen wurden die Infoseiten trotz Einstellung nicht zentriert
  • Umbruch bei vielen Menüpunkten wird beim Logo in der Navigation nun verhindert

Thomas K. schrieb am 20.12.2017 um 08:18

Unter Downloads können Apollon 9 Nutzer nun Version 1.0.1 mit den nachstehenden Änderungen herunterladen.
  • die Farbe des Registerkarten-Rahmens kann nun per erweiterte Eigenschaft angegeben werden
  • Tooltip (für Beschreibung des Absatzbildes) bei jedem Absatzbild-Stil
  • Infoseiten (Unterseiten der Startseite) können nun auch im Footer zentriert werden
  • Zurücksetzen des Objektes responsiveClass pro Absatz, damit der Wert nicht ungewünscht vererbt wird
  • linker und rechter Abstand auch in mobiler Ansucht bei der Suche
  • die Schriftgröße für die Infoseiten wird nun übergeben (Einstellung hatte keine Auswirkung)
  • Weiter-Sequenz Buttons erhielten nicht den korrekten Abstand nach links & rechts

KARO Webdesign & Entwicklung (siquando-designs.de) verwendet Cookies, um die Dienste ständig zu verbessern und bestimmte Features zu ermöglichen. Indem Sie hier fortfahren, stimmen Sie dieser Verwendung zu. Mehr erfahren