Bestimmt das Layout der ganzen Seite. Hier können Sie zwischen verschiedenen Darstellungsformen und Farb/Bildschematas wählen sowie Logos hochladen.
FeldBeschreibung
LayoutAuswahl zwischen verschiedenen Layouts. Sie können (in der Premium- oder Plus-Version) auch ein individuelles Layout auf Basis eines HTML-Templates erstellen (siehe: Individuelles Layout) und damit Ihre "Corporate Identity" wahren.
Farb-SchemaAuswahl zwischen verschiedenen Farben
Bild-SchemaAuswahl zwischen verschiedenen Vorlagen-Bildern
Template-Parameter...Enthält das Layout freie Parameter (für z.B. Namen, Urls), dann werden diese hier zum individuellen Befüllen angezeigt
Logo/BilderLogos u.ä. (abhängig vom gewähltem Layout)
Layout-CSS Ermöglicht die Auswahl von Farben u.ä. (abhängig vom Layout)
Individuelles CSS CSS ermöglicht die flexible Formatierung von Webseiten. Siehe nachfolgend.
Individuelles Javascript ab Premium-Version:
Ermöglicht die Ablage von eigenem Javascript-Code
Vereins-App bei beauftragter Individuellen App, ab Plus-Version:
Ermöglicht die Ablage von Startseiten für die individuelle Vereins-App
 Speichern
Speichert die Eingaben und schließt das Fenster

CSS

CSS ermöglicht die Formatierung von Webseiten.
siehe z.B. https://wiki.selfhtml.org/wiki/CSS
Kurzübersicht:
Aufbau jeder Sektion:
bezeichner
{
   format1: wert1;
   format2: wert2;
}
Gültige Bezeichner:
BezeichnerBeschreibung
*Gilt überall
.modulnameGilt nur in dem Modul
Beispiel: .members
.actionnameGilt nur bei der Aktion
Beispiel: .nachlese
.elementGilt nur bei dem entsprechenden Element
Beispiel: .listheader
.linknamestatischeseiteGilt nur bei der entsprechenden statischen Seite
Beispiel: .impressum
.dialogGilt für geöffnete Popups
Beispielhafte CSS-Formate und Werte
Format und WertBeschreibung
color: green;Setzt die Vordergrundfarbe auf grün. Auch beliebige Farbwerte der Form #rrggbb möglich.
background-color: red;Setzt die Hintergrundfarbe auf rot. Auch beliebige Farbwerte der Form #rrggbb möglich.
font-family: Times;Setzt die Schriftart.
Viele weitere CSS-Möglichkeiten können Sie im Internet recherchieren.
Wenn bestimmte Stellen nicht per CSS erreichbar sind (z.B. weil das Programm feste Werte vorgibt oder das Element nicht genau genug adressierbar ist), dann geben Sie uns dies bitte per "Support-Anfrage"-Funktion bekannt!

Vereins-App, Individuelle Seiten

