Update Juni 2017: Dank des neuen “Foto-Widgets” in WordPress 4.8, ist es deutlich einfacher geworden, Bilder in Seitenleisten und in der Fußzeile zu platzieren. Die hier beschreibende Methode ist nicht mehr zwingend nötig.
Wir nennen WordPress den ‘größten Website-Baukasten der Welt’. Den Möglichkeiten sind quasi keine Grenzen gesetzt und mit der Erstellung einer eigenen Website holt man sich diese Möglichkeiten nach Hause oder ins Büro. WordPress bietet als Content-Management-System (oder auch ‘Redaktionssystem’) in Kombination mit einem guten Theme (Das Design der Website) und ein paar ausgewählten Zusatzfunktionen in Form von Plugins, die perfekte Grundlage für Websites, die jedem Anspruch gerecht werden. Bei all den Funktionen übersieht man aber schon mal etwas. Nachfolgend zeigen wir, wie man bei dem von WordPress mitgelieferten ‘Text-Widget’ ein Bild einfügt.
Das WordPress Text-Widget
Mit der Installation von WordPress erhält man automatisch einige Widgets zum Befüllen der Sidebars (Seitenleisten). Beispiele hierfür sind das Suchformular, ein Kalender, die letzten Blogbeiträge, ein individuelles Menü und das Text-Widget. Letzteres kann man mit Text versehen, welcher durch HTML-Elemente optisch anpassbar ist. Naheliegend ist, dass ebenfalls Bilder eingefügt werden können. Wie das geht? Bitteschön:
Um einfach nur ein Bild in das Text-Widget einzufügen ist lediglich folgender Code nötig
<img src="Bild.png" />
Das Bild muss nicht alleine stehen, es kann überhalb, unterhalb oder innerhalb eines ebenfalls mit HTML formatierten Textes stehen.
Das Bild sollte man vorher in der Mediathek hochgeladen haben. Dabei erhält man die Datei-URL die man an Stelle von “Bild.png” einfügt.
Das Bild wird dann automatisch in die Breite des Widgets angepasst. Sollte das aber mal nicht klappen oder möchte man das Bild kleiner anzeigen, fügt man dem Code Folgendes hinzu:
width="100px"
Soll das Bild anklickbar sein und zu einer Seite oder einem Artikel führen, ist folgender Code nötig
<a href="https://elbnetz.com"><img src="Bild.png" /></a>
Das Ergebnis sieht dann so aus:
30 Kommentare. Wir freuen uns über Ihren Kommentar
Danke dir! Du hast mir unglaublich geholfen!
Am meisten der Part mit dem Verändern der Größe. Das ist Gold Wert. Danke
Man macht das so selten, dass ich immer wieder nachgucken muß, wie es geht, danke für das Bereitstellen :-)
Tausend Dank!
Endlich mal ein kurzer, gut dargestellter und hilfreicher Tipp!
Dieser Beitrag rettet mir mein Leben, vielen vielen Dank dafür! :)
Und super gut und einfach erklärt, tolle Anleitung! Echt, ich wäre darauf ohne diesen Beitrag hier nie gekommen ;)
…da das so prima funktioniert, ergibt sich für mich aber eine weitere Frage: ich verwende die Standard Gallery von WP zusammen mit dem Polaroid Gallery Plugin (finde ich superschön!).
Jetzt möchte ich aber in der Gallery nicht ALLE Bilder anzeigen, sondern nur drei, die anderen sollen dann erst beim Blättern sichtbar werden. Wie stelle ich das an ?
LG, Susi
PS: Ab wann gibt es die Schulungstermine für Dezember?
Liebe Susi,
bitte habe Verständnis, das wir nicht jedes Plug-in kennen und entsprechend – wie in diesem Fall – nicht in jedem Fall weiterhelfen können. Frag doch am besten im Supportforum des Plug-ins nach.
Sonnige Grüße,
Die Elbnetz-Redaktion
super, hat geklappt ! Danke !
Hallo und zunächst schon mal danke für die wertvollen gefunden Tipps.
Ich hätte im Widget-Bereich gerne nicht nur ein Bild, sondern eine kleine Gallery. Ist das denn auch möglich ?
Viele Grüße
Susanne
Halo Susi,
ja, das ist möglich. Erstelle einfach eine Galerie über die Option “Datei hinzufügen” auf einer Seite oder einem Beitrag, wechsle zum Text-Editor und kopiere den für die Galerie erstellten Shortcode. Diesen führst Du in das gewünschte Text-Widget ein.
Viel Erfolg!
Die Elbnetz-Redaktion
Liebe Elbnetzter,
nach diversen anderen Anleitungen bin ich etwas verzweifelt und leicht verwirrt auf euren kurzen und leicht verständlichen Beitrag gestoßen. Keine 5 Minuten später war mein Problem gelöst und die Anpassung vorgenommen.
Herzlichen Dank für euren tollen support!
Beste Grüße aus Colonia und ein schönes WE
Stathis
Sehr hilfreich, ganz herzlichen Dank!!!
Gruß Frau Käferin
Hallo!
Danke für die Hilfe. Eigentlich ganz einfach aber mit einer kurzen Anleitung klappt`s problemlos.
Besten Dank für die kurze aber verständliche Erklärung. Hat uns viel geholfen und die Bilder machen so richtig was her. Werden uns auch mal weitere Tipps von euch anschauen.
Hallo, mir ist ein Unglück passiert. Hatten auf der Homepage ein Text Widget. Den Text habe ich leider versehentlich gelöscht. Habe noch ein Backup der WP Installation. Wo kann ich den ursprünglichen Text wiederfinden?
Vielen Dank Ralf
Guten Morgen Ralf,
die einzig praktikable Chance das Widget zu retten ist, das Backup wieder einzuspielen. Anders als Seiten und Beiträge landen die Widgets nicht in einem Papierkorb.
Sonnige Grüße
Ihre Elbnetz-Redaktion
Vielen herzlichen Dank für Eure klare Anweisung, sogar bei mir hats funktioniert;). Ist es eigentlich möglich die Schriftgrösse im Textwidget auch zu verändern?
Würde ich in Hamburg leben, würde ich euren Workshop besuchen, Wien ist leider zu weit weg, aber danke für Eure Blogs!
Es freut uns, dass wir Dir helfen konnten. Die Schriftgröße kannst Du auch ganz einfach anpassen, in dem Du den folgenden Code verwendest:
<span style="font-size:20px;">Hier kommt Dein Text hin</span>Jetzt musst Du nur noch die passende Größe unter fortrisse eintragen.
PS.: Wien ist ein sehr schöne Stadt, aber auch Hamburg ist immer eine Reise wert.
Liebe Grüße,
Dein Elbnetz-Team
Vielen Dank für diesen ausführlichen und dennoch einfachen Beitrag. Gerade diese simplen Dinge vergisst man in Zeiten von WYSIWYG Editoren mal schnell. Was natrürlich die Frage aufwirft “Warum lässt sich das text Widget nicht per Editor mit Informationen füllen?”. Vielleicht kommt dies ja in einer zukünftigen WordPress version. Nochmals Danke und liebe Grüße aus Irland
Hallo Markus,
wir sind nicht sicher, ob die gewünschte Funktion in einer der nächsten WordPress Versionen implementiert wird.
Bis dahin können Sie ja Ihr WordPress mit Hilfe eines der folgenden Plug-ins erweitern:
Herzliche Grüße nach Irland,
Ihre Elbnetz-Redaktion
Super Hilfe, aber was muss ich noch eintragen, damit der Link (hinter dem Bild) sich in einem neuen Fenster öffnet?
Hallo Heike,
damit sich der Link in einem neuen Fenster oder Tab öffnet, musst du dem Link die Zielvorgabe target=”_blank” hinzufügen, also in etwa so: <a href=”//elbnetz.com/” target=”_blank” rel=”nofollow”>Elbnetz.com</a>
Schönes Wochenende,
Das Elbnetz-Team
Vielen herzlichen Dank. Werde es gleich ausprobieren!
Ich wünsche einen tollen Wochenstart.
Sehr hilfreicher Tipp, vor allem hat sich somit meine Frage des nofollow-links geklärt, danke euch!!
Lassen sich auch zwei kleine Bilder nebeneinander platzieren ?
Ja, richten Sie die beiden Bilder links aus: class=”alignleft”
Hier gibt es mehr Infos dazu: //elbnetz.com/tipps-und-tricks-beim-ausrichten-von-bildern-in-wordpress/
Endlich mal ein Kommentar, wo es auf Anhieb klappt! Danke!
Bin über 50 und WP-Neuling. Komme mir manchmal vor wie in der
Linux-Anfangs-Zeit. Nicht einfach!
Wo findet man einen ebenso klaren Artikel zum Einbetten von Bildern in den Textfluss?
LG
L.
Ahoi Lutz!
Es freut uns, wenn wir Dir weiterhelfen konnten! Einen Artikel zum Einbetten von Bilder haben wir auch bereits verfasst. Versuch mal diesen Link: //elbnetz.com/tipps-und-tricks-beim-ausrichten-von-bildern-in-wordpress/.
Falls für Dich ein Workshop in Hamburg infrage kommt, der Dir den Start in die Welt von WordPress erleichtert, dann kannst Du hier Inhalte und Termine finden: wp-schulung.de.
Einen erfolgreichen Start in die Woche wünscht
Thorsten
Da ich absolut kein Wissen über HTML besitze, habt ihr mir sehr weitergeholfen, denn ich möchte in meiner Sidebar Fotos einfügen. Auch die Angabe über Änderung der Größe ist wehr wertvoll.
Ich probiere das jetzt direkt aus.
Klasse Anweisung, genau so, dass jeder es schaffen kann, auch wenn er keine ausgeprägten IT-Kenntnisse hat.
Weiter so Elbnetz!
Vielen Dank für diesen guten Beitrag. Besonder gut geholfen hat der Hinweis für die Bildgröße. Beste Grüße aus Essen. Torsten Schrimper