--- title: "Bilder mit Textblock" slug: "image-with-text-block" description: "Add text and an image to the home page using the Image and text block. This is similar to the Text block but also includes an image. For example, you want to showcase a feature and its description" tags: ["Customization", "Body blocks"] updated: 2026-07-09T12:51:42Z published: 2026-07-09T12:51:42Z canonical: "docs.document360.com/image-with-text-block" --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.document360.com/llms.txt > Use this file to discover all available pages before exploring further. # Bilder mit Textblock Das Bild mit Textblock ermöglicht es Ihnen, ein Bild neben einer Überschrift und einem Absatz auf der Startseite Ihrer Wissensdatenbank zu platzieren. Während der [Rich-Textblock](https://docs.document360.com/docs/de/text-block) rein textbasiert ist, bringt dieser Block eine visuelle Dimension hinzu, indem ein Bild mit strukturiertem Text kombiniert wird, sodass die Leser Kontext und Bildmaterial in einem einzigen Layout zusammenfassen. Das macht es gut geeignet für Inhalte, bei denen ein Screenshot, eine Illustration oder ein Vorschaubild Bedeutung verleiht, die Text allein nicht vermitteln kann. ![Knowledge base site showing an Image with text block with an image, heading, and paragraph displayed side by side](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Image%20with%20text%20-%20KB%20site%20preview.png) --- ## Wann sollte man das Bild mit Textblock verwenden - **Feature-Highlights** – Zeigen Sie ein bestimmtes Produktfeature mit einem Screenshot oder einer Illustration zusammen mit einer kurzen Beschreibung. - **Veröffentlichungsankündigungen** – Kombinieren Sie ein neues Feature-Bild mit einem kurzen Absatz, der beschreibt, was neu ist und wo man es findet. - **Visuelle Einleitungen** – Verwenden Sie ein Bild, um den Ton für einen Abschnitt Ihrer Wissensdatenbank zu setzen, mit unterstützendem Text, um die Leser zu orientieren. - **Werbeinhalt** – Heben Sie einen Leitfaden, ein Videotutorial oder einen wichtigen Artikel mit einem Thumbnail und einem kurzen Aufruf zum Handeln hervor. Wenn der Inhalt nur textbasiert ist, verwenden Sie stattdessen den [Rich-Text-Block](https://docs.document360.com/docs/de/text-block) . --- ## Wie man ein Bild mit Textblock fügt 1. Navigiere zu () in der linken Navigationsleiste des Knowledge Base-Portals. 2. Im linken Navigationsfenster navigieren Sie zur **Knowledge base site** > **Site-Anpassung**. 3. Klicken Sie auf die **Schaltfläche "Website anpassen** ". ![Site customization page showing the Customize site button](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Site%20customization%20-%201st%20page.png) 1. Wählen Sie im linken Dropdown-Menü Startseite aus. Der **Abschnitt "Körper"** zeigt die Liste der Körperblöcke an. 2. Klicken Sie auf **Abschnitt hinzufügen** und wählen **Sie Bild mit Text**. Der Block wird zur Liste hinzugefügt. 3. Benutze das **Symbol "Reordering** ()", um den Block neu zu ordnen. Die Symbole Umordnen und **Verstecken** () erscheinen, wenn du über einen Körperblock fährst. 4. Erweitern Sie das **Bild mit dem** Dropdown-Menü Text, um auf die **Elemente Bild**, **Überschrift** und **Absatz** zuzugreifen. ![Home page builder showing an Image with text block expanded with Image, Heading, and Paragraph elements](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Image%20with%20text%20block.png) --- ## Wie man die Elemente konfiguriert ### Bild 1. Klicken Sie **auf Bild,** um das Bildfeld zu öffnen. 2. Klicken Sie auf **Ändern** zum Hochladen oder Aktualisieren des Bildes. 3. Im **Bild-Tab** geben Sie die Bild-URL ein oder laden Sie eine von Ihrem Laufwerk hoch. 4. Im **Bereich Ausrichtung** wählen Sie **Links**, **Mitte** oder **Rechts** , um das Bild innerhalb des Blocks zu positionieren. ![Image panel showing alignment options and image upload controls](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/image%20element.png) ### Kurs 1. Klicken Sie **auf Überschrift,** um das Überschriftenfeld zu öffnen. 2. Geben Sie den gewünschten Text im **Feld Überschrift** ein. 3. Verwenden Sie die **Farbpalette Text** , um eine Überschriftsfarbe auszuwählen. 4. Im **Bereich Ausrichtung** wählen Sie **Links**, **Mitte** oder **Rechts**. 5. Klicken Sie **auf Löschen** , um nur das Überschriften-Element aus diesem Block zu entfernen. ![Heading panel showing text input, color palette, and alignment options](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/heading%20element.png) ### Absatz 1. Klicken Sie **auf Absatz,** um das Absatzfeld zu öffnen. 2. Geben Sie Ihre Inhalte im **Feld Absatz ein** . 3. Formatieren Sie den Text mit den folgenden Optionen: | Option | Was es bewirkt | | --- | --- | | **Fett** () | Verwendet fette Formatierung | | **Kursiv** () | Anwendung kursiver Formatierung | | **URL/Link** () | Fügt einen Hyperlink hinzu | | **Ungeordnete Liste** () | Erstellt eine Aufzählungsliste | | **Geordnete Liste** () | Erstellt eine nummerierte Liste | HINWEIS Markdown-Syntax wird im Feld Absatztext unterstützt. 1. Verwenden Sie die **Farbpalette Text** , um die Farbe des Absatztextes einzustellen. 2. Im **Bereich Ausrichtung** wählen Sie **Links**, **Mitte** oder **Rechts**. 3. Klicken Sie **auf Löschen** , um nur das Absatzelement aus diesem Block zu entfernen. ![Paragraph panel showing text formatting toolbar, color palette, and alignment options](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/paragraph%20element.png) --- ## Wie man speichert und veröffentlicht - Nutzen Sie rechts den **Schalter Vorschau,** um Ihre Änderungen zu überprüfen. - Klicken Sie auf **Speichern** , um Ihre Änderungen zu speichern. - Klicken Sie **auf Veröffentlichen** , um Änderungen live vorzunehmen. --- ## Best Practices - **Halte Bild und Text ausbalanciert** – ein großes Bild neben einem kurzen Satz sieht nicht zusammengepasst aus. Strebe ungefähr gleich viel visuelles Gewicht zwischen Bild und Text daneben an. - **Verwenden Sie für das Bild Linksausrichtung** , wenn die Leserichtung von links nach rechts ist; Für die meisten Leser ist es das natürlichste Layout. - **Verwenden Sie die Überschrift, um den Block zu verankern** – selbst wenn die Überschrift kurz ist, gibt sie den Lesern ein schnelles Kennzeichen, worum es im Bild und im Absatz geht. - **Vermeiden Sie das Hochladen von übergroßen Bildern** – große Bilder verlangsamen das Laden der Seiten. Formatiere die Bilder vor dem Hochladen und halte sie weboptimiert (typischerweise unter 200 KB für Startseiten-Visualisierungen). - **Verwenden Sie konsistente Bildmaße** – wenn Sie mehrere Bilder mit Textblöcken auf derselben Seite haben, halten Sie die Bildgrößen für ein saubereres Layout gleich. --- ## FAQ **Wie lösche ich ein Bild mit Textblock von der Startseite?** Navigiere zu {{variable. Settings}} () > {{variable. Knowledge Base Site}} > **Site-Anpassung** und klicke **auf Site anpassen**. Wählen Sie im linken Dropdown-Menü Startseite aus. Klicken Sie auf das gewünschte **Bild mit Textblock**. Klicken Sie **auf Löschen** und bestätigen, indem Sie im Bestätigungsprompt **Löschen auf Ja** klicken. Klicken Sie auf **Speichern** und dann **auf Veröffentlichen**, um die Änderungen anzuwenden.