Legen Sie ein Hintergrundbild für Ihre WordPress-Website fest

Jedes Bild oder Video, das Sie auf Ihrer Website verwenden, definiert Ihre Marke für Ihr Publikum. Daher sind Hintergrundbilder auf Ihrer Website wichtig, und Sie sollten sie entwerfen oder auswählen, um Ihren Markenstil und Ihre Zielgruppe im Auge zu behalten.

In diesem Tutorial erfahren Sie, wie Sie ein Hintergrundbild auf Ihrer WordPress-Website festlegen können. Ich werde Sie durch den Prozess der Einstellung Ihres WordPress-Hintergrundbildes im Detail führen, damit Sie es einfach selbst tun können.

Ob Sie Ihre WordPress-Site mit hosten WordPress.com oder verwenden Sie einen selbstverwalteten Server, ist dieses Tutorial für Sie. Sie lernen die folgenden Methoden zum Festlegen eines Hintergrundbilds für Ihre WordPress-Website kennen:

  • fügen Sie ein Hintergrundbild mit WordPress-Theme-Einstellungen hinzu
  • Fügen Sie ein Hintergrundbild mit WordPress-Plugins hinzu
  • Fügen Sie Hintergrundfotos mit CSS hinzu

Möglichkeit 1. Fügen Sie ein Hintergrundbild mit WordPress-Theme-Einstellungen hinzu

Mit vielen kostenlosen WordPress-Themes können Sie ein Hintergrundbild festlegen. Ich verwende das Twenty Twenty-One-Thema, ein einfaches Thema für Blogs, Portfolios und kleine Unternehmen. Dieses Thema ermöglicht es Ihnen auch, ein Hintergrundbild zu haben.

Melde dich im Admin-Bereich deiner WordPress-Site an. Sie können die meisten Ihrer WordPress-Einstellungen von hier aus verwalten.

  • WordPress
    So melden Sie sich bei Ihrem WordPress-Site-Admin-Dashboard an
    Adi Purdila

Klicken Sie auf Darstellung, die alle Einstellungen für das Aussehen Ihrer Website enthält. Sie werden aufgefordert, ein Thema auszuwählen. Wählen Sie Twenty Twenty-One als Thema (oder ein anderes Thema, mit dem Sie ein Hintergrundbild haben können).

Bewegen Sie nun den Mauszeiger über das Menü Darstellung und klicken Sie auf Hintergrund. Das Theme Customizer-Fenster wird angezeigt und Sie können ein Hintergrundbild auswählen.

HintergrundbildHintergrundbildHintergrundbild

Wählen Sie nun Bild und wählen Sie entweder ein Bild aus Ihrer WordPress-Bibliothek oder laden Sie ein Bild hoch.

Sie können die Details Ihres Hintergrundbilds festlegen, z. B. Alternativtext, Titel, Beschriftung und Beschreibung. Wenn Ihr Fokus auf SEO liegt, ist es immer eine gute Idee, Alternativtext hinzuzufügen.

Details zum HintergrundbildDetails zum HintergrundbildDetails zum Hintergrundbild

Sobald Sie das Bild ausgewählt und die Einstellungen gespeichert haben, ändert sich Ihr WordPress-Hintergrundbild. Jetzt können Sie die verschiedenen voreingestellten Optionen erkunden (Bildschirm ausfüllen, An Bildschirm anpassen usw.), mit dem Sie Ihr Hintergrundbild genau so aussehen lassen können, wie Sie es möchten.

Voreingestellte Einstellungen Voreingestellte EinstellungenVoreingestellte Einstellungen

Denken Sie daran, oben links auf die Schaltfläche Änderungen speichern zu klicken, da sonst Ihre Änderungen nicht gespeichert werden.

Möglichkeit 2. Fügen Sie ein Hintergrundbild mit WordPress-Plugins hinzu

Die Verwendung von Plugins zum Ändern des Erscheinungsbilds Ihrer Website wird nur empfohlen, wenn Sie über eine selbstverwaltete WordPress-Website verfügen oder in einen kostenpflichtigen Plan investiert haben. WordPress.com . Wenn Sie Plugins mit Ihrem kostenlosen WordPress.com konto, Ihre Domain ändert sich von .wordpress.com zu .wpcomstaging.com, was nicht ideal ist.

Plugins bieten viele Funktionen und Funktionen für Ihre WordPress-Site. Mit einem Hintergrund-Plugin können Sie beispielsweise verschiedene Hintergründe in mehreren Bereichen Ihrer Website hinzufügen: Beiträge, Seiten und Kategorien. Sie können auch ein YouTube-Video als Hintergrund mit einem Plugin festlegen. Plugins können auch die Größe Ihrer Bilder und Videos für Telefone ändern, sodass Ihr Publikum Ihre Website problemlos von seinem Telefon aus genießen kann.

  • WordPress
    Was ist ein WordPress-Plugin?
    Rachel McCollin
  • WordPress
    17 beste Video-Hintergrund-Plugins für WordPress
    Nona Blackman

Für dieses Tutorial verwenden wir ein sehr einfaches kostenloses Plugin. Es wird das einfache Vollbild-Hintergrundbild-Plugin genannt.

