MyBB.de Forum
Klickbare Vorschau von Bildern bei Anhängen - Druckversion

+- MyBB.de Forum (https://www.mybb.de/forum)
+-- Forum: Anpassungen (https://www.mybb.de/forum/forum-47.html)
+--- Forum: Theme-Diskussionen (https://www.mybb.de/forum/forum-84.html)
+--- Thema: Klickbare Vorschau von Bildern bei Anhängen (/thread-36959.html)

Klickbare Vorschau von Bildern bei Anhängen - skrilaxrev - 21.01.2020

Wenn Bilder an einen Beitrag angehangen werden, sollen sie als verkleinerte Vorschau dargestellt werden und klickbar sein.

Die Verkleinerung funktioniert wunderbar, da ich an das Fieldset des Templates postbit_attachments folgende Klasse angehangen habe, sowie das Image in postbit_attachments_images_image die zweite Klasse, und folgenden Code in der CSS:

Code:
fieldset.attachedimg img.attachment {
width: 150px;
}

Nun zu meinem Problem, wenn ich im Template postbit_attachments_images_image den Code von

Code:
<img class="attachment" src="attachment.php?aid={$attachment['aid']}" title="{$attachdate}" />

zu

Code:
<a href="attachment.php?aid={$attachment['aid']}"><img class="attachment" src="attachment.php?aid={$attachment['aid']}" title="{$attachdate}" /></a>

ändere...

...dann ändert sich das auch für alle in den Beiträgen eingefügten Anhängen.

Verlinkt dort jemand ein Bild mittels BB-Code, dann sieht der Code so aus:

Code:
<a href="WebseitenURL"></a>
  <a href="AttachmentURL">
    <img src="AttachmentURL" />
  </a>

Statt so:

Code:
<a href="WebseitenURL">
  <a href="AttachmentURL">
    <img src="AttachmentURL" />
  </a>
</a>

Das ist problematisch, weil Nutzer die Bilder mit Webseiten verlinken, aber stattdessen das Bild geladen wird.

Ich nehme an, es gibt kein extra Template für die Images im Anhang-Fieldset.

Fällt jemanden hierfür ein Workaround ein, um die angehangten Bilder mit sich selbst zu verlinken, wenn sie nicht in den Beitrag eingefügt sind? (Und wenn sie in den Beitrag eingefügt sind, dann nicht.)
Habe es wie folgt per CSS gelöst:

HTML-Code im postbit_attachments_images_image Template

Code:
<img class="clickoff attachment" src="attachment.php?aid={$attachment['aid']}" title="{$attachdate}" />
<div class="clickon"><a href="attachment.php?aid={$attachment['aid']}"><img class="attachment" src="attachment.php?aid={$attachment['aid']}" title="{$attachdate}" /></a></div>

CSS-Code:

Code:
fieldset.attachedimg img.attachment {
    width: 150px;
}
.clickon {
    display: none;
}
.clickoff {
    display: inline-block;
}
fieldset.attachedimg .clickon {
    display: inline-block;
}
fieldset.attachedimg .clickoff {
    display: none;
}
Bei meiner Variante muss noch die Klasse zum Fieldset des Postbits hinzugefügt werden:

Code:
<fieldset class="attachedimg">

Template: postbit_attachments

Tada, angehängte Bilder, die nicht in den Beitrag eingefügt werden, sind als verkleinerte Vorschau klickbar.

Hoffe, das hilft jemanden, der das auch möchte.
@Moderation: Würde den Titel noch umbenennen in "Klickbare Vorschau von Bildern bei Anhängen"