Q&A
そういうオリジナルのもの作るしかないと思いますけど。
少なくとも私もそんな機能があるライブラリは見たことないですし需要がないんじゃないですかね。
Gatsby.jsでサイトを作成しています。
Markdownの文書の中で画像を横並びにしようと以下のようなコードを書きました。
markdown
1<div style='display: flex;'> 2 <div style='width: 50%;'> 3  4 </div> 5 <div style='width: 50%;'> 6  7 </div> 8</div>
ブラウザでページを見ると、がテキストとして表示されており、imgタグに変換されていませんでした。
Markdown ＞ html ＞ Markdown
のように入れ子にすることはできないのでしょうか？
Google等で検索したのですが
「Markdownの中ではHTMLタグが使えます」
みたいな情報ばかり出てきて、目的の情報を見つけられませんでした。
回答3件
3
html
1<pre> 2 test 3 <img src="/images/aaa.png"> 4</pre>
という記述が成立するので、codeブロック内の[](/images/aaa.png)も変換してあげれば、「入れ子」で表現することは可能です。
Markdown のライブラリに手を入れるか、出力直前で変換してあげることで実装するのが良いでしょう。
参考まで。
投稿2021/07/05 03:27
編集2021/07/05 03:30
退会済みユーザー
総合スコア0
3
大抵のマークダウン（のコード機能）ではそれができるようになっていません。
ご自身が確認された結果が全てです（teratailで採用されてるライブラリも同じ）。
主に「その中で書かれた文字列をインデント含めてそのまま表示する」機能ですしね。
そういう仕様です。やりたいことは「imgタグを書く」ことなのでしょうし、そのまま書いてください。
本体を改修すればできなくはないでしょうけど、茨の道となりそうです。
投稿2021/07/03 23:38
編集2021/07/05 00:52
総合スコア80400
回答へのコメント
できないんですね。
htmlの中で、{}で囲むとMarkdownとして認識される、みたいな機能があるんじゃないかと予想してたんですが……
そこはドキュメント確認してください。
https://www.gatsbyjs.com/docs
言ってしまえば「仕様」ですし、マークダウンのcodeは先に書いたようにあくまで「その中のテキストをインデントや改行含めてそのまま表示する」機能なので、中に別のマークダウンの機能があっても変換しないのが「仕様」と言えます。
なので、変換したいのでしたら自身で改修するしかありません。
htmlタグが使える=imgタグ使える
のですから普通にimgタグ使えば良いと思うのですけど。
その仕様が発見できなかったのでteratailで質問しています。
<img>タグを使えば画像が表示されることはもとより承知しております。
ドキュメントに書いてない
なら「できない」で良いのではと。
質問内容からはドキュメント確認した旨も仕様を確認しようとしたことも分かりませんでした。
自身がやりたいことはきっと出来るはずだ、という前提と思い込みが先行して「仕様を確認する」が抜け落ちているように見受けられます。
ドキュメントに書いていないのか、
書いてあるが自分が見つけられないだけなのか、
切り分けができないので。
ドキュメントを読んだかすらわかりませんでした。
質問本文には「Google等で検索した」としか書かれていません。
キーワードも、その結果かくにんした記事も提示されていませんので、他者には本当に調べたかどうかすら分かりませんよ。
それに本件「できない」で終わると思ってたのですが、終われない理由は何ですか？
m.ts10806様が、「たぶんできない」のような個人の予想を書いているだけで、仕様を把握した上で解答しているようには見えないので。
識者の方からの回答を待っている状態です。
では、回答修正しておきますね。マークダウンの仕様です。
ご自身で既に実際にやって結果出てるのでこれ以上求めても出ませんし、ドキュメント確認したくないための言い訳にされないほうが良いかと（コメントからそういうニュアンスに見えます）。
結局質問に何も追記されないなら、状況も変わりません。
矛盾が起きることにも気づいてほしいです。
マークダウンでコードを提示するということは、ブラウザに「htmlとして解析してほしい」ではなく、「コードをそのまま表示してほしい」ということ。
をマークダウンの機能に当ててしまうと画像の表示をしてしまいます。ユーザーにコードを見せたいのにimgタグとして解釈させるのは要件に反します。
なので、要件を満たすには内部は無変換とするしかありません。
「コードをそのまま表示する」という話のソースは？
あぁ、失礼。
マークダウンのcodeのみの話をしていました。
まあいずれにしてもどのように探したのか分かりませんが、自身の書いたコードと「Markdownの中ではHTMLタグが使えます」という結果が全てですね。htmlで書いてください。
もし、
自身がやりたいことはきっと出来るはずだ、という前提と思い込みが先行してなければ質問することなく済んでました。
今でもその思い込みは取れてないようですし…
なので回答に先に「本体を改修すればできなくもない」とも書いておいたのですが…
ライブラリやプラグインは利用者の理想すべてを満たしてくれる夢のツールではないですよ。
決まった機能を決まった分だけ提供してくれる道具です。
プラスαで望むなら自分でなんとかするしかないです。
できないならできないで別にいいんです。
普通にimgタグ書けばすむ話ですから。
ただ、ソースの提示もなく「～だと思います」という回答だったのが、
断定に書き換えられた挙句、結局ソースの提示はなしなのが気になっております。
「できない」ソースはどうやって提示すればいいんですか？
ご自身が書かれたコードがそもそものソースになっているのですけど。
それとも「ドキュメントとコード読むの面倒だから代わりに読んで確認してきて」という作業依頼でしょうか。
できることなら大抵ドキュメントに書いてあるだろうけど、できないことが全て書かれているわけではないので、できないことを証明するにはソースコードを読むくらいしかないと思いますが、そこまでしろということでしょうか？
ドキュメントに書いてないなら、恐らくできないだろうと推定できますが、それでは気に入らないんですよね？
「コードをそのまま表示しているだけである」というような回答を頂いたので、
その解答の根拠となっているドキュメントを教えて頂きたいです。
この場合の「識者」は作者以上に適任な人はいないので、これで納得できないのでしたら、無関係の赤の他人より作者にフィードバックすることを強くすすめます。うまく聞けば「そのような仕様になった理由」も教えてくれるかもしれません。
（私はそのまま使ってなんの不便もないし理由は「自分が作るなら」の目線で理解しているのでわざわざ聞きませんが）
結局はドキュメントとから推察されることしか我々には分かりません。
断定としたのは質問者が説明で納得しなかったため（あと元々誤解させてしまっていた様子なので）で
根拠は「質問者がすでに試して結果が出ていること」が半分
「そもそもマークダウンとは」の仕様を理解した上でがもう半分です。
ドキュメントのマークダウンの項を読んでみて分かることもあるはずですが、読んだ気配がないことをずっと疑問に感じています。
まずは「できること」として認識されている「htmlは使用できる」部分を探して提示してくださいね
> マークダウンのcodeのみの話をしていました。
これが通じていないということですか？
コードをそのまま表示せよという意味なので、それにソースを求める意味がわかりません。
もしかして
<code>
<div>
</div>
</code>
みたいな書き方をした場合の話をしてます？
<code>タグは使っていないです。
つまり、その時点では、話が食い違っていただけでしょう。
食い違いとわかっていつまでも引っ張ることではないと思います。
コードが一部しか提示されてないので致し方ないことですね。
そこに気づいて
2021/07/05 10:14
のコメントの冒頭で書いたのですけどまだ読まれてなかったんですね。残念。
最後まで自身の書いた質問に追記も修正されることもなく自己解決されてしまった。残念。
0
自己解決
Note that Markdown formatting syntax is not processed within block-level HTML tags. E.g., you can’t use Markdown-style emphasis inside an HTML block.
Markdownの開発者(JOHN GRUBER)のサイトの中で、
HTMLタグの中ではマークダウン記法は使えない旨が明記されていました。
https://daringfireball.net/projects/markdown/
できないことは証明できないみたいな話ではなく、初めからこのリンクをご紹介いただけていれば……
htmlとMarkdownの入れ子も実現できました。
<code> <div style='display: flex;'> <div style='width: 50%;'> </code>  <code> </div> <div style='width: 50%;'> </code>  <code> </div> </div> </code>
投稿2021/07/05 02:23
編集2021/07/05 02:36総合スコア59
2021/07/26 13:29こちらの質問が複数のユーザーから「過去の低評価」という指摘を受けました。
回答へのコメント
> 初めからこのリンクをご紹介いただけていれば……
初めからそれをみつけていれば良かっただけですね。
「読め」「調べろ」は繰り返し言われています。
最初からその通りにすれば早かったでしょう。
なぜか回答者に解決の責任を押し付ける質問者が増えていますが、解決の責任は質問者にしかありません。
回答者はその手伝いをするだけです。
> htmlとMarkdownの入れ子も実現できました。
それは入れ子ではないですね。
終了タグで終了しているので。
入れ子というのは、箱を並べるのではなく、箱の中に箱を入れるようなものを言います。
>> 初めからこのリンクをご紹介いただけていれば
そもそも前提が違う。
プログラマやSEは『調べること』と『考えること』が仕事です。
言われたことだけしかしない人は大成しません。
それに、仮に質問者さんの仰るように調べてあげて提示しても、
『わかんねーなら答えんな』とか逆ギレする人が多いです。
質問者さんがそういうタイプではないにしても、なんで『回答者だけが悪い』のでしょうか。
ドキュメントを隅々まで読めば情報が手に入ることは承知しております。
結局、ドキュメントを隅々まで読みました。
「ドキュメントには書いていない」というのはミスリードであり、
実際にはドキュメントに書いてあったので小言を言わせてもらいました。
独自拡張がなされている可能性のある仕様の調査において、原典にある記述を「できない根拠」として断ずることはできないですよ。
まぁ普通なら、原典と現象が一致した時点で「原典通りの挙動を確認した」で良いと思いますが、現象から判断することを良しとしないと言っているので、コードの該当箇所を整理して回答とするのが適切かと。
自分の調査不足を棚に上げて回答された内容に不満を垂れるのがシンプルに気に食わないので低評価しました。
いつの間にか誰かが「ドキュメントに書いてない」と断定したことになっているのが意味不明なのと、結局自身が利用しているライブラリではなくマークダウンの現祖（基本理念を策定した人）を根拠としてしまうというミスリードを引き起こしているので低評価しています。（自分の都合の良いように曲解している。一切コメントを読んでない）
質問冒頭に書いてあるGatsby.jsの話は何処へ行ったのでしょうか。
思想は引き継いでいるかもしれませんが、100%それに準拠しているかどうかは別の話。
マークダウンそのものの話をしたいのかGatsby.jsというライブラリの話をしたいのか、軸を確定させてから投稿してください。
code使ってないと言いつつ「codeで入れ子ができた」というのも謎です。
既に指摘されてる通り、入れ子にはなってません。
ああ、他の仕様を持ってきてたんですか。
マークダウンはどこかで標準化されているわけではなく、かなり方言があり、実装もそれぞれなので、できる処理系もできない処理系もあり得ます。
実際「自分で作ったら」と勧められているように、自分で作れば好きなようにできます。
何の根拠にもなってないので低評価しときます。
> htmlとMarkdownの入れ子も実現できました
とありますが、これは『入れ子ではない』です。
単に『共存』とかそういうのでしょ。
(もっと別の言い方だった気がするが)
少なくとも入れ子というのは、
for文の『中に』更にfor文がある…のような構造です。
入れ子になってないですし、回答に関係ない文句垂れてますんで、低評価してます。
