| Live Search |
|---|
INHALTSVERZEICHNIS
| Table of Contents | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
|
...
Grundsätze
Alles an einem Ort
...
Wenn Sie in der Verwaltung oder im internen Bereich eingeloggt sind, wechseln Sie oben links auf den Bereich «Webseite». Nun wird Ihnen Ihre Webseite im aktuellen Zustand angezeigt, und darüber das Bearbeitungsmenü «CMS».
...
Über dieses Menü können Sie die gesamte Webseite administrieren. Daneben finden Sie die Menüs für Artikel, Kalender und Galerie. Dort können Sie Newsmeldungen, Termine und Fotos erfassen, die Sie dann in der Webseite einbinden können.
Trennung von Design und Inhalt
Sie können Inhalte unabhängig vom Design der Website erstellen. Es ist problemlos möglich, zuerst Seiteninhalte zu erfassen, und das Design der Webseite (Farben, Hintergrund, Schriftarten) nachträglich anzupassen. Für die Design-Anpassungen finden Sie im CMS-Menü daher einen separaten Punkt «Design», wo Sie eine neue Theme-Konfiguration erstellen und anschliessend aktivieren können. Sie können beliebig viele Konfigurationen erstellen und in der Vorschau ansehen. Erst wenn Sie es aktivieren, ist es für die normalen Benutzer sichtbar.
Trennung von Navigationsstruktur und Inhalt
...
Sie können die Menüstruktur jederzeit umbauen, ohne Seiteninhalte neu erstellen zum müssen. Die Navigationsstruktur können Sie bearbeiten, indem Sie im Bereich „Navigation & Seiten“ in der Seitenspalte auf das Menü-Symbol neben „Hauptnavigation“ klicken. Auf der Hauptnavigation-Bearbeitungsseite können Sie neue Menüpunkte erstellen sowie bestehende neu ordnen, indem Sie sie auf den linken Seite mit der Maus packen und an eine andere Stelle schieben.
Responsive Design: Automatische Anpassung auf Bildschirmgrössen
Die Website ist von Grund auf «responsive», d.h. alle Seiten werden automatisch an die verschiedenen Bildschirmgrössen von Smartphone bis HD-Bildschirm angepasst. Dies bedeutet, dass die Spaltenbreiten des Seiteninhalts variabel sind. Dies gilt es zu Bedenken, wenn Sie Seiteninhalte erstellen.
Webseiten-Einstellungen
Allgemein
...
Mit Klick auf CMS und Einstellungen gelangen Sie zu den allgemeinen Webseiten-Einstellungen.
...
Hier können Sie u.a. Ihr Standard-Vereinslogo oder eine Seitenbeschreibung eingeben. Zudem können Sie ein Favicon hinterlegen. Für Favicons empfehlen wir eine Auflösung von 16x16 oder 32x32px.
Google Analytics und der Tracking-Code
Google-Analytics4 (GA4) Konto erstellen und einrichten
Um für Ihre Webdomain Statistiken zu sammeln, können Sie in den Webseiten Einstellungen von Fairgate Google-Analytics mit der zugehörigen ID einbinden.
...
Ab Juli 2023 wird Google die GA3 Konten abschalten und soweit sperren, dass man nur noch lesend darauf zugreifen kann. Da von Google keine Übernahme Ihrer Daten zu GA4 angeboten wird, muss hier eine neue Google-Analytics 4 ID erstellt und in Fairgate eingebunden werden.
Tracking-Code im CMS eintragen
Gehen Sie in die CMS-Einstellungen.
...
Anschliessend können Sie die Statistiken über Ihren Google-Analytics-Account checken. Es kann allerdings ein paar Tage dauern, bis eine erste brauchbare Auswertung entsteht.
Benutzerrechte
...
Für das Webseitenmodul können Sie Berechtigungen für alle Bereiche oder für gezielte Seiten vergeben.
...
Sie haben engagierte (Vorstands)Mitglieder oder Trainer? Dann können Sie auch Bearbeitungsrechte gezielt für einzelne Seiten vergeben. So können Sie die administrativen Arbeiten auf viele Schultern verteilen (2)
...
Webseiten-Struktur
Mit der Webseiten Struktur entscheiden Sie, welche Menüpunkte und Seiten es auf Ihrer Webseite geben soll, um passende Informationen schnell zugänglich zu machen. Die Struktur kann jederzeit geändert werden.
Hauptnavigation
Die Hauptnavigation findet sich präsent oben auf Ihrer Webseite (je nach Design teilweise unterschiedlich dargestellt). Hier sollten Sie die wichtigsten Vereinsinformationen platzieren (Vorstand, Mannschaften, Abteilungen, News, Facts etc).
...
Menüpunkte der 2. und 3. Ebene können Sie durch die Drag-&-Drop-Funktion entsprechenden Obermenüpunkten zuordnen.
...
Nebennavigation
Die Nebennavigation steht unabhängig von der Hauptnavigation in einem eigenen Bereich zur Verfügung. Hier im Designbeispiel Vancouver.
...
Die Nebennavigation wird genau wie die Hauptnavigation administriert.
Footer
Der Footer befindet sich auf allen Seiten immer am Ende jeder Seite. Üblicherweise können Sie dort die wichtigsten Direktlinks, die Vereinsadresse bzw. Kontaktdaten oder auch Sponsoren platzieren.
...
Das Design des Footers ändern Sie unter den Designeinstellungen.
Tipp: Versteckte und unsichtbare Seiten
...
Design
...
Fairgate bietet Ihnen Out-of-the-box verschiedene Gestaltungsoptionen für Ihre Webseite.
| Note |
|---|
Die Nutzung von eigenen CSS-Styles ist leider nicht möglich! |
Themes
Für die Gestaltung Ihrer Webseite stellt Fairgate im Designbereich 4 Themes zur Verfügung. Die Nutzung eines eigenen Themes mit CSS oder HTML ist leider nicht möglich.
...
Im oberen Bereich sehen Sie die Themes-Vorlagen, die Sie verwenden und das Theme, dass aktiviert (also im Frontend sichtbar) ist. Sie können mit Klick auf das Dokumenten-Symbol jede Theme-Konfiguration duplizieren.
...
Wenn Sie mit dem Mauszeiger links über den Theme-Namen gehen, können Sie über das Stiftsymbol weitere Designeinstellungen des Themes vornehmen (bearbeiten).
Mit dem Lupensymbol können Sie eine Vorschau Ihrer aktuellen Webseite mit dem Design ansehen → es ist dabei nur eine Vorschau, Besucher der Webseite sehen nach wie vor das aktivierte Theme.
Im unteren Bereich sehen Sie die verfügbaren Themes. Mit Klick auf “Verwenden” können Sie das Theme als Vorlage in den oberen Bereich hinzufügen und dieses dann nach Bedarf anpassen.
...
London
Dieses Design zeigt den Inhaltsbereich mit einer fixen Breite an. Die gesamte Seitenbreite wird damit nicht ausgenutzt. Das Hauptmenü befindet sich mittig im oberen Bereich, die Nebennavigation oben rechts.
In diesem Theme steht Ihnen die Option zur Verfügung, ein Headerbild oberhalb des Menüs zu platzieren.
Beispielwebseite:
...
Rio
Das Rio-Theme hat ebenfalls wie das London Theme eine fixe Inhaltsbreite. Das Hauptmenü befindet sich hier mit im Headerbereich, die Nebennavigation darüber. Aktive Menüpunkte sind mit einem ellipsenförmigen Hintergrund gehighlightet.
In diesem Theme kann man auch ein Headerbild platzieren.
Beispielwebseite:
...
Vancouver
Das Vancouver-Theme bietet die Option, die volle Inhaltsbreite zu nutzen. In diesem Theme ist die Platzierung eines Headerbildes nicht möglich.
Beispielwebseite:
...
Sotschi
Das Sotschi-Theme liefert ein spezielles Hauptmenüband-Design sowie eine feste Inhaltsbreite. Ein individuelles Headerbild kann platziert werden.
Beispielwebseite:
...
Farbschema
Wurde ein Theme ausgewählt und aktiviert kann man anschliessend mit Klick auf das Stiftsymbol das Farbschema des Themes anpassen. Zudem kann man den Namen des Themes individuell setzen über 
| Info |
|---|
Für alle Themes gibt es vorgefertigte Standard Farbschemas. Je nach gewählten Theme kann man unterschiedliche Farben definieren. |
Ein Standard Farbschema kann erst bearbeitet werden, wenn es kopiert wurde, oder man erstellt direkt ein neues:
...
Mit Klick auf 
können die gewünschten Farben eingestellt werden. Wenn Sie mit dem Mauszeiger links über die Titel gehen, erhalten Sie eine Erklärung, wo die Farbe Verwendung findet:
...
Mit Klick in das Feld für die Farbwerte können Sie eine Farbe über den Colorpicker wählen (Werte: RGBA, der Alphawert gibt die Transparenz an, wobei der Wert 0.0 eine vollständige Transparenz ergibt, der Wert 1.0 keine Transparenz):
...
Hintergrundbilder
Sie können der Webseite global (d.h. dann für jede Seite+Unterseite) ein oder mehrere (als Slider oder Zufallsbild) Hintergrundbilder hinzufügen.
Je nach Grösse und Qualität des Hintergrundbildes wählen Sie bitte entweder die Option Skaliert auf Vollbild oder Unveränderte Grösse:
...
Ergänzen: Optimale Formate
Header
...
| Info |
|---|
Das Hinzufügen eines Headers ist nur möglich mit den Themes London, Sotschi und Rio. |
Schriftarten
g
Boxen / Container
CMS Seiten sind grundsätzlich in Container und Boxen aufgeteilt, wobei jeder Container mindestens eine Box enthält. Ein Container kann aus 1 bis 6 Boxen bestehen.
...
Wenn Sie eine Seitenspalte einbinden, nimmt diese im Design “schmal” die Breite einer Box ein, ansonsten die Breite von zwei Boxen:
...
In die jeweiligen Boxen können Sie per Drag & Drop die gewünschten CMS-Elemente ziehen und so Ihre Seiten gestalten:
...
Erweiterte Einstellungen
Boxen und Container können Sie grundsätzlich über die erweiterten Designeinstellungen mit einem individuellen Design (z.B. einer Umrahmung oder einem Hintergrundbild) ausstatten.
Wichtig: Die Designeinstellungen können Sie jeweils für Container und Boxen global oder lokal einstellen. Global bedeutet, dass das Design für alle Container und Boxen auf der Webseite gilt, lokal bedeutet, dass es nur für ausgewählte Container und Boxen gilt.
Navigieren Sie für die erweiterten Einstellungen zu CMS>Design. Bei Ihrem aktivierten Theme gehen Sie auf den Bearbeitungsstift und wechseln dann zum Menüreiter “Boxen/Container”:
...
Container
Um ein individuelles Containerdesign zu erstellen gehen Sie auf das Aktionsmenü und dann auf “Neues Template erstellen”:
...
Vergeben Sie einen Namen für das Template und wählen Sie den Typ “Container”. Den Anzeigebereich können Sie Lokal oder Global einstellen:
...
Wenn Sie nun den erstellten Container anhaken und über das Aktionsmenü auf “Template editieren” gehen, können Sie die individuellen Einstellungen vornehmen.
Wenn Sie nun wieder im CMS zu einer Seite wechseln, können Sie das zuvor angelegte individuelle Containerdesign anwählen, wenn Sie dieses als lokales Design erstellt haben.
Gehen Sie hierfür auf das Zahnrad-Symbol und wählen dann das gewünschte Container-Design aus:
...
In diesem Beispiel wurde ein Hintergrundbild für den Container festgelegt:
...
Boxen
Um ein individuelles Boxendesign zu erstellen gehen Sie auf das Aktionsmenü und dann auf “Neues Template erstellen”:
...
Vergeben Sie einen Namen für das Template und wählen Sie den Typ “Box”. Den Anzeigebereich können Sie Lokal oder Global einstellen:
...
Wenn Sie nun die erstellte Box anhaken und über das Aktionsmenü auf “Template editieren” gehen, können Sie die individuellen Einstellungen vornehmen.
Wenn Sie nun wieder im CMS zu einer Seite wechseln, können Sie das zuvor angelegte individuelle Boxendesign anwählen, wenn Sie dieses als lokales Design erstellt haben.
Gehen Sie hierfür auf das Zahnrad-Symbol und wählen dann das gewünschte Boxendesign aus:
...
In diesem Beispiel wurde eine Hintergrundfarbe für die Box erstellt:
Buttons
Tipp: Bilder verkleinern
Falls Sie Ihren Mitgliedern keine sehr grossen Bildern mit langen Downloadzeiten zumuten möchten, dann sollten Sie diese vor dem Hochladen auf Bildschirmgrösse (z.b. 1024×768 Pixel) verkleinern und bei JPG die Qualität senken (zwischen 70 -85%) , damit kriegen Sie leicht Bilder, die nicht mehr viele Megabyte gross sind. Grössen unter 200KB sind dann gut möglich.
...
Wir haben keine Verbindung zu InterNich LLC und deren Produkte und können für deren Qualität, Datensicherheit und Funktionalität auch keine Verantwortung übernehmen.
Beispielwebsites unserer Kunden
Theme London
TC Sonnenfeld: https://tc-sonnenfeld.ch/
UHC Wyland: https://uhcwyland.ch/
SGIG: https://sgig.ch/
UHT-Schüpbach: https://uht-schuepbach.ch/
HSC-Suhr Aarau: https://hscsuhraarau.ch/
Theme Vancouver
Ski- & Sportclub Richterswil-Samstagern: https://ssc-risa.ch/
Club 1889: https://club1889.ch/
SC Roche: https://scroche.ch/
Zürich Tennis: https://zuerichtennis.ch
Theme Sotschi
VBC Andwil-Arnegg: https://vbcaa.ch/
FC Ems: https://fcems.ch/
Fairgate Academy: https://academy.fairgate.ch/
Theme Rio
TC Zug: https://tczug.ch/
Schützengesellschaft Schachen: https://sg-schachen.ch/
Gemischter Chor Röschenz: https://gemchor-roeschenz.ch/