Page 2 of 2

Re: Bildzeilen

Posted: Thu May 13, 2021 3:27 pm
by deondo
Hallo Edi,

vielen Dank. Aber wenn's so einfach wäre, hätte ich sicher nicht nachgefragt. Leider kann ich nicht einfach unter ein eingefügtes Bild einen Text setzen.
Aber ich schließe auch nicht aus, dass ich zu doof dafür bin, den Weg zu erkennen. Hast du bitte mal einen Link zu einem Beispiel?
Danke.

Re: Bildzeilen

Posted: Fri May 14, 2021 6:33 pm
by johannesh19
Ich glaube, ihr redet einfach aneinander vorbei. Was deondo haben will, ist eine Bildunterschrift, wie sie in Zeitungen und z. B. Fachbüchern üblich ist. Natürlich gibt es die Möglichkeit (wie Edi korrekt beschreibt), ein Bild einzufügen und direkt danach die Bildunterschrift als Textzeile im Text-Inhalt der Seite. Aber so wirklich elegant ist das nicht. Und als Journalist ist deondo auch gewohnt, dass Bilder und Texte beim Satz manchmal an verschiedenen Stellen landen können.

Es gibt tatsächlich ein HTML-5-Element, das die gesuchte Funktion genau abbildet: <figure> https://developer.mozilla.org/en-US/doc ... ent/figure. <figure> beinhaltet das Bild und die dazugehörige Bildunterschrift als eine logische Einheit:

Code: Select all

<figure>
  <img src="bilddatei.png">
  <figcaption>Bilduntertitel</figcaption>
</figure>
Damit hat man dann auch eine semantisch korrekte Auszeichnung.

Re: Bildzeilen

Posted: Fri May 14, 2021 11:53 pm
by deondo
johannesh19 wrote: Fri May 14, 2021 6:33 pm Ich glaube, ihr redet einfach aneinander vorbei. Was deondo haben will, ist eine Bildunterschrift, wie sie in Zeitungen und z. B. Fachbüchern üblich ist. Natürlich gibt es die Möglichkeit (wie Edi korrekt beschreibt), ein Bild einzufügen und direkt danach die Bildunterschrift als Textzeile im Text-Inhalt der Seite. Aber so wirklich elegant ist das nicht. Und als Journalist ist deondo auch gewohnt, dass Bilder und Texte beim Satz manchmal an verschiedenen Stellen landen können.

Es gibt tatsächlich ein HTML-5-Element, das die gesuchte Funktion genau abbildet: <figure> https://developer.mozilla.org/en-US/doc ... ent/figure. <figure> beinhaltet das Bild und die dazugehörige Bildunterschrift als eine logische Einheit:

Code: Select all

<figure>
  <img src="bilddatei.png">
  <figcaption>Bilduntertitel</figcaption>
</figure>
Damit hat man dann auch eine semantisch korrekte Auszeichnung.
Danke, Johannes. Ich glaube, das ist es.
Gruß und schönes Wochenende.

Re: Bildzeilen

Posted: Mon May 17, 2021 10:33 am
by Edi
johannesh19 wrote: Fri May 14, 2021 6:33 pm

Code: Select all

<figure>
  <img src="bilddatei.png">
  <figcaption>Bilduntertitel</figcaption>
</figure>
Damit hat man dann auch eine semantisch korrekte Auszeichnung.
Das stimmt.

Nur wurde halt gewarnt:
Ich bin kein Mensch, der sich mit dem Teufelswerk von Programmiersprachen auskennt, der weiß, wo ich welchen Schnipsel Code einzufügen habe, damit das herauskommt, was ich mir wünsche.
Anyway, für diese Elemente könnte auch der Editor TinyMCE verwendet werden. Allerdings müsste dazu der Code leicht verändert werden.

In der Datei plugin.php im Verzeichnis /bl-plugins/tinymce müsste dazu im Abschnitt ab Zeile 95 folgendes hinzugefügt werden:

Code: Select all

image_caption: true
Der Abschnitt würde dann so aussehen:

Code: Select all

tinymce.init({
   selector: "#jseditor",
   auto_focus: "jseditor",
   element_format : "html",
   entity_encoding : "raw",
   skin: "oxide",
   schema: "html5",
   statusbar: false,
   menubar:false,
   branding: false,
   browser_spellcheck: true,
   pagebreak_separator: PAGE_BREAK,
   paste_as_text: true,
   remove_script_host: false,
   convert_urls: true,
   relative_urls: false,
   valid_elements: "*[*]",
   cache_suffix: "?version=$version",
   $document_base_url
   plugins: ["$plugins"],
   toolbar1: "$toolbar1",
   toolbar2: "$toolbar2",
   language: "$lang",
   content_css: "$content_css",
   image_caption: true
});