Ihre erste Seite erstellen.

DXPR Builder lernenHier startenErste Seite erstellen

Bauen Sie eine Seite mit DXPR Builder: ein Bild neben einer Überschrift, einen kurzen Absatz und einen Button. Sie können auch mit einer fertigen Vorlage beginnen und ihre Wörter ändern. Beides dauert wenige Minuten und Sie enden mit einer gespeicherten Seite, deren Vorschau Sie so ansehen, wie Besucher sie sehen werden. Nutzen Sie diese Seite nach der Installation von DXPR Builder.

Das Video baut die Seite von Grund auf: Section, Row, Image, Button und Text, dann Speichern und Vorschau.

Bevor Sie beginnen

  • DXPR Builder ist mit Ihrem Produktschlüssel installiert (DXPR Builder auf Ihrer Drupal-Website installieren).
  • Ein Inhaltstyp zeigt den Builder: Sein Textfeld nutzt den DXPR Builder-Formatierer, wie Drag and drop Page aus dxpr_builder_page.
  • Ihre Rolle hat die Berechtigung Edit with DXPR Builder.

Die Seite erstellen

  1. Gehen Sie zu Inhalt > Inhalt hinzufügen und wählen Sie einen Inhaltstyp, der den Builder zeigt.
  2. Geben Sie einen Title ein und klicken Sie auf Speichern.

Die gespeicherte Seite öffnet sich mit einem leeren Builder. DXPR Builder arbeitet auf dieser Seite, nicht auf dem Bearbeitungsformular.

Option A: Mit einer Vorlage beginnen

Der Tab Saved templates listet Layouts auf, die Personen auf Ihrer Website zur Wiederverwendung gespeichert haben. DXPR CMS liefert mehrere mit, zum Beispiel Colored icon boxes. Auf anderen Websites kann der Tab leer sein; Choose a template auf der leeren Seite bietet dann die Seitenvorlagen, die DXPR Builder mitbringt. Eine gespeicherte Vorlage einfügen zeigt diese Schritte in einem Video.

  1. Klicken Sie auf Add Elements, um die Elementauswahl zu öffnen.
  2. Wechseln Sie zum Tab Saved templates.
  3. Klicken Sie auf eine Vorlage, um sie einzufügen. Ihre Sections, Rows und Elemente erscheinen auf der Seite, bereit zur Bearbeitung.
  4. Klicken Sie in der Symbolleiste auf Speichern.
  5. Öffnen Sie das Augen-Menü und wählen Sie Preview, um die Seite so zu sehen, wie Besucher sie sehen.

Option B: Von Grund auf bauen

Das Video oben folgt diesen Schritten.

  1. Klicken Sie auf Add Elements und wählen Sie Section auf dem Layout-Tab.
  2. Klicken Sie auf das + auf der Steuerleiste der Section und wählen Sie Row.
  3. Klicken Sie auf das Raster-Icon auf der Row, wählen Sie eine Spaltenvorgabe wie 1/3 + 2/3 und klicken Sie auf Speichern.
  4. Klicken Sie auf das + in der linken Spalte, öffnen Sie den Content-Tab und wählen Sie Image.
  5. Klicken Sie auf Select Image, durchsuchen Sie die Medienverwaltung mit Apply filters, kreuzen Sie ein Foto an und klicken Sie auf Insert selected.
  6. Öffnen Sie das SEO-Panel, geben Sie das Alt attribute ein und klicken Sie auf Speichern.
  7. Klicken Sie auf das + in der rechten Spalte und wählen Sie Button.
  8. Geben Sie Title und Link ein, wählen Sie einen Type und klicken Sie auf Speichern.
  9. Klicken Sie auf das + auf der Steuerleiste der breiten Spalte und wählen Sie Text.
  10. Geben Sie eine Überschrift ein, stellen Sie sie auf Heading 2, geben Sie darunter einen Absatz ein und klicken Sie auf Speichern.
  11. Klicken Sie in der Symbolleiste auf Speichern.
  12. Öffnen Sie das Augen-Menü und wählen Sie Preview, um die Seite so zu sehen, wie Besucher sie sehen. Wählen Sie Edit im selben Menü, um weiterzuarbeiten.

Das Hinzugefügte ändern

  • Text: Klicken Sie auf ein Text-Element, um es direkt zu bearbeiten. Eine Symbolleiste bietet Fett, Kursiv, Überschriften, Links, Listen, Schriftfarbe und mehr. Ihr Benutzerprofil entscheidet, welche Schaltflächen erscheinen.
  • Settings: Öffnen Sie More auf der Steuerleiste eines Elements und wählen Sie Settings. Ein Image hat Breite, Höhe, einen Link und seinen Alternativtext; ein Button hat einen Type, eine Größe und einen Link.
  • Order: Ziehen Sie ein Element an seiner Steuerleiste an eine andere Stelle.

Klicken Sie in der Symbolleiste auf Speichern, wenn Sie fertig sind. Der Browser warnt Sie, wenn Sie versuchen, die Seite mit ungespeicherten Änderungen zu verlassen.

Was Sie sehen

In Preview sitzt das Bild links. Überschrift, Absatz und Button sitzen rechts, ohne Steuerleisten. Zurück in Edit zeigt jedes Element seine Steuerleiste, wenn Sie mit der Maus darüberfahren. DXPR Builder speichert die Seite als HTML in dem Feld, das es bearbeitet, meist Body. Besucher sehen die Seite, sobald der Inhalt veröffentlicht ist.

Wenn Sie den Add-Elements-Button nicht sehen

  • Die leere Seite zeigt „Choose a template“ und „Or add elements using the +“. Enable page creation assistant ist unter /admin/dxpr_studio/dxpr_builder/ai_settings ausgeschaltet. Klicken Sie stattdessen auf das + in der Builder-Symbolleiste, um die Elementauswahl zu öffnen.
  • Die Seite zeigt gar keinen Builder. Der Inhaltstyp nutzt den DXPR Builder-Formatierer nicht oder Ihrer Rolle fehlt Edit with DXPR Builder. Folgen Sie Die Installation überprüfen.
  • Der Tab Saved templates listet keine Vorlagen. Niemand auf der Website hat bisher eine gespeichert oder Ihr Benutzerprofil blendet sie aus. Nutzen Sie Choose a template auf der leeren Seite oder speichern Sie eine eigene.
  • Ihre Änderungen sind nach einem Neuladen weg. Die Seite wurde nicht gespeichert. Klicken Sie in der Builder-Symbolleiste auf Speichern, bevor Sie die Seite verlassen.

Wie geht es weiter?