Der WEButler darf kostenlos von jedem heruntergeladen, genutzt, verändert und weiterverbreitet werden.
Lizenz: GPL

WEButler V3.6

Version 3.6 steht zum Download bereit. Hinweise zum Update sowie erweiterte Informationen zum Aufbau des Systems findet man in der Datei /_docs_/de/_start.htm.

Systemvorraussetzung:
Apache 2 und PHP 8 oder höher
Module benötigen die PHP Erweiterung SQLite3

Die Sourcen der CKEditor Plugins können hier heruntergeladen werden.

HTML-Seiten online bearbeiten

Der WEButler ist ein einfacher OnlinePageEditor für statische HTML-Dateien. Webmaster können Ihren Kunden damit eine Loginmöglichkeit zur Bild- und Textbearbeitung bieten. Der WEButler ist ein Werkzeug für kleine Homepages oder Projekte, die mit möglichst wenig Aufwand umgesetzt werden sollen. Das Projekt ist über die Jahre gewachsen und man kann inzwischen einiges damit anstellen.

Wichtig! In der Datei "/settings/globalvars.php" lassen sich die meisten Funktionen des WEButlers an- / abschalten.

Installation und Administration

Auf Ihrem Server muss Apache 2 sowie PHP in der Version 8 oder höher installiert sein, eine Datenbank wird nicht benötigt. Für die Nutzung des Benutzermoduls oder des ModMakers muss die PHP-Erweiterung SQLite3 vorhanden sein.

Mit ein wenig Kreativität lassen sich mit diesem Funktionsumfang auch komplexere Seiten realisieren. Weitere Infos sowie detailierte Angaben zum Aufbau einer Seite findet man in der Datei /_docs_/de/_start.htm.

Fertige (vorhandene) HTML-Seiten für die Bearbeitung mit dem WEButler anpassen

Das Herz des WEButlers ist der WYSIWYG-Editor. Mit diesem Editor können HTML-Seiten online im Webbrowser bearbeitet werden. Damit das Bearbeiten und Speichern reibungslos funktioniert, müssen folgende Bedingungen erfüllt sein:

1. Die Homepage darf nicht auf Frames aufgebaut sein. Sollte Ihre Homepage über ein Frameset aufgerufen werden, entfernen Sie dieses, bzw. ändern Sie Ihre Seiten entsprechend.
2. Alle HTML-Seiten müssen den HTML5 Doctype und den Charset UTF-8 verwenden. Sollte das nicht der Fall sein, passen Sie Ihre Seiten bitte entsprechend an.
3. Alle Stylesheet-Dateien müssen im Verzeichnis "/content/style" gespeichert werden. Entfernen Sie alle Stylesheets aus Ihren HTML-Dateien und laden Sie sie über die compress.php.
4. Javascript-Dateien müssen im Verzeichnis "/content/javascript" gespeichert werden. Entfernen Sie alle Javascripte aus Ihren HTML-Dateien und laden Sie sie über die compress.php.
5. Bilder, PDFs, Videos usw. müssen sich im entsprechenden Unterordner im Verzeichnis "/content/media/" befinden. Der Mediabrowser des Editors kann sonst nicht auf die Dateien zugreifen. Die Pfade zu den Dateien müssen entsprechend angepasst werden. Alle Seiten werden vom Root aufgerufen. D.h., Pfade müssen immer mit "content/media/_usw..." beginnen (kein ../ o.ä.).

Seiten, Layouts und Module - Die Arbeitsweise des WEButlers

Der WEButler kann Menüs, Blöcke und Seiten getrennt verwalten. D.h., wenn in einem Menü ein neuer Menüpunkt hinzugefügt wird, erscheint er anschließend auf allen Seiten, die dieses Menü verwenden. Speichert man z.B. den Seitenheader als Block, kann jederzeit ein Bild in diesem Block getauscht werden und es erscheint dann auf allen Seiten, die diesen Block verwenden.

Wichtig! Platzhalter für Menüs, Blöcke und Content-Bereiche sind nicht zwingend erforderlich. Wenn keine Platzhalter-Kommentare vorhanden sind, werden die Bearbeitungspunkte im Adminmenü automatisch deaktiviert. Bei Bedarf kann in der Datei "/settings/globalvars.php" der Punkt "Aktuelle Seite bearbeiten" für reines Fullpage-Editing ins Adminmenü verschoben werden.

Menüs

Alle Menüs müssen als <ul>-Listen erstellt werden, um das automatische hinzufügen neuer Menüpunkte zu gewährleisten. Außerdem erleichtert es das manuelle Einfügen neuer Menüpunkte, da nur die Enter-Taste gedrückt werden muss, um ein neues li-Element in die Liste einzufügen.

Damit der WEButler weiß wo sich welches Ihrer Menüs in einer Seite befindet und es auch optisch bei der Bearbeitung sichtbar wird, gehen Sie bitte wiefolgt vor:

Schneiden Sie das Menü aus Ihrer HTML-Seite aus, fügen Sie es in eine neue Datei ein und speichern Sie es im Verzeichnis "/content/menus". Geben Sie der Datei einen Namen, z.B. "navigation", ohne Leer- oder Sonderzeichen und entfernen Sie die Endung. Alle Links in Ihrem Menü müssen nach dem Muster "index.php?wbpagefile=(Dateiname der Seite)" angepasst werden. Die Stelle aus der das Menü aus der HTML-Datei herausgeschnitten wurde, wird durch einen Platzhalter ersetzt:

<div class="wb_menuelement">
<!-- begin_menu_navigation -->
<!-- menu_navigation -->
<!-- end_menu_navigation -->
</div>

