twitter-bootstrap - wagtail WYSIWYG エディターにブートストラップ img レスポンシブ クラスを追加する

Question

ボディ画像がページに挿入されたときに、bootstap クラス「img-responsive」が画像タグに追加されるようにしようとしていますか?

これを達成する方法を誰か教えてもらえますか？

Answer 1

これは、画像形式を介して行うことができます。

http://docs.wagtail.io/en/v0.8.5/core_components/pages/editing_api.html#image-formats-in-the-rich-text-editor

画像をリッチ テキスト領域に挿入するときに通常表示される「全幅」/「左揃え」/「右揃え」オプションは、画像参照を最終的なタグに変換する方法を決定する Format オブジェクトから取得されます。したがって、組み込みの Format オブジェクトを、クラス名を挿入するものに置き換える必要があります。以下を含むファイル「image_formats.py」をアプリ内に作成します。

from wagtail.wagtailimages.formats import Format, register_image_format, unregister_image_format

unregister_image_format('fullwidth')
register_image_format(Format('fullwidth', 'Full width', 'richtext-image full-width img-responsive', 'width-800'))

unregister_image_format('left')
register_image_format(Format('left', 'Left-aligned', 'richtext-image left img-responsive', 'width-500'))

unregister_image_format('right')
register_image_format(Format('right', 'Right-aligned', 'richtext-image right img-responsive', 'width-500'))