Thumbnail generation & markdown rendering issue に関連する問題です
Discourse が画像をダウンロードし、HTML を Markdown 構文に置き換えると、私たちの環境では以下のようになります：
[...]<a href="<link_here>" target="_blank"></a>[...]
この場合、Discourse は画像をレンダリングできません。
この問題を修正するには、少なくとも上記に空行を挿入する必要があります：
[...]<a href="<link_here>" target="_blank">
</a>[...]
HTML で囲まれた Markdown 画像のレンダリングを許可することは可能でしょうか？
メタでこれを試してみましょう。この画像をリンク内にホットリンクしています。
<a href="https://discourse.org"><img src="..."/></a>
画像が読み込まれたときにどうなるか見てみましょう…
@Arkshine、それはうまくいったようですね。<a href="https://discourse.org"></a> が正常にレンダリングされています。
リンクを取り巻く HTML 構造について、もう少し共有していただけますか？
<div data-wp><a href="https://www.mooki.co.il/gaming/hbilvt-giiming-mwtlmvt/mvwb-giiming-khvl-sparkfox-wvlhn-giiming-mqcvei-lumi-whvr-2" target="_blank"></a><div><div data-buy><a href="https://www.mooki.co.il/gaming/hbilvt-giiming-mwtlmvt/mvwb-giiming-khvl-sparkfox-wvlhn-giiming-mqcvei-lumi-whvr-2" target="_blank">購入</a><span data-clipboard-text="GLA679" data-coupon>GLA679</span><i></i></div><div data-price>₪679 <span data-old-price>₪1378</span></div></div></div><hr /><p><small> 公開元: <a href="https://zuzu.deals/%d7%91%d7%9c%d7%a2%d7%93%d7%99-%d7%95%d7%91%d7%9e%d7%97%d7%99%d7%a8-%d7%97%d7%98%d7%99%d7%a4%d7%94-%d7%9e%d7%95%d7%a9%d7%91-%d7%92%d7%99%d7%99%d7%9e%d7%99%d7%a0%d7%92-%d7%90%d7%93%d7%95%d7%9d-spark/"></a></small></p><br /><p></p>
<p style="text-align: center;">ゲーマーの方でも、一日中座って作業をしていて腰が悲鳴を上げている方でも、これはもう絶好のチャンス！限定の破格の価格で提供します！<br />
高級ゲーマーチェア、ゲーマーヘッドセット、そして送料無料！公式輸入元保証付き——わずか679₪！！！</p>
<p style="text-align: center;">レジで専用クーポンコード <strong>GLA679</strong> をお忘れなく！</p>
<div> </div>
<div>
<h3 style="text-align: center;">プロ仕様ゲーマーチェア SPARKFOX GC60P</h3>
</div>
<div>パソコンゲーム用に特別に設計されたゲーマーチェアで、ユーザーに最大限の快適さを提供します</div>
<div>
<ul>
<li>高背もたれ付きチェア</li>
<li>長時間のゲームプレイでも最高の快適さ</li>
<li>首と腰をサポートするクッション2個付き</li>
<li>素材：成型フォーム</li>
<li>フレーム素材：金属</li>
<li>表面素材：カーボンファイバー配合レザー</li>
<li>アームレスト：上下調節可能</li>
<li>メカニズムタイプ：バタフライ式</li>
<li>昇降機構：Class4 ハイドロリック</li>
<li>背もたれ角度範囲：90°-180°</li>
<li>ベース素材：ナイロン</li>
<li>車輪素材：ナイロン</li>
<li>耐荷重：最大150kg</li>
<li>保証期間：1年</li>
</ul>
<div><strong>サイズ</strong></div>
<div>
<ul>
<li>幅：67cm</li>
<li>奥行き：67cm</li>
<li>可変高さ：124-132cm</li>
</ul>
<h3></h3>
<p></p>
<h3 style="text-align: center;">ゲーマーヘッドセット SPARKFOX K1</h3>
<div>音質と通話、ノイズキャンセリングに特化した特別デザインゲーマーヘッドセット</div>
<div>
<ul>
<li>市販のほぼすべてのゲームコンソールに対応</li>
<li>スマートフォンやノートパソコンでの音声・通話対応</li>
<li>音量調整ダイヤルはヘッドセットケーブルに搭載で操作しやすい</li>
<li>50mm大型ドライバーによる高音質再生</li>
<li>音量調整・ミュートボタン搭載</li>
<li>大型パッド付きイヤーカップで最大限の快適さ</li>
<li>ヘッドバンドは調節可能で頭に完璧にフィット</li>
<li>3.5mmジャックに直接接続可能</li>
</ul>
</div>
<div>デスクトップPC用の3.5mmスプリッター（1入力→2出力）変換アダプター付属</div>
</div>
</div>
<p> </p>
<div data-custom-html=""></div>
<div data-wp>
<a href="https://www.mooki.co.il/gaming/hbilvt-giiming-mwtlmvt/mvwb-giiming-khvl-sparkfox-wvlhn-giiming-mqcvei-lumi-whvr-2" target="_blank"></a>
<div>
<div data-buy>
<a href="https://www.mooki.co.il/gaming/hbilvt-giiming-mwtlmvt/mvwb-giiming-khvl-sparkfox-wvlhn-giiming-mqcvei-lumi-whvr-2" target="_blank">購入</a>
<span data-clipboard-text="GLA679" data-coupon>GLA679</span><i></i>
</div>
<div data-price>₪679 <span data-old-price>₪1378</span></div>
</div>
</div>
<hr />
<p>
<small> 公開元: <a href="https://zuzu.deals/%d7%91%d7%9c%d7%a2%d7%93%d7%99-%d7%95%d7%91%d7%9e%d7%97%d7%99%d7%a8-%d7%97%d7%98%d7%99%d7%a4%d7%94-%d7%9e%d7%95%d7%a9%d7%91-%d7%92%d7%99%d7%99%d7%9e%d7%99%d7%a0%d7%92-%d7%90%d7%93%d7%95%d7%9d-spark/"></a></small>
</p>
<br />
<p></p>
<p style="text-align: center;">
ゲーマーの方でも、一日中座って作業をしていて腰が悲鳴を上げている方でも、これはもう絶好のチャンス！限定の破格の価格で提供します！<br />
高級ゲーマーチェア、ゲーマーヘッドセット、そして送料無料！公式輸入元保証付き——わずか679₪！！！
</p>
<p style="text-align: center;">レジで専用クーポンコード <strong>GLA679</strong> をお忘れなく！</p>
<div></div>
<div>
<h3 style="text-align: center;">プロ仕様ゲーマーチェア SPARKFOX GC60P</h3>
</div>
<div>パソコンゲーム用に特別に設計されたゲーマーチェアで、ユーザーに最大限の快適さを提供します</div>
<div>
<ul>
<li>高背もたれ付きチェア</li>
<li>長時間のゲームプレイでも最高の快適さ</li>
<li>首と腰をサポートするクッション2個付き</li>
<li>素材：成型フォーム</li>
<li>フレーム素材：金属</li>
<li>表面素材：カーボンファイバー配合レザー</li>
<li>アームレスト：上下調節可能</li>
<li>メカニズムタイプ：バタフライ式</li>
<li>昇降機構：Class4 ハイドロリック</li>
<li>背もたれ角度範囲：90°-180°</li>
<li>ベース素材：ナイロン</li>
<li>車輪素材：ナイロン</li>
<li>耐荷重：最大150kg</li>
<li>保証期間：1年</li>
</ul>
<div><strong>サイズ</strong></div>
<div>
<ul>
<li>幅：67cm</li>
<li>奥行き：67cm</li>
<li>可変高さ：124-132cm</li>
</ul>
<h3></h3>
<p></p>
<h3 style="text-align: center;">ゲーマーヘッドセット SPARKFOX K1</h3>
<div>音質と通話、ノイズキャンセリングに特化した特別デザインゲーマーヘッドセット</div>
<div>
<ul>
<li>市販のほぼすべてのゲームコンソールに対応</li>
<li>スマートフォンやノートパソコンでの音声・通話対応</li>
<li>音量調整ダイヤルはヘッドセットケーブルに搭載で操作しやすい</li>
<li>50mm大型ドライバーによる高音質再生</li>
<li>音量調整・ミュートボタン搭載</li>
<li>大型パッド付きイヤーカップで最大限の快適さ</li>
<li>ヘッドバンドは調節可能で頭に完璧にフィット</li>
<li>3.5mmジャックに直接接続可能</li>
</ul>
</div>
<div>デスクトップPC用の3.5mmスプリッター（1入力→2出力）変換アダプター付属</div>
</div>
</div>
<p> </p>
<div data-custom-html=""></div>
これは、ここで取り上げられている問題と同じものです: Images not publishing to Discourse in WP 5.3 - #6 by simon
なるほど！@simon さん、WordPress プラグインのアップグレードは古い投稿も修正するのでしょうか？それとも新しい投稿のみですか？
この修正は、WordPress ブロックエディターで公開された投稿にのみ適用されます。WordPress 上で「Discourse トピックを更新」ボタンをクリックすれば、古い投稿も修正されます。ただし、古い投稿をすべて修正するには、スクリプトを作成してループ処理を行うか、手動で各投稿に対して行う必要があります。
この HTML を試してみましょう：
<p><img src="..."/></p>
これは WordPress 統合以外の投稿が行われた場合にも備え、Discourse 側でも修正すべきだと考えます。要約すると以下の通りです：
<p><img src="..."/></p>を投稿しました。これは完全に有効な HTML です
pull_hotlinked_images が画像を取得し、マークアップを <p></p> に置き換えました
これがレンダリングされません
したがって、ここでは 2 つの修正オプションがあります。
<p>
</p>
または
<p></p> をレンダリングできるように修正する。なお、これは commonmark デモでもレンダリングされません。@sam マークダウン画像が <p> と同じ行ではレンダリングされない意図的な理由をご存じでしょうか？
これは CommonMark 仕様の一部です。
**test**
<p>**test**</p>
ここでは仕様から逸脱したくありません。おそらく、このようなケースに対応するため、外部リンク画像のプル時に 2 つの改行を注入することで修正できるでしょう。ただし、これはかなり稀なケースであり、ある意味で自己責任によるものです。
それほど珍しいことではないと思います。特に Discourse が WP-Discourse や API を利用するその他のツールなどの人気のあるツールと連携している場合です。
空行を追加することを検討してください。これは破壊的な変更にはならないと思われますし、実装も比較的容易です。
@Arkshine 社内でこの件について何度も議論してきました。私たちにとって重要なのはコンテンツの整合性を保つことです。そのため、改行を解決する案は実現しない可能性が高いです。
しかし、何らかの対応は必ず行います。pull_hotlinked_images ジョブが画像を破棄するのは許容できません。近々解決策を発表できることを願っています 
この問題の回避策として、Discourse がリモート画像をダウンロードしないように設定できます。これを行うには、disabled image download domains サイト設定に画像ドメインを追加します。また、download remote images to local サイト設定を無効にすることで、Discourse がすべてのリモート画像をダウンロードしないようにすることも可能です。詳細については、Fix broken images for posts created by the WP Discourse and RSS plugins をご覧ください。
私たちの場合、公式のトピックサムネイルコンポーネントを使用しているため、ローカル画像が必要となり、それができません。WP-Discourse でトピックを作成する前に、コンテンツ内のすべての<img> タグの前に改行を追加することで、この問題を解決しました。全員にとっての解決策ではありませんが、私たちの場合は機能しています。Discourse がこの合法な使用法をサポートしていないのは少し残念です。
ただし、プラグインやコンポーネントに縛られていない場合、またはトピック作成前にコンテンツを修正できない場合は、確かに合理的な回避策と言えます。
引き続き、この問題の修正を計画しています。残念ながら、これは当社のマークダウンレンダリングシステムに深く潜む問題であり、修正には複雑な作業が必要です。しかし、必ず対応いたします。お待たせしてしまい、申し訳ございません。
Discourse RSS プラグインを介して作成された画像を含む投稿にも同様の問題が発生することについて、ここに追記します。
このトピックでの複数回の投稿にお詫び申し上げますが、この問題は「Zendesk からコメントを同期する」設定が有効な場合、Zendesk プラグインを通じて作成された投稿内の画像にも影響を及ぼします。このケースの難しい点は、画像のソースを事前に特定できないため、「無効化する画像ダウンロードドメイン」設定に画像の src を追加するという回避策が機能しないことです。
もし画像タグが HTML タグで囲まれている場合、リモート画像をローカルにダウンロードしないように防止することは可能でしょうか？
残念ながら、それは完全に不可能です。もしそのような処理を行えば、サードパーティが追跡用GIFを注入することでフォーラム上の利用状況を追跡できてしまいます。リモート画像のダウンロード機能はセキュリティ機能の一部なのです。
その代わり、@tgxworld が数年前に構築した画像リマッパーと同様に、HTML から逆方向に動作し、再調理（re-cooking）によって変更の安定性を確保する「より賢い」システムが必要だと考えます。残念ながら、これは非常に複雑な変更となります。
この問題は再び発生しました
単なる思いつきですが、ここで難しい問題（つまり、HTML から Markdown への変換）を回避できないか考えてみます。整理のために要点をまとめます。
Discourse は、投稿コンテンツの作成に HTML のインポートをサポートしています（例：WP Discourse からの HTML）。
一部のコンテキストでは、ユーザーは元の HTML の整合性が完全に保たれることを期待します。
ここでの「整合性」には少なくとも以下の 2 つの側面があります。
HTML から Markdown への変換は、最初の種類の整合性に問題を生じさせる可能性がありますが、現在のところ 2 番目の種類の整合性を確保するために必要です。
したがって、特定のインポートされた投稿に対してこの問題に対処する方法の一つとして、インポートされた HTML をそのまま調理済み（cooked）の投稿コンテンツとして保存し、pull_hotlinked_images ジョブが、img タグを Markdown に変換することなく、そのようなコンテンツ内の画像をダウンロードできるようにするというアプローチが考えられます。
より簡潔に言えば、コードは img タグを Markdown に変換することを要求せずに、ホットリンクされた画像をダウンロードできるようにするかもしれません。そのような投稿の場合、調理済みコンテンツにダウンロードした画像の URL を生コンテンツの代わりに補間します。
難しい点は、そのフラグがついた投稿をどのように編集するかです。エディタが raw HTML モードになり、ツールバー全体が機能しなくなったりします。