Dynamische Inhalte in Seiten einfügen

Zuletzt aktualisiert am 25. April 2024

Anmerkung

Die Benutzeroberfläche wurde in Dreamweaver vereinfacht. Daher kann es sein, dass einige der in diesem Artikel beschriebenen Optionen in Ihrer Version von Dreamweaver nicht vorhanden sind. Weitere Informationen finden Sie in diesem Artikel.

Dynamischen Inhalt hinzufügen

Nachdem du eine oder mehrere Quellen für dynamische Inhalte definiert hast, kannst du die Quellen verwenden, um dynamische Inhalte auf der Seite hinzuzufügen. Content-Quellen können eine Spalte in einem Recordset, einen Wert aus einem HTML-Formular, den Wert eines Server-Objekts oder andere Daten enthalten.

In Dreamweaver kannst du dynamische Inhalte fast überall auf einer Web-Seite oder in ihrem HTML-Quellcode platzieren. Du kannst dynamische Inhalte an der Einfügemarke platzieren, eine Zeichenfolge ersetzen oder sie als HTML-Attribut einfügen.Dynamische Inhalte können zum Beispiel das src-Attribut eines Bildes oder das value-Attribut eines Formularfelds definieren.

Du kannst dynamische Inhalte zu einer Seite hinzufügen, indem du eine Content-Quelle im Bedienfeld „Bindungen" auswählst.Dreamweaver fügt ein serverseitiges Skript in den Code der Seite ein, das den Server anweist, die Daten aus der Inhaltsquelle in den HTML-Code der Seite zu übertragen, wenn die Seite von einem Browser angefordert wird.

Es gibt oft mehr als eine Möglichkeit, ein bestimmtes Seitenelement dynamisch zu gestalten. Um beispielsweise ein Bild dynamisch zu gestalten, kannst du das Bedienfeld Bindungen, den Eigenschafteninspektor oder den Befehl Bild im Menü Einfügen verwenden.

Eine HTML-Seite kann standardmäßig immer nur einen Datensatz anzeigen. Um die anderen Datensätze im Recordset anzuzeigen, kannst du einen Link hinzufügen, um einzeln durch die Datensätze zu navigieren, oder du kannst eine wiederholende Region erstellen, um mehr als einen Datensatz auf einer einzelnen Seite anzuzeigen.

Dynamischer Text

Dynamischer Text übernimmt jede Textformatierung, die auf den vorhandenen Text oder auf die Einfügemarke angewendet wird. Wenn beispielsweise ein Cascading Style Sheet (CSS)-Stil den ausgewählten Text beeinflusst, wird der dynamische Content, der ihn ersetzt, ebenfalls von dem Stil beeinflusst. Du kannst das Textformat dynamischer Inhalte festlegen oder ändern, indem du beliebige Dreamweaver-Tools zur Textformatierung verwendest.

Sie können auf dynamischen Text auch Datenformate anwenden. Wenn deine Daten beispielsweise aus Datumsangaben bestehen, kannst du ein bestimmtes Datumsformat wie 17.04.00 für deutsche Besucher festlegen.Besucher oder 17/04/00 für kanadische Besucher.

Texte dynamisch gestalten

Du kannst vorhandenen Text durch dynamischen Text ersetzen oder dynamischen Text an einer bestimmten Einfügemarke auf der Seite platzieren.

Dynamischen Text hinzufügen

Wähle in der Designansicht Text auf der Seite aus oder klicke dorthin, wo du dynamischen Text hinzufügen möchtest.

Wähle im Bedienfeld Bindungen (Fenster > Bindungen) eine Inhaltsquelle aus der Liste aus.Wenn du ein Recordset auswählst, gib die Spalte an, die du im Recordset möchtest.

Die Inhaltsquelle muss einfachen Text (ASCII-Text) enthalten. Dazu gehört auch HTML. Wenn keine Inhaltsquellen in der Liste angezeigt werden oder wenn die verfügbaren Inhaltsquellen nicht deinen Anforderungen entsprechen, klicke auf den Plus-Button (+), um eine neue Inhaltsquelle zu definieren.

Optional: Wählen Sie ein Datenformat für den Text aus.

Klicken Sie auf „Einfügen“ oder ziehen Sie die Inhaltsquelle mit der Maus auf die Seite.

