Einführung von Bildgittern in Beiträgen

[pfaffman (Jay Pfaffman)]

Vielleicht ein Composer-Tool, bei dem Sie die Bilder auswählen könnten und es würde den Tag davor und danach einfügen?

[merefield (Robert)]

@Samantha_O

Ein letztes mögliches zukünftiges Feature wäre die Möglichkeit, ein bestimmtes Bild auszuwählen, das im Raster „hervorgehoben“ oder als besonderes Bild dargestellt wird, sodass es größer als andere erscheint oder auf irgendeine Weise hervorsticht.

Sie könnten so etwas tun:

.d-image-grid:hover {
  img {
    -webkit-filter: brightness(60%);
    transition: 0.5s;
  }
}

.d-image-grid:not([data-disabled]) .d-image-grid-column img, .d-image-grid:not([data-disabled]) .d-image-grid-column>.lightbox-wrapper, .d-image-grid:not([data-disabled]) .d-image-grid-column>.lightbox-wrapper>.lightbox {
  &:hover {
    img {
     -webkit-filter: brightness(100%);
     transition: 0.5s;
    }
    transition: 0.5s;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  }
}

[rahim123]

@pmusaraj

(Das heißt, das Einfügen einer URL zu einem Bild und das Einbetten in [grid]-Tags funktioniert auch im Composer nicht.)

