web-dev-qa-db-ja.com

Ghostの画像マークダウンにクラスを追加するにはどうすればよいですか？

Ghostでは、画像の値下げは

![alt](src)

imgタグにクラスを追加するための隠しフォーマットはありますか？または、この機能はまだGhostにありませんか？

私はこのような結果が欲しかった：

<img src="src" alt="alt" class="img-thumbnail">

Htmlマークアップは使いたくない。私は本当にマークダウンを使用してこれを達成する必要があります。助けてください..

markdownghost-blog
17
Melvin

プレーンマークダウン 画像のクラスは使用できません。いくつかの実装では、それは可能です。 markdown extra![alt](src) {.class}を使用します。試してみましたが、Ghostではできません。![alt|img-thumbnail](src)もできません。 dok にもヒントはありません。

ただし、srcをcss-attributeとして使用する場合は、回避策を使用できます。

「役に立たない」ハッシュをURLに追加するだけです。

![alt](src#img-thumbnail)

そしてこれをcssまたはjsでアドレス指定します

img[src$='#img-thumbnail'] { float:left;}

47
klml

これはおそらく明白すぎますが、任意の要素に配置できます。

 <div class="myDiv">
    ![](...)
 </div>

次に、css継承を使用します

.myDiv img { width: 50px; }

ghostのマークアップはhtmlをサポートしているので（おそらくほとんどがサポートしています）、通常の<img ...>タグも実行できます。

2
Sonic Soul

ゴーストでは、ファイルpost.hbsがクラス.kg-card-markdownで{{content}}をレンダリングし、投稿コンテンツのすべての画像にjs addclass用のこの関数を作成できます。

function imageResponsive() {
  $('.kg-card-markdown').each(function(){
    $('img').addClass('img-responsive');     
  });
}
0
Rogerio Orioli

ゴーストでは、ファイルpost.hbsレンダリングde {{content}} whit class .kg-card-markdownuはcssを使用してsassをホイットできます

.kg-card-markdown { 
  img{
    @extend .img-responsive;
  } 
}
0
Rogerio Orioli