{"id":81159,"date":"2020-01-22T16:30:20","date_gmt":"2020-01-22T15:30:20","guid":{"rendered":"https:\/\/www.ait-themes.club\/?p=81159"},"modified":"2023-10-20T11:30:11","modified_gmt":"2023-10-20T11:30:11","slug":"wordpress-image-block-tutorial-blog","status":"publish","type":"post","link":"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/","title":{"rendered":"Arbeiten mit dem WordPress-Bildblock: So f\u00fcgen Sie Bilder in WordPress hinzu [+Geheimtipp]"},"content":{"rendered":"<p class=\"wp-block-paragraph\">F\u00fcr viele Benutzer kann die Arbeit mit Bildern sehr frustrierend sein. Es ist nicht immer einfach, das richtige Seitenverh\u00e4ltnis zu w\u00e4hlen oder die Gr\u00f6\u00dfe von Bildern richtig zu \u00e4ndern, damit sie im gesamten Layout gut aussehen.<\/p>\n\n\n\n<ol class=\"wp-block-list\"><li><a href=\"#whyiswordpressimageblock\">Warum den WordPress-Bildblock verwenden?<\/a><\/li><li><a href=\"#howtoaddimagesinwpblock\">So f\u00fcgen Sie Bilder mit dem WordPress-Bildblock hinzu<\/a><\/li><li><a href=\"#otherimageblock\">Zus\u00e4tzlicher Formatierungsprozess f\u00fcr Bilder<\/a><\/li><li><a href=\"#extratipaboutimageblock\">Extra-Tipp von uns im Artikel<\/a><\/li><\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">\u00c4ltere WordPress-Versionen (bis v5.0) f\u00fcgen Bilder \u00fcber die Schaltfl\u00e4che +Medien hinzuf\u00fcgen hinzu. Das Problem bestand darin, dass Sie das Bild selbst bei minimaler \u00c4nderung der Bildgr\u00f6\u00dfe erneut hochladen mussten. Das bedeutet Zeitverschwendung und \u00fcberfl\u00fcssige Klicks.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Der neue blockbasierte Editor Gutenberg \u00e4ndert die Art und Weise, wie Bilder in WordPress hinzugef\u00fcgt werden, um diesen Prozess f\u00fcr Endbenutzer einfacher zu machen. In diesem Artikel zeigen wir Ihnen eine praktische Anleitung zum Hinzuf\u00fcgen und Bearbeiten von WordPress-Bildbl\u00f6cken. Dar\u00fcber hinaus erkl\u00e4ren wir Ihnen eine weitere M\u00f6glichkeit zum Einf\u00fcgen von Bildern \u2013 wie Sie ein Bild mit nur wenigen Klicks kopieren und in den Inhaltsbereich einf\u00fcgen. Wir stellen Ihnen auch neu hinzugef\u00fcgte Funktionen vor, die aus WP 5.3 stammen.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Aber lassen Sie uns zun\u00e4chst dar\u00fcber sprechen, warum Sie Bilder in Beitr\u00e4gen und Seiten verwenden sollten.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Why_is_WordPress_Image_block_must-have_for_your_website\"><\/span><a id=\"whyiswordpressimageblock\"><\/a>Warum ist der WordPress-Bildblock ein Muss f\u00fcr Ihre Website?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Attract_attention\"><\/span>Auffallen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Bilder erregen die Aufmerksamkeit der Website-Besucher. Sie m\u00fcssen interessant sein, um Besucher l\u00e4nger auf Ihrer Website zu halten. Denken Sie an einen Blogbeitrag ohne Bilder. Es ist nur ein Haufen Text. Auf den ersten Blick ist es nicht sehr interessant, obwohl es wertvoll und voller Informationen sein k\u00f6nnte. Dar\u00fcber hinaus k\u00f6nnen Fotos dabei helfen, sich Ihr Thema besser vorzustellen und zu beschreiben.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Aus diesem Grund m\u00fcssen wir den WordPress-Bildblock verwenden, um die Aufmerksamkeit auf wichtige Dinge zu lenken.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-images-example.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1600\" height=\"797\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-images-example.png\" alt=\"Beispiel f\u00fcr 2 Blogs mit oder ohne Bilder\" class=\"wp-image-81169\" srcset=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-images-example.png 1600w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-images-example-300x149.png 300w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-images-example-1024x510.png 1024w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-images-example-768x383.png 768w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-images-example-1536x765.png 1536w\" sizes=\"auto, (max-width: 1600px) 100vw, 1600px\" \/><\/a><figcaption>Beispiel f\u00fcr 2 Blogs mit oder ohne Bilder<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Illustrative_text_and_context\"><\/span>Illustrativer Text und Kontext<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Bilder sind auch ein wesentlicher Bestandteil f\u00fcr das Verst\u00e4ndnis von Inhalten, da sie es den Besuchern erm\u00f6glichen, besser zu verstehen, worum es in dem Artikel geht. Dank Infografiken k\u00f6nnen Sie komplizierte Zusammenh\u00e4nge erkl\u00e4ren und Dinge auf einfache Weise erz\u00e4hlen. Es hilft den Besuchern, sich besser in dem Problem zurechtzufinden, \u00fcber das Sie sprechen.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-infographic.png\"><img loading=\"lazy\" decoding=\"async\" width=\"819\" height=\"903\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-infographic.png\" alt=\"Infografik-Beispiel\" class=\"wp-image-81170\" srcset=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-infographic.png 819w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-infographic-272x300.png 272w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/blog-post-infographic-768x847.png 768w\" sizes=\"auto, (max-width: 819px) 100vw, 819px\" \/><\/a><figcaption>Infografik zur besseren Texterkl\u00e4rung<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Make_website_nicer\"><\/span>Website sch\u00f6ner machen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Dar\u00fcber hinaus geben Bilder dem gesamten Website-Design den letzten Schliff. Es geht nicht nur um das Layout einer Website, sondern auch um die Benutzerfreundlichkeit. Ein richtig ausgew\u00e4hltes und platziertes Bild kann Besuchern das Durchsuchen Ihrer Website erleichtern.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"How_to_add_images_in_WordPress_block_editor\"><\/span><a id=\"howtoaddimagesinwpblock\"><\/a>So f\u00fcgen Sie Bilder im WordPress-Blockeditor hinzu<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Um ein Bild in einen Beitrag oder eine Seite einzuf\u00fcgen, m\u00fcssen Sie den Kernblock \u2013 Bildblock \u2013 hinzuf\u00fcgen. Es gibt mehrere M\u00f6glichkeiten, dies zu tun:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2013 Verwenden Sie \u201e+\u201c in der oberen Leiste oder an einer beliebigen Stelle im Editor<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-add.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"800\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-add.png\" alt=\"F\u00fcgen Sie einen Bildblock hinzu, indem Sie auf \u201e+\u201c klicken.\" class=\"wp-image-81171\" srcset=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-add.png 1280w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-add-300x188.png 300w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-add-1024x640.png 1024w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-add-768x480.png 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/a><figcaption>Hinzuf\u00fcgen eines WordPress-Bildblocks durch Klicken auf \u201e+\u201c<\/figcaption><\/figure><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">\u2013 Verwenden Sie den Schr\u00e4gstrich \u201e\/\u201c und schreiben Sie anschlie\u00dfend das Wort \u201eBild\u201c.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-shortcut.gif\"><img loading=\"lazy\" decoding=\"async\" width=\"720\" height=\"520\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-shortcut.gif\" alt=\"Bildblock mit Schr\u00e4gstrich hinzuf\u00fcgen\" class=\"wp-image-81177\"\/><\/a><figcaption>Bildblock mit Schr\u00e4gstrich \u201e\/\u201c hinzuf\u00fcgen<\/figcaption><\/figure><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Es wird ein neuer Block erstellt, in dem Sie aktuelle Bilder hinzuf\u00fcgen k\u00f6nnen.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Uploading_images_to_WordPress\"><\/span>Hochladen von Bildern in WordPress<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Wie platziere ich Bilder an der gew\u00fcnschten Stelle?<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Verwenden Sie \u201eHochladen\u201c und w\u00e4hlen Sie ein Bild von Ihrer Festplatte aus<\/li><li>Verwenden Sie die Medienbibliothek, in der Sie Bilder ausw\u00e4hlen k\u00f6nnen, die bereits auf Ihre Website hochgeladen wurden<\/li><li>Verwenden Sie die Maus und ziehen Sie das Bild per Drag &amp; Drop<\/li><li>Geben Sie die URL-Adresse des Bildes ein<\/li><\/ul>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-upload.gif\"><img loading=\"lazy\" decoding=\"async\" width=\"720\" height=\"400\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-upload.gif\" alt=\"Optionen zum Hochladen von Bildern\" class=\"wp-image-81178\"\/><\/a><figcaption>Verf\u00fcgbare Optionen zum Hochladen von Bildern \u2013 eine davon ist das Ziehen und Ablegen von Bildern aus dem Ordner<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Less_known_method_of_adding_WordPress_images\"><\/span>Weniger bekannte Methode zum Hinzuf\u00fcgen von WordPress-Bildern<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Neben dem Hochladen von Bildern \u00fcber das Upload-Fenster, wie bereits erw\u00e4hnt, gibt es eine andere M\u00f6glichkeit, Bilder einzuf\u00fcgen (und das ist so schnell!). Mit dem verbesserten WordPress-Editor k\u00f6nnen Sie:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Bild aus beliebigem Inhalt kopieren, oder<\/li><li>Ziehen Sie das Bild einfach mit dem Mauszeiger<\/li><\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Anschlie\u00dfend k\u00f6nnen Sie das ausgew\u00e4hlte Bild an die gew\u00fcnschte Stelle im Inhaltsbereich einf\u00fcgen oder verschieben (ablegen).<\/p>\n\n\n\n<div class=\"wp-block-image wp-image-84761\"><figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"276\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/12\/Drag-and-drop-image-to-post.gif\" alt=\"Ziehen Sie das Bild per Drag-and-Drop vom ver\u00f6ffentlichten Beitrag in den Inhaltsbereich\" class=\"wp-image-84761\"\/><figcaption>Ziehen Sie das ausgew\u00e4hlte Bild und legen Sie es dort ab, wo Sie es ben\u00f6tigen (direkt zum WordPress-Editor).<\/figcaption><\/figure><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Die gleiche Technik k\u00f6nnen Sie auch verwenden, wenn Sie ein von Ihrem Bildschirm aufgenommenes Bild einf\u00fcgen m\u00f6chten. Es sind nur drei einfache Schritte erforderlich. Erste, <strong>Sie m\u00fcssen einen Screenshot machen<\/strong> Verwenden der Funktion \u201eBildschirm drucken\u201c. Beispielsweise stellt Windows 10 sein Standard-Snippet-Tool namens Snip &amp; Sketch zur Verf\u00fcgung, das auch \u00fcber eine Tastenkombination verf\u00fcgbar ist \u2013 dr\u00fccken Sie einfach gleichzeitig die Tasten Win+Umschalt+S auf Ihrer Tastatur. W\u00e4hlen Sie dann den Bildbereich aus, den Sie aufnehmen m\u00f6chten. Der letzte Schritt besteht darin, das kopierte Bild (oder einen Teil davon) mit der einfachen Tastenkombination Strg+V in den Inhaltsbereich einzuf\u00fcgen.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Und was passiert mit dem WordPress-Bild, das Sie in Ihren Editor eingef\u00fcgt haben? Nun, es wird automatisch zur Medienbibliothek hinzugef\u00fcgt, wo Sie dieses Bild bearbeiten k\u00f6nnen.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Image_metadata_limited_options\"><\/span>Begrenzte Optionen f\u00fcr Bildmetadaten<span class=\"ez-toc-section-end\"><\/span><\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">In der Bildbearbeitung k\u00f6nnen Sie Titel, Bildunterschrift, Beschreibung und Alternativtext festlegen. Leider k\u00f6nnen Sie den Namen der Bilddatei nicht \u00e4ndern \u2013 der automatisch generierte Name bleibt erhalten, z.\u00a0B <em>Bild-1.png<\/em> usw. Diese Art von Dateinamen kann im Hinblick auf die SEO-Optimierung einen kleinen Nachteil darstellen, da sie mit den Empfehlungen zur Dateibenennung in Konflikt steht. Daher m\u00fcssen Sie diesen Aspekt ber\u00fccksichtigen, bevor Sie WordPress-Bilder in den Inhaltsbereich verschieben.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Image_alignment\"><\/span>Bildausrichtung<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Die Bildausrichtung ist eines der Hauptmerkmale. Unabh\u00e4ngig davon, ob Sie einen WordPress-Bildblock zu einem Beitrag oder einer Seite hinzuf\u00fcgen, sollten Sie immer die Platzierung je nach Website-Design ber\u00fccksichtigen. Basierend darauf kann in der Symbolleiste dar\u00fcber die Bildausrichtung ausgew\u00e4hlt werden. Standardm\u00e4\u00dfig k\u00f6nnen Sie das Bild links, rechts ausrichten oder zentrieren. Bei einigen WordPress-Themes k\u00f6nnen Bilder in der Breite oder in voller Breite zentriert werden. Es h\u00e4ngt wirklich von den Theme-Funktionen ab, da nicht alle Themes dies unterst\u00fctzen.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-align.gif\"><img loading=\"lazy\" decoding=\"async\" width=\"720\" height=\"520\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-align.gif\" alt=\"Bildausrichtungseinstellungen\" class=\"wp-image-81172\"\/><\/a><figcaption>Bildausrichtungsoptionen<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Resizing_images\"><\/span>Gr\u00f6\u00dfen\u00e4nderung von Bildern<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Die revolution\u00e4re Funktion des Bildblocks im WordPress-Editor ist die praktische Gr\u00f6\u00dfen\u00e4nderung. Ziehen Sie einfach an der Seite des Bildes, um es zu verkleinern oder zu vergr\u00f6\u00dfern. Auf diese Weise k\u00f6nnen Sie die Bildgr\u00f6\u00dfe je nach Text im Inhalt anpassen. Der Editor beh\u00e4lt die Bildproportionen automatisch bei, sodass Sie sich keine Sorgen \u00fcber Verformungen machen m\u00fcssen.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-resize.gif\"><img loading=\"lazy\" decoding=\"async\" width=\"720\" height=\"520\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-resize.gif\" alt=\"Bildgr\u00f6\u00dfe \u00e4ndern\" class=\"wp-image-81175\"\/><\/a><figcaption>Reibungslose Gr\u00f6\u00dfen\u00e4nderung des Bildes durch Einrasten der Griffe<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"New_block_style_that_transforms_an_image_into_a_circle_shape\"><\/span>Neuer Blockstil, der ein Bild in eine Kreisform umwandelt<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Wenn Sie die neueste verf\u00fcgbare Version von WordPress verwenden, ist Ihnen m\u00f6glicherweise ein neuer Stil zum Zuschneiden von Kreisen aufgefallen, den Sie f\u00fcr Ihr Bild verwenden k\u00f6nnen. Die Form des Bildes kann \u00fcber die obere Symbolleiste ge\u00e4ndert werden, indem Sie auf das erste Symbol \u201eBlocktyp oder -stil \u00e4ndern\u201c klicken. Die Standardform (Rechteck) wird in eine Kreisform geschnitten.<\/p>\n\n\n\n<figure class=\"wp-block-image alignnone size-full wp-image-84327\"><img loading=\"lazy\" decoding=\"async\" width=\"1494\" height=\"787\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/circle-style-of-wordpress-images.png\" alt=\"Kreisform des Bildes\" class=\"wp-image-84327\" srcset=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/circle-style-of-wordpress-images.png 1494w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/circle-style-of-wordpress-images-300x158.png 300w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/circle-style-of-wordpress-images-1024x539.png 1024w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/circle-style-of-wordpress-images-768x405.png 768w\" sizes=\"auto, (max-width: 1494px) 100vw, 1494px\" \/><figcaption>Das neue Kreisdesign f\u00fcr Ihre Bilder<\/figcaption><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"New_features_in_WordPress_Images_block_added_in_WP_53\"><\/span>Neue Funktionen im WordPress-Bilderblock (hinzugef\u00fcgt in WP 5.3)<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<h4 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Support_for_high_resolution_images\"><\/span>Unterst\u00fctzung f\u00fcr hochaufl\u00f6sende Bilder<span class=\"ez-toc-section-end\"><\/span><\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">Eines der gr\u00f6\u00dften Highlights von WP 5.3 ist die verbesserte Bildverarbeitung auf der WordPress-Plattform. Die Arbeit mit Bildern verf\u00fcgt nun \u00fcber zwei Hauptfunktionen:<\/p>\n\n\n\n<ol class=\"wp-block-list\"><li>Fortsetzen des Hochladens \u2013 Wenn Sie hochaufl\u00f6sende Fotos hochladen und die Internetverbindung ausf\u00e4llt, wird der Hochladevorgang automatisch an der unterbrochenen Stelle fortgesetzt<\/li><li>Automatische Bilddrehung \u2013 die neueste ver\u00f6ffentlichte WP-Version stellt sicher, dass falsch gedrehte Bilder beim Hochladen automatisch in die richtige Position gedreht werden<\/li><\/ol>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Settings_in_Inspector\"><\/span>Einstellungen im Inspektor<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Um die genauen Abmessungen zu konfigurieren, k\u00f6nnen Sie den Inspektor in der rechten Seitenleiste im Editor verwenden. Die Bildgr\u00f6\u00dfeneinstellungen bieten gebrauchsfertige Formate wie Miniaturansicht, mittlere, gro\u00dfe oder volle Gr\u00f6\u00dfe. Sie k\u00f6nnen die Breite und H\u00f6he nat\u00fcrlich in Pixeln oder Prozents\u00e4tzen festlegen.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-settings.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"803\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-settings.png\" alt=\"Verf\u00fcgbare Bildgr\u00f6\u00dfeneinstellungen\" class=\"wp-image-81180\" srcset=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-settings.png 1280w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-settings-300x188.png 300w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-settings-1024x642.png 1024w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-settings-768x482.png 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/a><figcaption>Bildgr\u00f6\u00dfeneinstellungen<\/figcaption><\/figure><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Es ist sehr schnell und praktisch, da Sie alle Bildgr\u00f6\u00dfen\u00e4nderungen direkt im WordPress-Bilderblock und alles an einem Ort im Blockeditor vornehmen k\u00f6nnen.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Other_Images_block_settings\"><\/span><a id=\"otherimageblock\"><\/a>Andere Bilder blockieren Einstellungen<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"How_to_add_URL_address\"><\/span>So f\u00fcgen Sie eine URL-Adresse hinzu<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Bilder k\u00f6nnen als statische Bilder verwendet werden oder auch anklickbar sein und verlinken auf:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>&nbsp; Mediendatei<\/li><li>&nbsp; Anhangseite<\/li><li>&nbsp; eigene URL<\/li><\/ul>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-link-settings.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"803\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-link-settings.png\" alt=\"Bildlink-Einstellungen\" class=\"wp-image-81183\" srcset=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-link-settings.png 1280w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-link-settings-300x188.png 300w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-link-settings-1024x642.png 1024w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-link-settings-768x482.png 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/a><figcaption>Verf\u00fcgbare Bildverkn\u00fcpfungseinstellungen<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"How_to_edit_picture_in_WordPress_Image_block\"><\/span>So bearbeiten Sie Bilder im WordPress-Bildblock<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Jedes Bild kann nach einem Klick auf das Stiftsymbol bearbeitet werden. Es \u00f6ffnet sich ein modales Fenster mit der Medienbibliothek, in dem Sie Alternativtext, Titel, Bildunterschrift und Beschreibung eingeben k\u00f6nnen. Auf die gleiche Weise, wie Sie es bereits von \u00e4lteren WordPress-Versionen mit dem klassischen Editor gewohnt sind.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/media-library.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"800\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/media-library.png\" alt=\"Bilddetails f\u00fcr SEO-Zwecke\" class=\"wp-image-81182\" srcset=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/media-library.png 1280w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/media-library-300x188.png 300w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/media-library-1024x640.png 1024w, https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/media-library-768x480.png 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/a><figcaption>Bilddetails, die Sie ausf\u00fcllen sollten, um die SEO Ihrer Website zu verbessern<\/figcaption><\/figure><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Warum ist es wichtig, diese Texte ausf\u00fcllen zu lassen?<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Wenn Besucher auf das Bild klicken, um es gr\u00f6\u00dfer zu sehen, sehen sie den Bildtitel (z. B. Citadela-Homepage) und nicht den Dateinamen des Bildes. Sollte beim Laden des Bildes ein Problem auftreten, wird au\u00dferdem alternativer Text auf Ihrer Website angezeigt.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Extra_Tips\"><\/span><a id=\"extratipaboutimageblock\"><\/a>Zus\u00e4tzliche Tipps<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Neben all diesen Gr\u00fcnden und Einstellungen f\u00fcr WordPress-Bilderbl\u00f6cke gibt es das Wichtigste. Mithilfe von Bildern k\u00f6nnten Sie mehr Besucher auf Ihre Website gewinnen. Wie bekommt man sie also?<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Heutzutage sind die Leute faul zum Lesen. Sie ziehen es vor, in den Bildern nach unten zu scrollen, um Antworten zu finden. Wie kommt es, dass Ihre Fotos und Bilder einen Rang erreichen? Texte sind die Antwort. Sehr wichtig f\u00fcr die SEO-Optimierung ist der perfekte Bildtitel und die perfekte Beschreibung. Vergessen Sie nicht, Alternativtext einzugeben. Dann kann Google das Bild besser verstehen. Sie h\u00e4tten also eine h\u00f6here Chance, es in den Bildsuchergebnissen zu platzieren.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2_ways_how_to_add_image_caption\"><\/span>2 M\u00f6glichkeiten, Bildunterschriften hinzuzuf\u00fcgen<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Das Hinzuf\u00fcgen von Bildunterschriften ist mit dem Blockeditor sehr einfach. Direkt unter dem Bild befindet sich ein Platz zum Schreiben von Text. Dies ist die erste M\u00f6glichkeit \u2013 die Beschriftung wird genau zu diesem Bild auf der jeweiligen Unterseite geschrieben.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-caption.gif\"><img loading=\"lazy\" decoding=\"async\" width=\"720\" height=\"520\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-caption.gif\" alt=\"Bildbeschreibung\" class=\"wp-image-81173\"\/><\/a><figcaption>Die Bildunterschrift steht direkt unter dem Bild<\/figcaption><\/figure><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Die zweite M\u00f6glichkeit besteht darin, eine Bildunterschrift mit dem Stiftsymbol (Bild bearbeiten) in der Medienbibliothek zu schreiben. Auf diese Weise f\u00fcgen Sie Bildunterschriften global auf der gesamten Website hinzu. Das hei\u00dft, wenn Sie dasselbe Bild an drei verschiedenen Stellen verwenden, wird immer diese Bildunterschrift verwendet.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-caption-library.gif\"><img loading=\"lazy\" decoding=\"async\" width=\"720\" height=\"520\" src=\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/gutenberg-image-caption-library.gif\" alt=\"Bildunterschrift zur Medienbibliothek hinzuf\u00fcgen\" class=\"wp-image-81174\"\/><\/a><figcaption>Bildunterschrift \u00fcber Medienbibliothek hinzugef\u00fcgt<\/figcaption><\/figure><\/div>\n\n\n\n<p class=\"has-text-align-center wp-block-paragraph\">Gef\u00e4llt Ihnen, wie einfach es ist, Bilder im WordPress-Bildblock hinzuzuf\u00fcgen? Probieren Sie es selbst aus!<\/p>\n\n\n\n<p class=\"has-text-align-center wp-block-paragraph\">Erfahren Sie mehr \u00fcber unser brandneues Citadela WordPress-Theme und seine ma\u00dfgeschneiderten Layout-Pakete. Sie wurden speziell f\u00fcr verschiedene Arten von Unternehmen entworfen und entwickelt und unterst\u00fctzen auch die neue Art der Inhaltsbearbeitung \u00fcber den WordPress-Blockeditor.<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_80 counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Inhalts\u00fcbersicht<\/p>\n<span class=\"ez-toc-title-toggle\"><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Why_is_WordPress_Image_block_must-have_for_your_website\" >Warum ist der WordPress-Bildblock ein Muss f\u00fcr Ihre Website?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Attract_attention\" >Auffallen<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Illustrative_text_and_context\" >Illustrativer Text und Kontext<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Make_website_nicer\" >Website sch\u00f6ner machen<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#How_to_add_images_in_WordPress_block_editor\" >So f\u00fcgen Sie Bilder im WordPress-Blockeditor hinzu<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Uploading_images_to_WordPress\" >Hochladen von Bildern in WordPress<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Less_known_method_of_adding_WordPress_images\" >Weniger bekannte Methode zum Hinzuf\u00fcgen von WordPress-Bildern<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Image_metadata_limited_options\" >Begrenzte Optionen f\u00fcr Bildmetadaten<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Image_alignment\" >Bildausrichtung<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Resizing_images\" >Gr\u00f6\u00dfen\u00e4nderung von Bildern<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#New_block_style_that_transforms_an_image_into_a_circle_shape\" >Neuer Blockstil, der ein Bild in eine Kreisform umwandelt<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#New_features_in_WordPress_Images_block_added_in_WP_53\" >Neue Funktionen im WordPress-Bilderblock (hinzugef\u00fcgt in WP 5.3)<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Support_for_high_resolution_images\" >Unterst\u00fctzung f\u00fcr hochaufl\u00f6sende Bilder<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Settings_in_Inspector\" >Einstellungen im Inspektor<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Other_Images_block_settings\" >Andere Bilder blockieren Einstellungen<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#How_to_add_URL_address\" >So f\u00fcgen Sie eine URL-Adresse hinzu<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#How_to_edit_picture_in_WordPress_Image_block\" >So bearbeiten Sie Bilder im WordPress-Bildblock<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-18\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#Extra_Tips\" >Zus\u00e4tzliche Tipps<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-19\" href=\"https:\/\/www.ait-themes.club\/de\/wordpress-image-block-tutorial-blog\/#2_ways_how_to_add_image_caption\" >2 M\u00f6glichkeiten, Bildunterschriften hinzuzuf\u00fcgen<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>","protected":false},"excerpt":{"rendered":"<p>F\u00fcr viele Benutzer kann die Arbeit mit Bildern sehr frustrierend sein. Es ist nicht immer einfach, das richtige Seitenverh\u00e4ltnis zu w\u00e4hlen oder die Gr\u00f6\u00dfe von Bildern richtig zu \u00e4ndern, damit sie im gesamten Layout gut aussehen. Warum Sie den WordPress-Bildblock verwenden sollten. So f\u00fcgen Sie Bilder mit dem WordPress-Bildblock hinzu. Zus\u00e4tzliche Formatierung von Bildern. Extra-Tipp von uns.<\/p>","protected":false},"author":1,"featured_media":81168,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","_citadela_custom_class":"","footnotes":""},"categories":[4,50],"tags":[15],"citadela-post-location":[],"class_list":["post-81159","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-building-websites-in-wordpress","category-citadela-pro-documentation","tag-gutenberg-wordpress-editor"],"_links":{"self":[{"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/posts\/81159","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/comments?post=81159"}],"version-history":[{"count":1,"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/posts\/81159\/revisions"}],"predecessor-version":[{"id":94279,"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/posts\/81159\/revisions\/94279"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/media\/81168"}],"wp:attachment":[{"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/media?parent=81159"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/categories?post=81159"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/tags?post=81159"},{"taxonomy":"citadela-post-location","embeddable":true,"href":"https:\/\/www.ait-themes.club\/de\/wp-json\/wp\/v2\/citadela-post-location?post=81159"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}