wordpressゃplone のCMSにTinyMCEプラグインがあり、その機能には画像のタグ挿入と同時に画像キャプションも画像下に付加できるようですが。
CMSを使わず TinyMCE単独で画像キャプションを付加するカスタマイズは可能でしょうか?
当方javascriptのスキルは中級に行かない程度です。
既存のWebサイトで TinyMCEを使った機能追加をしよとしておりますが、CMSを使わず作られているのです。
No.1
1504
493
300pt
>画像キャプションを付加するカスタマイズ
がどういう動作を指しているのかはっきりしないのでアレですが、
もしlightboxやhighslideのような、画像をクリックするとポップアップで表示され下にキャプションが付くような効果のことを指しているなら、リンク設定のadvancedでlightboxを付ければできると思います。
Vectis Solutions » Using Lightbox with TinyMCE - help
TinyMCEのadvancedにlightboxがプリセットされているものの、lightbox本体のスクリプトは同梱されていないようなので、
のようにしてlightboxを読み込むようにしてから、
Vectis Solutions » Using Lightbox with TinyMCE - help
要は、lightbox読み込み時にaタグにrel="lightbox"があればlightbox化するので、TinyMCEでそれを付けるようにするだけです。
----------
簡単なプラグインを作ってみました。
https://github.com/cherenkov/tinymce-caption-plugin
上のDownloadボタンからzipを落としてexamplesフォルダのfull.htmlを開いてみてください。
メニューボタンの一番最後にあるのがキャプション用です。
このプラグインは画像のalt属性をspanで出力するだけなので、
まずは備え付けのinsert imageでdescriptionを設定して画像を挿入して、
画像を選択してこのプラグインを実行するといった手順です。
一回の動作で、画像挿入、キャプション設定をするには、window用htmlなどゴリゴリする必要があります。
が参考になると思います。
No.1
1504493
ここでベストアンサー
300pt
>画像キャプションを付加するカスタマイズ
がどういう動作を指しているのかはっきりしないのでアレですが、
もしlightboxやhighslideのような、画像をクリックするとポップアップで表示され下にキャプションが付くような効果のことを指しているなら、リンク設定のadvancedでlightboxを付ければできると思います。
Vectis Solutions » Using Lightbox with TinyMCE - help
TinyMCEのadvancedにlightboxがプリセットされているものの、lightbox本体のスクリプトは同梱されていないようなので、
のようにしてlightboxを読み込むようにしてから、
Vectis Solutions » Using Lightbox with TinyMCE - help
要は、lightbox読み込み時にaタグにrel="lightbox"があればlightbox化するので、TinyMCEでそれを付けるようにするだけです。
----------
簡単なプラグインを作ってみました。
https://github.com/cherenkov/tinymce-caption-plugin
上のDownloadボタンからzipを落としてexamplesフォルダのfull.htmlを開いてみてください。
メニューボタンの一番最後にあるのがキャプション用です。
このプラグインは画像のalt属性をspanで出力するだけなので、
まずは備え付けのinsert imageでdescriptionを設定して画像を挿入して、
画像を選択してこのプラグインを実行するといった手順です。
一回の動作で、画像挿入、キャプション設定をするには、window用htmlなどゴリゴリする必要があります。
が参考になると思います。
回答ありがとうございます。
しかし、ポップアップは想定していません。
挿入された<img>タグの下に<br /><span>画像の説明</span>
が同時に挿入されるイメージです。
wordpress や plone のプラグインでは、alt属性に設定されたテキストをキャプションに使っている様です。
文章の回り込みまで対応しているようです。
参考にしたサイト：
http://fridgedesign.net/wordpress-image-upload/
TinyMCEを簡単にカスタマイズする方法はありますか？
ゴリゴリ改造しなければならないようになるのでしょうか？
－－－
追記ありがとうございます。
full.html を見させていただきました。
この手順は十分受け入れられるものだと思います。
参考URLもありがとうございます。
理想は、タグを
wordpress のhtmlソースを見たら、そうなっていました。
<div id="attachment_7" class="wp-caption alignleft" style="width: 310px"><a...<img...
また何かありましたら、ご投稿いただけると幸いです。
Cherenkov
2011/08/14 14:32:44
28
28
1
2
回答ありがとうございます。
しかし、ポップアップは想定していません。
挿入された<img>タグの下に<br /><span>画像の説明</span>
が同時に挿入されるイメージです。
wordpress や plone のプラグインでは、alt属性に設定されたテキストをキャプションに使っている様です。
文章の回り込みまで対応しているようです。
参考にしたサイト：
http://fridgedesign.net/wordpress-image-upload/
TinyMCEを簡単にカスタマイズする方法はありますか？
ゴリゴリ改造しなければならないようになるのでしょうか？
－－－
追記ありがとうございます。
full.html を見させていただきました。
この手順は十分受け入れられるものだと思います。
参考URLもありがとうございます。
理想は、![]()
タグを
wordpress のhtmlソースを見たら、そうなっていました。
<div id="attachment_7" class="wp-caption alignleft" style="width: 310px"><a...<img...
また何かありましたら、ご投稿いただけると幸いです。