1. Die Klasse "wb_menuelement" erzeugt einen blauen Orientierungsrahmen im Editor.
2. "begin_menu_(MENÜNAME)" ist ein Kommentar der den Anfang des Menüs markiert. Im Beispiel das Menü mit dem Dateinamen "navigation".
3. "menu_MENÜNAME" ist ein Kommentar der durch das Menü ersetzt wird.
4. "end_menu_(MENÜNAME)" ist ein Kommentar der das Ende des Menüs markiert.
5. /div schließt den Orientierungsrahmen.

Wenn im Verzeichnis "/content/menus" keine Menüs existieren, erscheint der Link "Menü" nicht im Administrationsmenü.

Blöcke

Blöcke funktionieren genauso wie Menüs. Schneiden Sie einen gewünschten Block aus Ihrer HTML-Seite und fügen Sie ihn in eine neue Datei ein. Speichern Sie den Block im Verzeichnis "/content/blocks" und geben Sie der Datei einen Namen, z.B. "header". Die Stelle aus der der Block aus der HTML-Datei herausgeschnitten wurde wird durch einen Platzhalter ersetzt:

<div class="wb_blockelement">
<!-- begin_block_header -->
<!-- block_header -->
<!-- end_block_header -->
</div>

Wenn im Verzeichnis "/content/blocks" keine Blöcke existieren, erscheint der Link "Block" nicht im Menü.

Seiten

Alle Seiten werden als statische HTML-Dateien im Verzeichnis "/content/pages" gespeichert. Speichern Sie alle Dateien ohne Endung. Der Dateiname erscheint als Seitenname in der Browseradresszeile.

Über den Link "Inhalt" öffnet sich die Seite im Editor. Der WEButler bietet die Möglichkeit einzelne Bereiche einer Webseite bearbeitbar zu machen bzw. Bereiche, die nicht bearbeitet werden sollen zu sperren. Dazu werden die Bereiche im Quelltext der Seite nach dem selben Muster gekennzeichnet wie Menüs oder Blöcke.

<div class="wb_contentelement">
<!-- begin_content -->
=> Hier steht der bearbeitbare Inhalt <=
<!-- end_content -->
</div>

1. Die Klasse "wb_contentelement" erzeugt einen roten Orientierungsrahmen im Editor.
2. "begin_content" ist ein Kommentar der den Anfang eines bearbeitbaren Bereiches markiert.
3. "end_content" ist ein Kommentar der das Ende des Bereiches markiert.
4. /div schließt den Orientierungsrahmen.

Diese Funktionsweise ist besonders nach dem hinzufügen neuer Seiten nützlich, da es so Orientierungspunkte für die Platzierung des Inhalts gibt.

Spalten

Man kann im WEButler mit Spalten arbeiten. Damit Spalten nur an vorgesehene Stellen eingefügt werden können, ist es zwingend erforderlich die Klassen "wb_menuelement", "wb_blockelement", "wb_columnselement" und "wb_frameelement" in den Seiten zu verwenden! Weitere Informationen findet man in der Hilfe unter /_docs_/de/_start.htm.

Layouts

Zum anlegen neuer Seiten müssen Layoutvorlagen im Verzeichnis "/content/layouts" bereitgestellt werden. Layoutvorlagen sind HTML-Seiten ohne Inhalt. Am einfachsten erstellt man ein Layout indem man eine Datei von "/content/pages" nach "/content/layouts" kopiert, die Endung ".tpl" an den Dateinamen anhängt und alles zwischen den Kommentaren "begin_content" und "end_content" aus dem Quelltext der Datei herauslöscht.

Zur späteren Erweiterung können neue Menüs, Blöcke und Layouts auch direkt online erstellt und in einem Quelltexteditor bearbeitet werden. Dafür findet man Links im Fenster "Erweiterte Administratorfunktionen".

Module

Module sind kleine PHP-Skripte die einfach in eine Seite includet werden können. Wer selbst ein Modul programmieren will, muss darauf achten, daß nach dem Include die Pfade noch stimmen. Für die Steuerung von GET-Parametern muss ein Link immer folgendermaßen aufgebaut sein:

href="index.php?wbpagefile='.$webutlercouple->getpage.'&amp;_WEITERE_GET_PARAMETER_"

Der ModMaker
Mit diesem Script lassen sich schnell einfache Ein-/Ausgabemodule erstellen. Mit dem ModMaker erstellte Module haben Templates, so daß sich auch jeder optische Anspruch realisieren läst. Weitere Informationen findet man in der Hilfe unter /_docs_/de/_start.htm.

Allgemeine Tipps

Wer will kann mit dem WEButler bei Null anfangen und alle benötigten Layouts, Seiten, Blöcke und Menüs direkt online erstellen. Es hat sich aber als einfacher herausgestellt das Grundsystem wie gewohnt offline zu erstellen und dann in den WEButler zu integrieren. Optimal ist es natürlich sich einen Webserver wie XAMPP herunterzuladen und den Aufbau der Seite damit zu realisieren.

Wie bereits erwähnt ist der Editor das Herz des WEButlers. D.h., Arbeitsweise und Möglichkeiten des WEButlers sind auf den Editor abgestimmt. Der Editor nimmt teilweise selbstständig Änderungen am Quelltext vor. Das hängt mit der Programmlogik des Editors zusammen. Wer HTML programmiert, kennt sicher die Probleme der Darstellungsunterschiede in verschiedenen Browsern. Wer den WEButler benutzt, muss sich darauf einstellen, daß er seine Seiten jetzt auch noch für den WYSIWYG-Editor anpassen bzw. ändern muss.