Sobald Sie das Plugin aktiviert haben, bewegen Sie die Maus über Aussehen. Klicken Sie nun auf die neue Option Fullscreen BG Image.

 Vollbild-Hintergrundbild  Vollbild-Hintergrundbild Vollbild-Hintergrundbild

Klicken Sie dann auf Bild auswählen und laden Sie das gewünschte Bild als WordPress-Hintergrundbild hoch. Sie können auch ein Bild aus Ihrer Medienbibliothek auswählen, wenn Sie dort zuvor Ihr bevorzugtes Hintergrundbild hinzugefügt haben.

Bild auswählenBild auswählenBild auswählen

Sie können die Details wie Alternativtext, Beschriftung und Beschreibung des Bildes hinzufügen, wenn Sie möchten. Klicken Sie auf Bild verwenden und dann auf Optionen speichern.

Gehen Sie nun zu Ihrer Website, um zu sehen, wie Ihr WordPress-Hintergrundbild aussieht.

Möglichkeit 3. Hintergrundfotos mit CSS hinzufügen

Um ein Hintergrundbild mit CSS hinzuzufügen, müssen Sie eine selbst gehostete WordPress-Site haben oder einen kostenpflichtigen Plan abonnieren WordPress.com Mit benutzerdefiniertem CSS können Sie nicht nur ein Hintergrundbild hinzufügen, sondern auch verschiedene Änderungen am Erscheinungsbild Ihrer Website vornehmen, damit diese genau so aussieht, wie Sie es möchten.

Navigieren Sie zum WordPress-Dashboard und klicken Sie auf Darstellung > Zusätzliches CSS.

Zusätzliches CSSZusätzliches CSSZusätzliches CSS

Fügen Sie nun diese Codezeilen in das CSS-Feld ein, um ein WordPress-Hintergrundbild festzulegen.

body { background-image: url("https://theimageurl"); background-position: center center; background-size: cover; background-repeat: no-repeat; background-attachment: fixed;}

Ersetzen Sie http://theimageurl durch die URL des Bildes, das Sie als WordPress-Hintergrundbild verwenden möchten.

Sie können auch benutzerdefinierte Hintergründe und Bilder zu einzelnen Beiträgen auf Ihrer WordPress-Website hinzufügen. Dazu benötigen Sie diesen Code:

body.category-slug { background-image: url("http://anotherimageurl"); background-position: center center; background-size: cover; background-repeat: no-repeat; background-attachment: fixed;}

Wie zuvor müssen Sie http://anotherimageurl durch die URL des Bildes ersetzen, das Sie verwenden möchten. Sie müssen auch slug durch den Namen einer vorhandenen Kategorie auf Ihrer Site ersetzen.

Wenn Sie mit den Änderungen in CSS fertig sind, vergessen Sie nicht, auf die Schaltfläche Änderungen speichern zu klicken, um alle Änderungen zu speichern. Jetzt können Sie Ihre Website besuchen, um das neue Hintergrundbild anzuzeigen!

Achten Sie auf die Bildgröße

Bevor Sie ein Bild auf Ihre WordPress-Site hochladen, konzentrieren Sie sich auf dessen Größe. Es ist verlockend, ein qualitativ hochwertiges Bild hinzuzufügen. Dies kann jedoch die Ladegeschwindigkeit Ihrer Website erhöhen. Es klingt nicht nach einer großen Sache; je langsamer Ihre Website ist, desto höher ist jedoch die Absprungrate, was bedeutet, dass mehr Personen Ihre Website verlassen, bevor sie deren Inhalt lesen oder sehen. Dies wirkt sich wiederum auf Ihre Conversions aus. Google hat gesagt, dass zwei Sekunden die ideale Website-Geschwindigkeit sind, insbesondere wenn Sie ein Unternehmen führen.

Andererseits kann sich das Hinzufügen von Bildern mit schlechter Qualität, nur um eine kleinere Größe zu haben, auch negativ auf die Benutzererfahrung auswirken. Die ideale Vorgehensweise besteht also darin, ein Gleichgewicht zu halten und Bilder in guter Qualität hinzuzufügen, jedoch nur dann, wenn dies erforderlich ist — das heißt, wenn sie Ihren Inhalten einen Mehrwert verleihen, und nur in der erforderlichen Auflösung.

Zusammenfassung

In diesem Tutorial habe ich Ihnen drei Möglichkeiten gezeigt, das WordPress-Hintergrundbild festzulegen.

  1. Hinzufügen eines Hintergrundbilds über die Einstellungen für das Erscheinungsbild des Themas
  2. Verwenden eines Plugins zum Hinzufügen des Hintergrundbilds
  3. Hinzufügen von benutzerdefiniertem CSS

Möglicherweise benötigen Sie ein Hintergrundbild für Ihre WordPress-Website. Wenn Sie sich jedoch für ein Hintergrundbild entscheiden, sollten Sie wissen, dass es ein wichtiges Element ist, das Ihren Markenstil für Ihr Publikum festlegt. Stellen Sie also sicher, dass Ihr WordPress-Hintergrundbild Ihr Markenimage widerspiegelt.

Leave a Reply