Bilder und Icons unterschiedlich plazieren per CSS

[webeditor]

Servus!

Hallo zusammen,

ich stehe hier vor einem kleinen Problem und habe nicht wirklich eine Idee zu einem Lösungsansatz 🙁.

Rahmenbedingungen: Etliche Leute sollen Beiträge für eine interne Informationsseite schreiben. Die Texte kommen in Markdown daher (schon das ist problematisch genug, den Leuten beizubiegen ...).

Für schwierigeres Layout kannst du im Hugo auch HTML-Markup verwenden!

• https://gohugo.io/content-management/formats/

Was ich kann, das steht leider nicht zur Debatte :( Ich bin schon froh, wenn die Mitstreiter sich auf markdown mit einem WYSIWIG-Editor einlassen und nicht blind ein Wordpress installieren ohne eine Idee, wie die bereits existierenden hunderte Seiten migriert werden können.

Schwierig wird's jetzt, weil in den Texten auch PDF-Dokumente verlinkt werden sollen. Der Transparenz wegen soll den verlinkten Titeln dieser Dokumente jeweils ein pdf-Icon vorangestellt werden.

Irgendwie hab ich keine Idee, wonach ich suchen muß ...

Du kannst in CSS alles selektieren und benötigst keine Klassen.

In diesem Tutorial erhalten zip und mp3-Dateien unterschiedliche Icons:

HTML/Tutorials/Links/Gestaltung_mit_CSS#Links_auf_unterschiedliche_Dokumenttypen_kennzeichnen

Da könntest du vor jeden Link, der auf .pdf endet, ein SVG-Icon tun und das würde nicht als Bild im Markdown, bzw. dann im HTML-Markup erscheinen.

Das ist wirklich ein guter Ansatz, allerdings nicht .pdf am Ende, sondern enthalten als Bedingung (gelegentlich könnte ein dateiname.pdf#page=12 oder sowas auftauchen).