Ein Platzhalter für dynamische Inhalte wird angezeigt. (Wenn du Text auf der Seite ausgewählt hast, ersetzt der Platzhalter die Textauswahl.) Der Platzhalter für Recordset-Inhalte verwendet die Syntax {RecordsetName.ColumnName}, wobei Recordset der Name des Recordsets und ColumnName der Name der Spalte ist, die du aus dem Recordset ausgewählt hast.

Manchmal verzerrt die Länge der Platzhalter für dynamischen Text das Layout der Seite im Dokumentfenster. Du kannst das Problem lösen, indem du leere geschweifte Klammern als Platzhalter verwendest, wie im nächsten Thema beschrieben.

Platzhalter für dynamischen Text anzeigen

Wähle Bearbeiten > Voreinstellungen > Unsichtbare Elemente (Windows) oder Dreamweaver > Voreinstellungen > Unsichtbare Elemente (Macintosh) aus.

Wähle im Popup-Menü Dynamischen Text anzeigen als { } aus und klicke auf OK.

Bilder dynamisch gestalten

Sie haben die Möglichkeit, Bilder auf Ihrer Seite dynamisch zu gestalten. Stelle dir beispielsweise vor, du entwirfst eine Seite zur Anzeige von Artikeln, die bei einer Wohltätigkeitsauktion zum Verkauf stehen.Jede Seite würde beschreibenden Text und ein Foto eines Artikels enthalten.Das allgemeine Layout der Seite würde für jeden Artikel gleich bleiben, aber das Foto (und der beschreibende Text) könnten sich ändern.

Platziere bei geöffneter Seite in der Entwurfsansicht (Ansicht > Entwurf) den Cursor an die Stelle, wo das Bild auf der Seite erscheinen soll.

Wählen Sie „Einfügen“ > „Bild“.

Nun wird das Dialogfeld „Bildquelle auswählen“ angezeigt.

Klicke auf die Option Datenquellen (Windows) oder den Button Datenquelle (Macintosh).

Nun wird eine Liste der Inhaltsquellen angezeigt.

Wählen Sie in der Liste eine Inhaltsquelle aus und klicken Sie auf „OK“.

Die Inhaltsquelle sollte ein Recordset sein, das die Pfade zu deinen Grafikdateien enthält.Je nach Dateistruktur deiner Website können die Pfade absolut, dokumentrelativ oder stammverzeichnisrelativ sein.

Anmerkung

Dreamweaver unterstützt derzeit keine binären Bilder, die in einer Datenbank gespeichert sind.

Wenn keine Recordsets in der Liste erscheinen oder wenn die verfügbaren Recordsets deinen Anforderungen nicht entsprechen, definiere ein neues Recordset.

HTML-Attribute dynamisch gestalten

Du kannst das Erscheinungsbild einer Seite dynamisch ändern, indem du HTML-Attribute an Daten bindest.Beispielsweise kannst du das Hintergrundbild einer Tabelle ändern, indem du das background-Attribut der Tabelle an ein Feld in einem Recordset bindest.

Du kannst HTML-Attribute mit dem Bindungen-Bedienfeld oder mit dem Eigenschafteninspektor binden.

HTML-Attribute mit dem Bindungen-Bedienfeld dynamisch machen

Öffne das Bindungen-Bedienfeld, indem du Fenster > Bindungen auswählst.

Stelle sicher, dass das Bindungen-Bedienfeld die Datenquelle auflistet, die du verwenden möchtest.

Die Inhaltsquelle sollte Daten enthalten, die für das HTML-Attribut geeignet sind, das du binden möchtest.Wenn keine Inhaltsquellen in der Liste erscheinen oder wenn die verfügbaren Inhaltsquellen deinen Anforderungen nicht entsprechen, klicke auf den Plus-Button (+), um eine neue Datenquelle zu definieren.

Wählen Sie in der Entwurfsansicht ein HTML-Objekt aus.

Um beispielsweise eine HTML-Tabelle auszuwählen, klicke in die Tabelle und klicke auf das <table>-Tag in der Tag-Auswahl unten links im Dokumentfenster.

Wähle im Bindungen-Bedienfeld eine Inhaltsquelle aus deiner Liste aus.

Wähle im Feld Binden an ein HTML-Attribut aus dem Popup-Menü aus.

Klicken Sie auf „Verbinden“.

Beim nächsten Ausführen der Seite auf dem Anwendungsserver wird der Wert der Datenquelle dem HTML-Attribut zugewiesen.

