Wie du Bilder mit einem Bildeditor zu einer Webseite hinzufügst

Mit dem Text- und Bildeditor von HostPapa kannst du Bilder in deine Textdokumente einfügen, egal ob es sich um Blogs, Kataloge, Anleitungen oder Präsentationen handelt. Unser Website Builder sorgt für beeindruckende Ergebnisse mit Bildern, die deine Kunden und Besucher begeistern werden.

Um zu erfahren, wie du auf deinen Website Builder zugreifen und loslegen kannst, lies bitte diesen Artikel.

Bevor wir starten, müssen wir erklären, dass ein Inline-Element in einer Zeile angezeigt wird. Das bedeutet, dass das hinzugefügte Element den nachfolgenden Text nicht dazu zwingt, in einer neuen Zeile zu beginnen. Beispielsweise werden, wenn du mehr als ein Wort in einem Satz fett markierst, keine Wörter in einer neuen Zeile beginnen.

Bilder zu deinen Webseiten hinzufügen

Es gibt mehr als eine Möglichkeit, ein Bild zu deiner Webseite im Website Builder hinzuzufügen. Dieser Artikel behandelt alle drei Optionen:

  • Option 1: Aus der Kategorie Text & Images als Inline-Element über das Textelement.
  • Option 2: Über das Element Image & Text, wo zusätzliche Bilder als Inline-Elemente hinzugefügt werden können.
  • Option 3: Wieder aus der Kategorie Text & Images, aber als einzelnes Bildelement.

Bitte beachte, dass du bei Option 3 keine zusätzlichen Inhaltselemente wie Text oder Video gleichzeitig hinzufügen kannst. Das ist bei Option 1 und Option 2 nicht der Fall.

Bilder hochladen, um loszulegen

Um deine Bilder hochzuladen, kannst du folgende Schritte vornehmen:

  1. Öffne das Eigenschaften-Panel. 
  2. Ziehe deine Bilder per Drag-and-Drop hinein oder klicke in den Bildbereich, um eine Datei von deiner Festplatte oder aus der Cloud auszuwählen.
  1. Du kannst auch die Option Add from URL wählen:

Diese Option ermöglicht es dir, ein Bild zu verwenden, das bereits auf einer anderen Webseite veröffentlicht wurde. Falls du das machen möchtest, gehst du wie folgt vor:

  1. Kopiere die URL des gewünschten Bildes.
  2. Füge die Adresse in das Feld URL ein.
  3. Klicke auf die Option Add Image.

Hinweis: Falls die Bild-URL ein Hash-Zeichen (#) oder ein Fragezeichen (?) enthält, musst du die Drag-and-Drop-Option zum Hochladen verwenden.

Eine weitere Methode ist die Verwendung des Tabs Image Library, wo du aus einer Vielzahl von Stockbildern auswählen kannst.

Sobald dein Bild hochgeladen ist, wird es automatisch auf eine Standardgröße eingestellt:

  • Du kannst es auf eine von vier Größen setzen: klein, mittel, groß, Originalgröße oder eine individuelle Größe deiner Wahl.

Alle bearbeiteten Bilder erscheinen in hoher Auflösung, und das Original bleibt erhalten, falls du es erneut bearbeiten möchtest.

Wenn du auf dein Bild klickst, öffnet sich auf der rechten Seite des Bildschirms ein Bearbeitungsmenü. Dort hast du folgende Optionen:

  • Anpassung
  • Größeneinstellung
  • Rahmen
  • Wrapping-Stile und Effekte

Falls du möchtest, dass Text erscheint, wenn der Mauszeiger über das Bild bewegt wird:

  1. Setze deinen Cursor in das Feld Mouse-over Caption.
  1. Schreibe im Feld Image Description den gewünschten Text. Da die Rollover-Beschriftungen für die Suchmaschinenoptimierung (SEO) relevant sind, solltest du die Beschriftungen so gestalten, dass sie das Bild erklären.

Zusätzliche Anpassungen an deinen Bildern

Es gibt eine große Auswahl an Änderungen, die du an deinen Bildern vornehmen kannst. Hier ist eine Liste der wichtigsten Optionen im Menü Image Properties.

  • Wenn du die Option  Image Alignment auswählst, kannst du festlegen, ob Text rechts oder links neben dem Bild erscheinen soll.
  • Mit der Option Link kannst du einen Link hinzufügen. Sobald du das machst, erscheint ein Untermenü, das wir im nächsten Abschnitt besprechen.
  • Im Dropdown-Menü Image Effects kannst du Effekte wie Neigung, Spiegelung und weitere Effekte zu deinem Bild hinzufügen.

Wie bereits erwähnt, erscheint das folgende Untermenü unten rechts im Menü, wenn du die Option Link auswählst.

Rahmen und Abstand

Du kannst den Abstand um dein Bild ändern, indem du:

  • Den Abstand oben, unten, links und rechts in Pixeln auswählst.
  • Es gibt auch die Möglichkeit, einen Rahmen zu Bildern hinzuzufügen. Das machst du so:
  1. Gib die Rahmenbreite in Pixeln an und wähle die gewünschte Rahmenfarbe aus.
  2. Klicke auf das Rahmenfarben-Symbol, um die Farbpalette zu öffnen, und wende die Rahmenfarbe an oder entferne sie.

Mouse-over Bild

Ganz unten im Menü Image Properties findest du die Option Mouse-over Image

Das Mouse-over Image Tool zeigt Besuchern an, dass beim Klicken auf ein Bild etwas passiert. Das gilt auch, wenn ein Link über ein Bild gelegt wurde.

Übergänge

Wenn du einen Übergang zu einem Mouse-over Bild hinzufügen möchtest:

  1. Lade eine zweite Bilddatei unter der Option Mouse-Over Image hoch.
  2. Wähle einen Übergang aus, der zwischen den beiden Bildern auf deiner Webseite verwendet wird.

Falls du Hilfe mit deinem HostPapa-Konto benötigst, öffne bitte ein Support-Ticket über dein Dashboard.

Passende Artikel

Dieser Post ist auch verfügbar in: EnglishFrançaisEspañol
Gehen Sie online mit unserem günstigen Webhosting

Gehen Sie online mit unserem günstigen Webhosting

Erfahren Sie jetzt mehr
HostPapa Mustache