Diese Seite ermöglicht es Vereinen, die eine individuelle App nutzen, öffentliche Startseiten in der App bereitzustellen.
Jede Seite wird durch einen |Page-Befehl eingeleitet.
Kleines Beispiel mit einem Register mit zwei Register-Seiten:
|Page name=startextern type=tab Page "Home" action=home Page "Über uns" action=ueberuns
|Page "Home" name=home Html "https://..../..."
|Page "Über uns" name=ueberuns Html "https://..../..."
Komplette Beschreibung der Möglichkeiten:
BefehlBeschreibungMögliche Parameter
Register-Seiten (hat mehrere Register-Unterseiten)
|Page Register-Hauptseite name=... : Name der Seite ("startextern" ist die Startseite für nicht angemeldete Nutzer)
type=tab : Register (Android: oben, iOS: unten)
type=tabbottom : Register immer unten
icon=https://.../datei.png : Icon des Tab-Registers
Page "Überschrift" Eine Register-Seite action=seitenname
Normale Seiten (Elemente sequentiell untereinander)
|Page "Überschrift" Beginn einer neuen Seite mit der angegebenen Überschrift
Kann auch Platzhalter der übergeordneten Liste enthalten: #CAPTION#, ..
name=... : Name der Seite ("startextern" ist die Startseite für nicht angemeldete Nutzer)
type= : Normale Seite mit beliebigen Elementen
type=noheader : Normale Seite mit beliebigen Elementen, ohne Navigations-Kopf
type=refreshview/refreshviewnoheader : Seite, die durch "nach unten ziehen" aktualsiert werden kann
type=scrollview/scrollviewnoheader : Seite, die auch länger sein kann (nach unten scrollbar)
config:margin=0,50,0,0 : Ränder der Elemente (links,oben,rechts,unten)
config:marginrefresh=.. : ergänzend für "refreshview"
config:marginview=.. : ergänzend für "scrollview"
Image Bild src=https://.../datei.jpg
HeaderImage Bild, das ganz oben ohne Rand angeordnet wird src=https://.../datei.jpg
Listview Liste webservice=WEBSERVICENAME : Aufruf des Anwendungsservers
action=AKTION (siehe unten)
config:template=box : Legt fest, dass die Listen-Elemente als Box dargestellt werden
Html "HTML"
Html "https://..."
Anzeige HTML-Text HTML kann auch Platzhalter der übergeordneten Liste enthalten: #CAPTION#, #HTML#, ..
webservice=WEBSERVICENAME : Aufruf des Anwendungsservers
Button "Text" Anzeige eines Buttons action=AKTION (siehe unten)
webservice=WEBSERVICENAME : Aufruf des Anwendungsservers
value=Enter : legt fest dass dieser Button durch das Enter-Drücken ausgelöst wird
ButtonSub "Text" Anzeige eines untergeordneten Buttons name=GRUPPENNAME
action=AKTION (siehe unten)
Label "Text" Anzeige eines Bezeichners
Field "Text" Anzeige eines Eingabefeldes name=.. : Feldname
FieldPassword "Text" Anzeige eines Passwort-Eingabefeldes name=.. : Feldname
BackgroundImages Anzeige von Hintergrund-Bildern als Slider webservice=WEBSERVICENAME : Aufruf des Anwendungsservers
config:sekunden=10 : Seitenwechsel (Standard: 2)
Weitere Seiten (Elemente mit absoluter Positionierung)
|Page "Überschrift" Beginn einer neuen Seite mit der angegebenen Überschrift name=... : Name der Seite ("startextern" ist die Startseite für nicht angemeldete Nutzer)
type=absolute/absolutenoheader : absolute Anordnung der enthaltenen Elemente
config:margin=0,50,0,0 : Ränder der Elemente (links,oben,rechts,unten)
icon=https://.../datei.png : Icon des Tab-Registers
Image Bild src=https://.../datei.jpg
ImageBack Hintergrund-Bild src=https://.../datei.jpg
Box#x# Buttons im Raster (Box2x2, Box3x4 u.ä.) style=#ffffffff,#325C41,24,B : Hintergrundfarbe,Schriftfarbe,Schriftgröße,fett
x=1..
y=1..
action=AKTION (siehe unten)
Allgemeines
#.... Kommentar (hat keine Auswirkung)
AKTION-Werte:
ActionBeschreibung
seitename Wechselt zur einer anderen Seite (mit Navigation)
:seitenname Wechselt zur einer anderen Seite (ohne Navigation)
>seitenname Wechselt zur einer anderen Seite (ohne Navigation), keinen Inhalt übergeben
#close Schließt die Seite und wechselt eine Ebene zurück in der Navigation
#closereload Schließt die Seite und wechselt eine Ebene zurück in der Navigation und läd diese Seite neu
#logout Führt den Logout durch
#show:GRUPPENNAME Zeigt die "ButtonSub"-Buttons mit dem angegebenen Gruppennamen an
##html:URL Öffnet die Webseite
#refreshstart Läd die Layout-Definition vom Anwendungsserver neu
Beispiel einer eigenen Startseite mit den öffenlich sichtbaren Veranstaltungen/Meldungungen/Shopartikel:
|Page "Start" name=startextern
Menu "zum Mitglieder-Login" action=:loginindividuell
Carousel175 "Aktuelle Termine" webservice=getevents action=eventitem
Carousel150 "Aktuelle Nachrichten" webservice=getpublicnews action=newsitemextern
Carousel150 "Shop-Artikel" webservice=getshop action=shopitem
Button "zum Online-Shop" action=https://vereinonline.org/..../?module=shop&dialog=1
Button "Ich möchte Kontakt aufnehmen" action=https://vereinonline.org/..../?kontakt&dialog=1
Button "Ich möchte Mitglied werden" action=https://vereinonline.org/..../?mitgliedsantrag&dialog=1
Button "zum Mitglieder-Login" action=:loginindividuell