HTML-Attribute mit dem Eigenschafteninspektor dynamisch machen

Wähle in der Entwurfsansicht ein HTML-Objekt aus und öffne den Eigenschafteninspektor (Fenster > Eigenschaften).

Um beispielsweise eine HTML-Tabelle auszuwählen, klicke in die Tabelle und klicke auf das <table>-Tag in der Tag- Auswahl unten links im Dokumentfenster.

Wie du eine dynamische Inhaltsquelle an das HTML-Attribut bindest, hängt davon ab, wo es sich befindet.

Wenn das Attribut, das du binden möchtest, ein Ordnersymbol daneben im Eigenschafteninspektor hat, klicke auf das Ordner- symbol, um ein Dateiauswahl-Dialogfeld zu öffnen; klicke dann auf die Option Datenquellen, um eine Liste der Datenquellen anzuzeigen.
Wenn das Attribut, das du binden möchtest, kein Ordnersymbol daneben hat, klicke auf die Registerkarte Liste (die untere der beiden Registerkarten) auf der linken Seite des Inspektors.
Die Listenansicht des Eigenschafteninspektors erscheint.
Wenn das Attribut, das du binden möchtest, nicht in der Listenansicht aufgeführt ist, klicke auf den Plus (+) Button; gib dann den Namen des Attributs ein oder klicke auf den kleinen Pfeil-Button und wähle das Attribut aus dem Popup-Menü aus.

Um den Wert des Attributs dynamisch zu machen, klicke auf das Attribut; klicke dann auf das Blitzsymbol oder Ordnersymbol am Ende der Attributzeile.

Wenn du auf das Blitzsymbol geklickt hast, erscheint eine Liste der Datenquellen.

Wenn du auf das Ordnersymbol geklickt hast, erscheint ein Dateiauswahl-Dialogfeld. Wählen Sie die Option „Datenquellen“, um eine Liste der Inhaltsquellen anzuzeigen.

Wähle eine Inhaltsquelle aus der Liste der Inhaltsquellen aus und klicke auf OK.

Die Inhaltsquelle sollte Daten enthalten, die für das HTML-Attribut, das du binden möchtest, geeignet sind. Wenn keine Inhaltsquellen in der Liste erscheinen oder wenn die verfügbaren Inhaltsquellen deine Anforderungen nicht erfüllen, definiere eine neue Inhaltsquelle.

Das nächste Mal, wenn die Seite auf dem Applikationsserver läuft, wird der Wert der Datenquelle dem HTML-Attribut zugewiesen.

ActiveX-, Flash- und andere Objektparameter dynamisch machen

Du kannst die Parameter von Java- Applets und Plug-ins dynamisch machen, sowie die Parameter von ActiveX-, Flash-, Shockwave-, Director- und Generator-Objekten.

Bevor du beginnst, stelle sicher, dass die Felder in deinem Recordset Daten enthalten, die für die Objektparameter, die du binden möchtest, geeignet sind.

Wähle in der Designansicht ein Objekt auf der Seite aus und öffne den Eigenschafteninspektor (Fenster > Eigenschaften).

Klicken Sie auf die Schaltfläche „Parameter“.

Wenn dein Parameter nicht in der Liste erscheint, klicke auf den Plus (+) Button und gib einen Parameternamen in die Parameter- spalte ein.

Klicke auf die Wert-Spalte des Parameters und dann auf das Blitzsymbol, um einen dynamischen Wert festzulegen.

Nun wird eine Liste der Datenquellen angezeigt.

Wählen Sie in der Liste eine Datenquelle aus und klicken Sie auf „OK“.

Die Datenquelle sollte Daten enthalten, die für den Objektparameter, den du binden möchtest, geeignet sind. Wenn keine Datenquellen in der Liste erscheinen oder wenn die verfügbaren Datenquellen deine Anforderungen nicht erfüllen, definiere eine neue Datenquelle.

Training

Lerne direkt in der Applikation – mit Schritt-für-Schritt-Video-Tutorials und praktischen Anleitungen.

Community

Nehmen Sie an Diskussionen teil, finden Sie Antworten, lernen Sie von Experten und teilen Sie Ihr Wissen.

Adobe-Startseite

Greife auf deine bevorzugten Creative Cloud-Apps, -Dienste, Dateiverwaltung und mehr zu.