{"id":831,"date":"2018-02-16T17:10:16","date_gmt":"2018-02-16T16:10:16","guid":{"rendered":"http:\/\/evileu.de\/zum-schwarzen-pinguin\/?p=831"},"modified":"2018-02-16T17:18:07","modified_gmt":"2018-02-16T16:18:07","slug":"joomla-und-die-bilder-ein-stiefmuetterliches-verwirrspiel","status":"publish","type":"post","link":"https:\/\/evileu.de\/zum-schwarzen-pinguin\/2018\/02\/16\/joomla-und-die-bilder-ein-stiefmuetterliches-verwirrspiel\/","title":{"rendered":"Joomla und die Bilder: ein stiefm\u00fctterliches Verwirrspiel"},"content":{"rendered":"<p>Man hat in Joomla prinzipiell drei M\u00f6glichkeiten, Bilder in einen Artikel einzuf\u00fcgen. Einmal als Inline-Element im Beitragseditor, wie wir das auch von WordPress her kennen. Dann gibt es noch das Einleitungsbild, entspricht in etwa dem Artikelbild in WordPress und wird in der Blogansicht \u00fcber dem Artikel dargestellt. Und schliesslich noch das komplette Beitragsbild, das wie der Name schon sagt in der kompletten Ansicht des Artikels zu sehen ist.<\/p>\n<p>Zu beachten ist in allen drei F\u00e4llen: Joomla hat keine Hilfsmechanik zum Bilderskalieren, jedes hochgeladene Bild landet in voller Pracht und Gr\u00f6sse im images-Verzeichnis und wird f\u00fcr die Anzeige auch in voller Gr\u00f6\u00dfe geladen. Da, wo es WordPress ein bisschen \u00fcbertreibt mit einem halben Dutzend und mehr passend zum Theme skalierter Bildkopien, tut Joomla von selber rein gar nix. Und ich hab lang gegooglet, aber Joomla-Extensions zum komfortablen Bilderskalieren beim Hochladen gibts anscheinend nicht als Public Domain, das sind alles Paid Downloads. Scheint so als wenn einem ohne zus\u00e4tzliche Software nichts anderes \u00fcbrig bleibt, als hochzuladende Bilder vorher per Hand auf ein vern\u00fcnftiges Ma\u00df zu skalieren. Keine so richtig benutzerfreundliche L\u00f6sung!<\/p>\n<h2>Einleitungsbild und komplettes Beitragsbild<\/h2>\n<p>Diese legt man im Artikeleditor unter dem Reiter &#8222;Bilder und Links&#8220; an, hier kann auch der Alt-Text und eine Bildunterschrift angegeben werden. Eine Option f\u00fcr das title-Tag hab ich nicht gefunden, aber wenigstens der Alternativtext ist vorgesehen&#8230; man ist ja schon f\u00fcr Kleinigkeiten dankbar.<\/p>\n<p>Die hier vorgenommenen Einstellungen landen \u00fcbrigens im Datensatz des Artikels in der #__contents-Tabelle, im Feld images, das sieht dann zum Beispiel so aus:<\/p>\n<p><em>{&#8222;image_intro&#8220;:&#8220;images\\\/Appetitbrtchen.jpg&#8220;,&#8220;float_intro&#8220;:&#8220;&#8220;,&#8220;image_intro_alt&#8220;:&#8220;Bernhard i\\u00dft ein Appetitbr\\u00f6tchen&#8220;,&#8220;image_intro_caption&#8220;:&#8220;Bernhard mit Appetitbr\\u00f6tchen&#8220;,&#8220;image_fulltext&#8220;:&#8220;images\\\/avocado.jpg&#8220;,&#8220;float_fulltext&#8220;:&#8220;&#8220;,&#8220;image_fulltext_alt&#8220;:&#8220;Maitre Philippe bereitet Avocadoh\\u00e4ppchen zu&#8220;,&#8220;image_fulltext_caption&#8220;:&#8220;Avocadoh\\u00e4ppchen&#8220;}<\/em><\/p>\n<p>Braucht uns aber eigentlich nicht weiter zu k\u00fcmmern, man kanns ja im Editor an der Oberfl\u00e4che einstellen.<\/p>\n<h2>Beitragsbilder im Beitragseditor<\/h2>\n<p>Hier wirds ein bisschen undurchsichtig, was die Zuordnung der img-Attribute angeht, aber ich versuchs mal der Reihe nach aufzudr\u00f6seln.<\/p>\n<p>Wenn man ein Bild hochl\u00e4dt und in den Artikel einf\u00fcgt ohne irgendwelche zus\u00e4tzlichen Informationen anzugeben, sieht der img-Tag erstmal so aus:<\/p>\n<p>&lt;img src=&#8220;images\/Johannisbeeren.jpg&#8220; alt=&#8220;&#8220; \/&gt;<\/p>\n<p>Der alt-Tag ist zwar da, aber leer. Wenn man das korrigieren m\u00f6chte ist Handarbeit angesagt. Rechter Mausklick auf das Bild, Bild anw\u00e4hlen und hier was eintragen:<\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-835\" src=\"http:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/bild_kontextmenu.jpg\" alt=\"bild_kontextmenu\" width=\"539\" height=\"323\" srcset=\"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/bild_kontextmenu.jpg 539w, https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/bild_kontextmenu-300x180.jpg 300w\" sizes=\"(max-width: 539px) 100vw, 539px\" \/><\/p>\n<p>Hier kann man auch eine Anzeigegr\u00f6sse f\u00fcr das Bild einstellen, aber das nur am Rande bemerkt. Wenn man sich jetzt den img-Tag anschaut sieht man Folgendes:<\/p>\n<p><em>&lt;img title=&#8220;Titel der Johannisbeeren&#8220; src=&#8220;images\/Johannisbeeren.jpg&#8220; alt=&#8220;Beschreibung der Johannisbeeren&#8220; width=&#8220;829&#8243; height=&#8220;1091&#8243; \/&gt;<\/em><\/p>\n<p>Ah so, die Bildbeschreibung mutiert zum Alt-Text, ja guck mal einer an! Und glauben sie aber nicht, dass man die img-Attribute jetzt auch im Mediamanager sehen k\u00f6nnte, da sind sie n\u00e4mlich nicht drin. Man kann zwar beim Einf\u00fcgen eines Bildes aus der Mediathek ebenfalls Bildattribute angeben:<\/p>\n<div id=\"attachment_837\" style=\"width: 818px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-837\" decoding=\"async\" loading=\"lazy\" class=\"size-full wp-image-837\" src=\"http:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/mediam.jpg\" alt=\"mediam\" width=\"808\" height=\"582\" srcset=\"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/mediam.jpg 808w, https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/mediam-300x216.jpg 300w, https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/mediam-768x553.jpg 768w, https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/mediam-624x449.jpg 624w\" sizes=\"(max-width: 808px) 100vw, 808px\" \/><p id=\"caption-attachment-837\" class=\"wp-caption-text\">mediam<\/p><\/div>\n<p>Aber da kommt &#8211; \u00dcberraschung! &#8211; noch was anderes dabei raus:<\/p>\n<p><em>&lt;figure&gt;&lt;img title=&#8220;Mediam Titel&#8220; src=&#8220;images\/Johannisbeeren.jpg&#8220; alt=&#8220;Mediam Beschreibung&#8220; \/&gt;<\/em><br \/>\n<em>&lt;figcaption&gt;Mediam Beschriftung&lt;\/figcaption&gt;&lt;\/figure&gt;<\/em><\/p>\n<p>Ach! Wobei die figcaption dann tats\u00e4chlich unter dem eingef\u00fcgten Bild angezeigt wird:<\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-838\" src=\"http:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/mediam_beschriftung.jpg\" alt=\"mediam_beschriftung\" width=\"501\" height=\"542\" srcset=\"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/mediam_beschriftung.jpg 501w, https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/mediam_beschriftung-277x300.jpg 277w\" sizes=\"(max-width: 501px) 100vw, 501px\" \/><\/p>\n<p>Alles klar soweit? Glauben sie aber nicht, dass sie das alles auch im Kontextmen\u00fc des Bildes wiederfinden, da sieht nat\u00fcrlich aus wie gehabt, die Beschriftung taucht hier nicht auf:<\/p>\n<div id=\"attachment_840\" style=\"width: 551px\" class=\"wp-caption alignnone\"><img aria-describedby=\"caption-attachment-840\" decoding=\"async\" loading=\"lazy\" class=\"size-full wp-image-840\" src=\"http:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/mediam_kontextmenu.jpg\" alt=\"mediam_kontextmenu\" width=\"541\" height=\"323\" srcset=\"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/mediam_kontextmenu.jpg 541w, https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-content\/uploads\/2018\/02\/mediam_kontextmenu-300x179.jpg 300w\" sizes=\"(max-width: 541px) 100vw, 541px\" \/><p id=\"caption-attachment-840\" class=\"wp-caption-text\">mediam_kontextmenu<\/p><\/div>\n<p>Ich glaube, ich habe jetzt f\u00fcr einen Beitrag genug Verwirrung gestiftet, wir lassen das jetzt alles mal ein wenig einwirken. Zusammenfassend sei gesagt, dass das Ratespiel um vern\u00fcnftige Alt-Texte und Bildattribute in Joomla noch schlechter zu durchblicken ist als in WordPress, und das will schon was heissen!<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Man hat in Joomla prinzipiell drei M\u00f6glichkeiten, Bilder in einen Artikel einzuf\u00fcgen. Einmal als Inline-Element im Beitragseditor, wie wir das auch von WordPress her kennen. Dann gibt es noch das Einleitungsbild, entspricht in etwa dem Artikelbild in WordPress und wird in der Blogansicht \u00fcber dem Artikel dargestellt. Und schliesslich noch das komplette Beitragsbild, das wie [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[39],"tags":[],"_links":{"self":[{"href":"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-json\/wp\/v2\/posts\/831"}],"collection":[{"href":"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-json\/wp\/v2\/comments?post=831"}],"version-history":[{"count":7,"href":"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-json\/wp\/v2\/posts\/831\/revisions"}],"predecessor-version":[{"id":842,"href":"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-json\/wp\/v2\/posts\/831\/revisions\/842"}],"wp:attachment":[{"href":"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-json\/wp\/v2\/media?parent=831"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-json\/wp\/v2\/categories?post=831"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/evileu.de\/zum-schwarzen-pinguin\/wp-json\/wp\/v2\/tags?post=831"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}