Modulprogrammierung Einstieg
Aus DeDi-Help
| Version vom 13:44, 13. Jun. 2005 (bearbeiten) Mika (Diskussion | Beiträge) K ← Zum vorherigen Versionsunterschied |
Aktuelle Version (09:52, 6. Okt. 2009) (bearbeiten) (Entfernen) Eppi (Diskussion | Beiträge) |
||
| Zeile 1: | Zeile 1: | ||
| ==Grundlagen== | ==Grundlagen== | ||
| - | Genauso wie es mglich ist, im Layout mit der DeDi-Taggruppe <dedi:lay ... /> Container und Contentbereiche | + | Genauso wie es möglich ist, im Layout mit der DeDi-Taggruppe <dedi:lay ... /> Container und Contentbereiche |
| - | definieren knnen, knnen Sie mit der DeDi-Taggruppe <dedi:mod ... > ganz leicht eigene Module erstellen, in denen die einzelnen Funktionen, wie z. B. WYSIWYG-Editor, Bild und andere, zu einem Modul zusammen gefhrt werden knnen. | + | definieren können, können Sie mit der DeDi-Taggruppe <dedi:mod ... > ganz leicht eigene Module erstellen, in denen die einzelnen Funktionen, wie z. B. WYSIWYG-Editor, Bild und andere, zu einem Modul zusammen geführt werden können. |
| - | Diese Funktion knnen Sie nutzen, um zum Beispiel komplette Seitenvorlagen, mit fest definierten | + | Diese Funktion können Sie nutzen, um zum Beispiel komplette Seitenvorlagen, mit fest definierten |
| - | Inhaltsbereichen zu erstellen. So knnen Sie z.B. eine Artikel-Vorlagenseite mit einem einzigen Modul unter Verwendung von <dedi:mod .... /> erstellen. Solche Vorlagen machen immer dann Sinn, wenn der User oder Redakteur keine Layouteingriffe haben soll, sondern nur Content (Inhalt)verwalten und anlegen soll. | + | Inhaltsbereichen zu erstellen. So können Sie z.B. eine Artikel-Vorlagenseite mit einem einzigen Modul unter Verwendung von <dedi:mod .... /> erstellen. Solche Vorlagen machen immer dann Sinn, wenn der User oder Redakteur keine Layouteingriffe haben soll, sondern nur Content (Inhalt)verwalten und anlegen soll. |
| - | Wir geben Ihnen hier einen berblick ber die Mglichkeiten, die Variablen und eine Anleitung der ersten Schritte. Ihrer Kreativitt ist mit <dedi:mod .... /> keine Grenze gesetzt. Wir empfehlen Ihnen mit unseren kleinen Beispielen die grundlegenden Funktionen kennen zu lernen und spter, durch ausprobieren, eigene Module zu entwerfen. | + | Wir geben Ihnen hier einen Überblick über die Möglichkeiten, die Variablen und eine Anleitung der ersten Schritte. Ihrer Kreativität ist mit <dedi:mod .... /> keine Grenze gesetzt. Wir empfehlen Ihnen mit unseren kleinen Beispielen die grundlegenden Funktionen kennen zu lernen und später, durch ausprobieren, eigene Module zu entwerfen. |
| - | ==Eigenes Modul erstellen Vorbereitung== | + | ==Eigenes Modul erstellen / Vorbereitung== |
| Um den Grundsatz der Modulverarbeitung mit <dedi:mod .... /> zu verstehen, wollen wir zu Anfang | Um den Grundsatz der Modulverarbeitung mit <dedi:mod .... /> zu verstehen, wollen wir zu Anfang | ||
| - | ein sehr kleines, einfaches Modul erstellen. Wir wollen einfach die beiden Funktionen bild und | + | ein sehr kleines, einfaches Modul erstellen. Wir wollen einfach die beiden Funktionen "bild2 und |
| - | wysiwyg zusammenfhren und zu einem Modul, nennen wir es mal Mein erstes Modul, zusammenfhren. | + | "wysiwyg" zusammenführen und zu einem Modul, nennen wir es mal "Mein erstes Modul", zusammenführen. |
| - | ===HTML-Gerst mit Platzhaltern=== | + | ===HTML-Gerüst mit Platzhaltern=== |
| Hierzu erstellen wir in unserem HTML-Editor einfache Tabelle mit einer Zeile und zwei Spalten. | Hierzu erstellen wir in unserem HTML-Editor einfache Tabelle mit einer Zeile und zwei Spalten. | ||
| - | Die linke Spalte wollen wir 100 Pixel, die rechte Spalte 300 Pixel breit haben. Links in die Zelle schreiben wir Bild, rechts Inhalt. | + | Die linke Spalte wollen wir 100 Pixel, die rechte Spalte 300 Pixel breit haben. Links in die Zelle schreiben wir "Bild", rechts "Inhalt". |
| <nowiki><table border="0" width="450"> | <nowiki><table border="0" width="450"> | ||
| Zeile 34: | Zeile 34: | ||
| ===Platzhalter durch <dedi:mod ... > ersetzen=== | ===Platzhalter durch <dedi:mod ... > ersetzen=== | ||
| - | Anstelle von Bild und Inhalt setzen wir jetzt unsere Funktionen ein, die spter im Backend | + | Anstelle von "Bild" und "Inhalt" setzen wir jetzt unsere Funktionen ein, die später im Backend |
| - | erscheinen sollen. Also fr das Bild, z. B. das Modul image und fr den Inhalt das Modul | + | erscheinen sollen. Also für das Bild, z. B. das Modul "image" und für den Inhalt das Modul |
| - | wysiwyg Editor. Das ganze erfolgt nun mit unserem <dedi:mod> Tag, in einer hnlichen Form | + | "wysiwyg" Editor. Das ganze erfolgt nun mit unserem <dedi:mod> Tag, in einer ähnlichen Form |
| wie die <dedi:lay> Tags in unseren Layout-Dateien: | wie die <dedi:lay> Tags in unseren Layout-Dateien: | ||
| Zeile 48: | Zeile 48: | ||
| - | ==Grundstze== | + | ==Grundsätze== |
| - | Wie in unseren Layoutdateien mssen wir allerdings wieder einige, wenige Grundstze beachten: | + | Wie in unseren Layoutdateien müssen wir allerdings wieder einige, wenige Grundsätze beachten: |
| '''<dedi:mod (Pflichtfeld)'''<br> | '''<dedi:mod (Pflichtfeld)'''<br> | ||
| - | Leitet die Codezeile fr das DEDI:tag ein. | + | Leitet die Codezeile für das DEDI:tag ein. |
| - | '''type=image (Pflichtfeld)'''<br> | + | '''type="image" (Pflichtfeld)'''<br> |
| Bezeichnet die Funktion die verwendet werden soll, hier ein Bild | Bezeichnet die Funktion die verwendet werden soll, hier ein Bild | ||
| - | '''id=1 (Pflichtfeld, Wertbereich von 1 bis 999999)'''<br> | + | '''id="1" (Pflichtfeld, Wertbereich von 1 bis 999999)'''<br> |
| Fortlaufende, eindeutige Nummer des dedi:mod Tags | Fortlaufende, eindeutige Nummer des dedi:mod Tags | ||
| '''/>'''<br> | '''/>'''<br> | ||
| - | Beendet die Codezeile fr das DEDI:tag. | + | Beendet die Codezeile für das DEDI:tag. |
| Zeile 73: | Zeile 73: | ||
| - | Im Grundsatz ist mit dem oben erstellten Code unser eigenes Modul bereits fertig. Natrlich ist es Ausbaufhig und kann noch mit Zusatzangaben verfeinert werden. Wir wollen hier aber erstmal | + | Im Grundsatz ist mit dem oben erstellten Code unser eigenes Modul bereits fertig. Natürlich ist es Ausbaufähig und kann noch mit Zusatzangaben verfeinert werden. Wir wollen hier aber erstmal |
| - | auf die Grundlagen eingehen, und die weiteren Mglichkeiten spter darstellen. | + | auf die Grundlagen eingehen, und die weiteren Möglichkeiten später darstellen. |
| Zeile 82: | Zeile 82: | ||
| {| | {| | ||
| |'''Modulname''' | |'''Modulname''' | ||
| - | |Freie Bezeichnung, z.B. Meine Artikel-Vorlage | + | |Freie Bezeichnung, z.B. "Meine Artikel-Vorlage" |
| |- | |- | ||
| |'''Version''' | |'''Version''' | ||
| - | |Freie Versionsangabe fr Ihre eigene Entwicklungsbersicht | + | |Freie Versionsangabe für Ihre eigene Entwicklungsübersicht |
| |- | |- | ||
| |'''Kategorie''' | |'''Kategorie''' | ||
| - | |Kategorieangabe, z.B. Eigene Module | + | |Kategorieangabe, z.B. "Eigene Module" |
| |- | |- | ||
| |'''Beschreibung''' | |'''Beschreibung''' | ||
| - | |Freie Beschreibung fr das Modul | + | |Freie Beschreibung für das Modul |
| |- | |- | ||
| |'''Konfiguration''' | |'''Konfiguration''' | ||
| - | |Moduleinstellungen (keine Eingabe, erfolgt spter) | + | |Moduleinstellungen (keine Eingabe, erfolgt später) |
| |- | |- | ||
| |'''Frontendausgabe''' | |'''Frontendausgabe''' | ||
| Zeile 100: | Zeile 100: | ||
| |} | |} | ||
| - | Im Bereich Frontendausgabe fgen wir unseren vorbereiteten HTML Code mit <dedi:mod .../> ein, | + | Im Bereich Frontendausgabe fügen wir unseren vorbereiteten HTML Code mit <dedi:mod .../> ein, |
| also: | also: | ||
| Zeile 112: | Zeile 112: | ||
| - | Zum Speichern klicken wir einfach auf den grnen Punkt am Ende der Seite. Unser Modul steht in | + | Zum Speichern klicken wir einfach auf den grünen Punkt am Ende der Seite. Unser Modul steht in |
| - | DeDi unter "Design > Module" nun mit dem Namen Mein erstes Modul zur Verfgung. Das Modul | + | DeDi unter "Design > Module" nun mit dem Namen "Mein erstes Modul" zur Verfügung. Das Modul |
| - | kann nun wie gewohnt in ein beliebiges Template eingebunden werden und spter in der Seite | + | kann nun wie gewohnt in ein beliebiges Template eingebunden werden und später in der Seite |
| bearbeitet werden. | bearbeitet werden. | ||
| - | '''Achtung:''' Um nicht unntig Verwirrung zu stiften, ist die Darstellung der DEDI:tags noch ein wenig vereinfacht worden. Dies betrifft die Eigenschaft id=X. Die Angabe <dedi:mod type=image '''id=1''' /> und <dedi:mod type=wysiwyg '''id=1''' /> wrden in unserem kleinen Testmodul auch ohne Probleme funktionieren, obwohl beide Tags mit der id=1 gekennzeichnet sind. Dies liegt daran, dass jeder DEDI:tag-type (also z. B. image, wysiwyg) seinen eigenen id- Zhler besitzt. Diese sind voneinander unabhngig. | + | '''Achtung:''' Um nicht unnötig Verwirrung zu stiften, ist die Darstellung der DEDI:tags noch ein wenig vereinfacht worden. Dies betrifft die Eigenschaft id="X". Die Angabe <dedi:mod type="image" '''id="1"''' /> und <dedi:mod type="wysiwyg" '''id="1"''' /> würden in unserem kleinen Testmodul auch ohne Probleme funktionieren, obwohl beide Tags mit der id="1" gekennzeichnet sind. Dies liegt daran, dass jeder DEDI:tag-type (also z. B. image, wysiwyg) seinen eigenen id- Zähler besitzt. Diese sind voneinander unabhängig. |
| [[Category:Entwicklung]] | [[Category:Entwicklung]] | ||
Aktuelle Version
Inhaltsverzeichnis |
[bearbeiten] Grundlagen
Genauso wie es möglich ist, im Layout mit der DeDi-Taggruppe <dedi:lay ... /> Container und Contentbereiche definieren können, können Sie mit der DeDi-Taggruppe <dedi:mod ... > ganz leicht eigene Module erstellen, in denen die einzelnen Funktionen, wie z. B. WYSIWYG-Editor, Bild und andere, zu einem Modul zusammen geführt werden können.
Diese Funktion können Sie nutzen, um zum Beispiel komplette Seitenvorlagen, mit fest definierten
Inhaltsbereichen zu erstellen. So können Sie z.B. eine Artikel-Vorlagenseite mit einem einzigen Modul unter Verwendung von <dedi:mod .... /> erstellen. Solche Vorlagen machen immer dann Sinn, wenn der User oder Redakteur keine Layouteingriffe haben soll, sondern nur Content (Inhalt)verwalten und anlegen soll.
Wir geben Ihnen hier einen Überblick über die Möglichkeiten, die Variablen und eine Anleitung der ersten Schritte. Ihrer Kreativität ist mit <dedi:mod .... /> keine Grenze gesetzt. Wir empfehlen Ihnen mit unseren kleinen Beispielen die grundlegenden Funktionen kennen zu lernen und später, durch ausprobieren, eigene Module zu entwerfen.
[bearbeiten] Eigenes Modul erstellen / Vorbereitung
Um den Grundsatz der Modulverarbeitung mit <dedi:mod .... /> zu verstehen, wollen wir zu Anfang ein sehr kleines, einfaches Modul erstellen. Wir wollen einfach die beiden Funktionen "bild2 und "wysiwyg" zusammenführen und zu einem Modul, nennen wir es mal "Mein erstes Modul", zusammenführen.
[bearbeiten] HTML-Gerüst mit Platzhaltern
Hierzu erstellen wir in unserem HTML-Editor einfache Tabelle mit einer Zeile und zwei Spalten. Die linke Spalte wollen wir 100 Pixel, die rechte Spalte 300 Pixel breit haben. Links in die Zelle schreiben wir "Bild", rechts "Inhalt".
<table border="0" width="450">
<tr>
<td width="100">Bild</td>
<td width="300">Inhalt</td>
</tr>
</table>
[bearbeiten] Platzhalter durch <dedi:mod ... > ersetzen
Anstelle von "Bild" und "Inhalt" setzen wir jetzt unsere Funktionen ein, die später im Backend erscheinen sollen. Also für das Bild, z. B. das Modul "image" und für den Inhalt das Modul "wysiwyg" Editor. Das ganze erfolgt nun mit unserem <dedi:mod> Tag, in einer ähnlichen Form wie die <dedi:lay> Tags in unseren Layout-Dateien:
<table border="0" width="450">
<tr>
<td width="100"><dedi:mod type="image" id="1" /></td>
<td width="300"><dedi:mod type="wysiwyg" id="2" /></td>
</tr>
</table>
[bearbeiten] Grundsätze
Wie in unseren Layoutdateien müssen wir allerdings wieder einige, wenige Grundsätze beachten:
<dedi:mod (Pflichtfeld)
Leitet die Codezeile für das DEDI:tag ein.
type="image" (Pflichtfeld)
Bezeichnet die Funktion die verwendet werden soll, hier ein Bild
id="1" (Pflichtfeld, Wertbereich von 1 bis 999999)
Fortlaufende, eindeutige Nummer des dedi:mod Tags
/>
Beendet die Codezeile für das DEDI:tag.
[bearbeiten] Modul anlegen
Im Grundsatz ist mit dem oben erstellten Code unser eigenes Modul bereits fertig. Natürlich ist es Ausbaufähig und kann noch mit Zusatzangaben verfeinert werden. Wir wollen hier aber erstmal auf die Grundlagen eingehen, und die weiteren Möglichkeiten später darstellen.
Um das Modul nun in DeDi bereitzustellen, gehen wir im Backend auf "Design > Module > Neues
Modul". Hier legen wir nun unser erstes Modul an:
| Modulname | Freie Bezeichnung, z.B. "Meine Artikel-Vorlage" |
| Version | Freie Versionsangabe für Ihre eigene Entwicklungsübersicht |
| Kategorie | Kategorieangabe, z.B. "Eigene Module" |
| Beschreibung | Freie Beschreibung für das Modul |
| Konfiguration | Moduleinstellungen (keine Eingabe, erfolgt später) |
| Frontendausgabe | Unser HTML Code mit <dedi:mod ... /> |
Im Bereich Frontendausgabe fügen wir unseren vorbereiteten HTML Code mit <dedi:mod .../> ein, also:
<table border="0" width="450">
<tr>
<td width="100"><dedi:mod type="image" id="1" /></td>
<td width="300"><dedi:mod type="wysiwyg" id="2" /></td>
</tr>
</table>
Zum Speichern klicken wir einfach auf den grünen Punkt am Ende der Seite. Unser Modul steht in
DeDi unter "Design > Module" nun mit dem Namen "Mein erstes Modul" zur Verfügung. Das Modul
kann nun wie gewohnt in ein beliebiges Template eingebunden werden und später in der Seite
bearbeitet werden.
Achtung: Um nicht unnötig Verwirrung zu stiften, ist die Darstellung der DEDI:tags noch ein wenig vereinfacht worden. Dies betrifft die Eigenschaft id="X". Die Angabe <dedi:mod type="image" id="1" /> und <dedi:mod type="wysiwyg" id="1" /> würden in unserem kleinen Testmodul auch ohne Probleme funktionieren, obwohl beide Tags mit der id="1" gekennzeichnet sind. Dies liegt daran, dass jeder DEDI:tag-type (also z. B. image, wysiwyg) seinen eigenen id- Zähler besitzt. Diese sind voneinander unabhängig.