[grid]
![](upload://jpg9rB3SiEPxoiEDzUQEfpqdyjC.jpeg)
![](upload://8af8gZpoBRQh1Lf7j8YsQHFWnFw.jpeg)
![](upload://nx1DA9CM5uUxhkR81asxo6Zzm5x.jpeg)
[/grid]

Hm, es wäre schön, wenn das funktionieren würde. Ich ermutige Benutzer, auf ihre extern gehosteten Bilder zu verlinken, und ich habe das Herunterladen von Hotlink-Bildern deaktiviert, um Speicherplatz zu sparen.

Die folgende Alternative könnte funktionieren, aber die meisten Benutzer wissen nicht, wie sie sie in Markdown formatieren sollen (sie sind es gewohnt, die Bild-URL einfach auf einer eigenen Zeile einzufügen):

[grid]
![](upload://jpg9rB3SiEPxoiEDzUQEfpqdyjC.jpeg)
![](upload://8af8gZpoBRQh1Lf7j8YsQHFWnFw.jpeg)
![](upload://nx1DA9CM5uUxhkR81asxo6Zzm5x.jpeg)
[/grid]

Hier ist eine noch komplexere Methode, um die externen Bilder anklickbar zu machen, um die Vollbildversion anzuzeigen:

[grid]
[![](upload://jpg9rB3SiEPxoiEDzUQEfpqdyjC.jpeg "")](https://github.com/KDE/plasma-workspace-wallpapers/blob/master/IceCold/contents/images/5120x2880.png?raw=true)
[![](upload://8af8gZpoBRQh1Lf7j8YsQHFWnFw.jpeg "")](https://getwallpapers.com/wallpaper/full/b/5/f/563687.jpg)
[![](upload://nx1DA9CM5uUxhkR81asxo6Zzm5x.jpeg "")](https://www.pixelstalk.net/wp-content/uploads/2016/06/Download-hd-nature-wallpaper.jpg)
[/grid]

Bearbeiten: Ich habe ursprünglich URLs zu externen Bildern verwendet, aber Discourse ersetzt Text sogar innerhalb von Codeblöcken durch den Link zum heruntergeladenen Hotlink, was wie ein Fehler erscheint. Es sollte niemals den Inhalt eines monospaced Codeblocks beeinträchtigen.

[Paracelsus]

Großartige neue Funktion … Ein Benutzer fragte, ob es eine Art Markup-Spickzettel gibt, der den Leuten hilft, sich an diese manuellen Verfahren zu erinnern, ähnlich dem Dialogfeld für Tastenkombinationen, das mit dem Tastaturikone verbunden ist.

[Lilly (Lillian Louis)]

Ich habe gerade eine Theme-Komponente erstellt, die Bildausrichtung und Grid-Buttons zur Composer-Symbolleiste hinzufügt

Image Alignment and Grid

Summary Adds image grid and alignment buttons to composer toolbar Repository https://github.com/Lillinator/image-alignment Install Guide How to install a theme or theme component New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component This theme component inserts buttons on the post composer toolbar to align uploaded images with text left or right, in center of post, …

[hello-smile6 (9pfs)]

@rahim123

Discourse ersetzt Text sogar innerhalb von Codeblöcken durch den Link zu dem heruntergeladenen Hotlink, was sich wie ein Fehler anfühlt. Es sollte niemals den Inhalt eines Monospace-Codeblocks beeinträchtigen.

Das klingt definitiv nach einem Fehler!

[thoka (Thomas Kalka)]

Schön. Leider weder per E-Mail noch auf veröffentlichten Seiten verfügbar.

[rahim123]

@hello-smile6

@rahim123

Discourse ersetzt Text sogar innerhalb von Codeblöcken mit dem Link zum heruntergeladenen Hotlink, was sich wie ein Fehler anfühlt. Es sollte niemals den Inhalt eines Monospace-Codeblocks beeinträchtigen.

Das klingt definitiv nach einem Fehler!

Ja, ich habe einen separaten Fehlerbericht eingereicht:

Code block image link gets modified when hotlinked image is downloaded

It happens when using the  Markdown convention in a code block and then using the same code outside of the code block to actually display the image. It happens after about 5 minutes once Discourse downloads the hotlinked image.  [image] Original: [image]

[Canapin (Coin-coin le Canapin)]

Ja, veröffentlichte Seiten haben nur sehr eingeschränkten Zugriff auf Discourse-Funktionen. Selbst normale Lightboxen funktionieren darauf nicht. Ein Klick auf ein Bild öffnet direkt die URL, anstatt die Bildanzeige anzuzeigen.

[cogdog (Alan Levine)]

Das funktioniert elegant! Ich habe gerade eine Demo gemacht

Grids of Images

Wenn es überhaupt zählt, würde ich für die Funktionen der Image Alignment/.grid Buttons Theme Component stimmen.
Wenn es eine Funktion für Bilder gäbe, die ich gerne hätte, wäre es eine Möglichkeit, eine Bildunterschrift hinzuzufügen. In unserer Community setze ich mich für die Nennung von Bildern ein, was keine gute Verwendung der Bildbeschreibung ist.

[jrgong]

@Penar Musaraj

Ja, aber nicht ohne [grid]-Tags. Das automatische Konvertieren von Bildern in ein Raster ohne Tags würde gegen die CommonMark-Spezifikation verstoßen. Wir möchten dies unbedingt vermeiden. (In meinem ersten internen Entwurf dieser Funktion habe ich mit einem automatischen Raster begonnen.)

Wie wäre es, es zumindest als optionale Funktion in den Kerneinstellungen hinzuzufügen, einschließlich einer ausdrücklichen Warnung? Auf diese Weise können Forenadministratoren diese Entscheidung treffen, wenn sie dies wünschen, und wissen, dass sie gegen die CommonMark-Spezifikation verstoßen.

Viele Grüße
Jr

[pmusaraj (Penar Musaraj)]

Ich verstehe Ihren Wunsch hier (ich habe denselben Wunsch, ich würde es lieben, wenn mehrere hochgeladene Fotos automatisch in einem Raster wären, ohne dass der Benutzer etwas tun muss), aber aus Wartungssicht ist diese Opt-in-Option nicht haltbar. Wir betreiben Tausende von Discourse-Instanzen, und wenn die gleiche Markierung sich in einigen Instanzen anders verhält als in anderen, kann dies zu allerlei Kopfschmerzen führen. Es ist leider nicht wartbar.

@pmusaraj

…wir könnten automatisch die [grid]-Wrapper zu Uploads mehrerer Bilder hinzufügen, wahrscheinlich 3+ Uploads.

Dies ist unser bester Ansatz für den nächsten Schritt. (Ich bin mir nicht sicher, wann es passieren wird, aber Beiträge hier sind sicherlich willkommen, wenn jemand es angehen möchte.)

[huynhthai824 (Sora &\)]

Ich führe diesen Code aus

posts = Post.where(‘raw LIKE ?’, ‘%

data-theme-slick=“1”%>’)
posts.each do |p|
p.update!(raw: p.raw.gsub(/

data-theme-slick=“1”>(.*?)</div>/m, ‘[grid]\1[/grid]’))
p.rebake!
end

aber erhalte einen Fehler

Ich habe das Symbol (’ gelöscht und erneut eingegeben, aber es war nicht erfolgreich.
Können Sie den Fehler finden?
Danke!

[Arkshine]

Hallo Sora, Sie müssen zuerst die Rails-Konsole eingeben: rails c

[huynhthai824 (Sora &\)]

Können wir standardmäßig alle Bilder so einrichten, dass sie automatisch in einem schönen Raster angeordnet werden?

[packman (Chris McMahon)]

Ich weiß nicht, ob dies das beabsichtigte Verhalten ist, aber wenn Sie Bilder zu einem Raster hinzufügen, die unter den Einstellungen für die maximale Bildbreite/-höhe des Lightbox-Fensters liegen, werden sie in reduzierter Größe angezeigt, aber ohne Möglichkeit (*), sie auf ihre ursprüngliche Größe zu erweitern.

Zum Beispiel habe ich ein Raster mit 11 hochgeladenen Bildern erstellt. Acht davon waren 640x480, also unter der Standard-Bildbreite/-höhe für Lightboxing von 690x500, und die anderen drei waren 1200x372, 750x521 und 750x509. Die letzten drei wurden per Lightbox angezeigt (class=lightbox-wrapper). Die ersten acht hatten die class=image-wrapper, sodass sie nur etwa 300x250 angezeigt wurden und nicht erweitert werden konnten, um sie in ihrer ursprünglichen größeren Größe zu sehen.

(*) Dieses Verhalten kann geändert werden, indem die Einstellungen für die maximale Bildbreite/-höhe reduziert werden, aber das wirkt sich dann auf alle anderen Bilder im Forum aus.

Ich denke, es wäre besser, wenn alle Bilder in einem Raster automatisch per Lightbox angezeigt würden oder alternativ andere Einstellungen als die Haupt-Lightbox-Einstellungen hätten.

[Richie (Richie Rich)]

@thoka

Schön. Leider weder per E-Mail verfügbar

Gibt es Pläne, Bilder in Grids auch in E-Mails zu replizieren?

[pmusaraj (Penar Musaraj)]

Derzeit nicht, nein. Um ganz ehrlich zu sein, ist CSS in E-Mails immer noch ein großes Problem. E-Mail-Clients unterscheiden sich stark voneinander, und es ist extrem schwierig, etwas Konsistentes gerendert zu bekommen.

[Richie (Richie Rich)]

Vollständig verstanden, danke für die Bestätigung

[thoka (Thomas Kalka)]

Hässlich, aber könnte funktionieren: Senden Sie nur ein zusammengesetztes Bild für ein Raster.

Für ein verbessertes Nutzererlebnis könnte es mit dem entsprechenden Raster auf der Live-Seite verlinkt werden.