6月
8

FCKeditorでFLV動画を使う

FCKeditorって、かなり便利なんですが・・・今回はFLV動画を扱えるようにしてみよう。これは、XOOPS以外でも使えるので便利です。

FLV動画を扱う前に、FLVplayerというFLV再生のソフトがあり、今回はそのソフトを使ったプラグインを組み込んでみます。

インストール

  1. FLVPlayerのプラグインを入手します。sourceforgのFLV Player Pluginサイトからどうぞ。
    ページをスクロールして、下の方の「Download」をクリックして、ローカルのコンピュータに保存してください。
  2. flvPlayerというフォルダが出来るので、フォルダごとFCKeditorのプラグインのフォルダへコピーします。
    XOOPS設置URL/common/fckeditor/editor/plugins/ になります。言語ファイルは、en.jsのみ残しても良いです。
  3. 日本語の言語ファイルが無いと思うので、日本語のファイルはこちらからダウンロードが出来ます。
  4. 日本語のファイルは、以下のに設置してください。
    XOOPS設置URL/common/fckeditor/editor/plugins/flvPlayer/lang/ja.js
  5. FCKeditorのツールバーに各プラグインのアイコンを追加します。
    XOOPS設置URL/common/fckeditor/fckconfig.js
    FCKConfig.ToolbarSets["Default"]という項目があります。
    ['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak']あたりに’「flvPlayer’」を追加します。
    僕の場合は、こんな感じです。
    ['Image','Flash','flvPlayer', 'Table','Rule','SpecialChar'],
  6. FCKConfigにプラグインを登録します。
    fckconfig.jsの最後の行へ以下の文を追加します。
    // flvPlayer
    FCKConfig.Plugins.Add( ‘flvPlayer’,'en,ja’) ;
  7. 以上で作業は終わりです。

ブラウザを一度終了させて、FCKeditorを試してみてください。

使い方

うまくインストール出来たら、FCKeditorのツールバーへ が追加されていると思います。

アイコンをクリックすると次のような画面が出ます。

動画やプレビュー画像のファイルのURLやプレイヤーの設定などを行い「OK」ボタンをクリックすれば、エディタの中に挿入されます。現在のバージョンでは、XMLファイルによるプレイリストが利用出来ませんので、「単一のメディアファイル」のみの利用に限定されますが、便利だと思います。

エディタ内には、FLVプレイヤーの内容は表示されずに、こんな感じで表示されます。

XOOPS Cube での picoでの利用例です。

FCKeditorのプラグインを追加するので、XOOPS以外でも使えます。お試し下さい。

タグ: ,

このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加このエントリをLivedoor Clipに追加このエントリをYahoo!ブックマークに追加このエントリをFC2ブックマークに追加このエントリをNifty Clipに追加このエントリをPOOKMARK. Airlinesに追加このエントリをBuzzurl（バザール）に追加このエントリをChoixに追加このエントリをnewsingに追加
Posted by hiro1173 WebTips Subscribe to RSS feed

3 Responses to “FCKeditorでFLV動画を使う”

  1. mame より:
    2009 年 2 月 24 日 12:41 AM

    初めまして。mameと申します。
    この記事を拝見しまして、早速FVLPlayerのプラグインを導入いたしました。

    が、「Movie/Media File（日本語では動画／メディアファイル）」のブラウズボタンをクリックすると、Not Found となってしまいます。その下の「Preview Image」は画像一覧が問題なく表示されました。

    解決方法に心当たりがございましたら、アドバイスいただけると幸いです。どうぞよろしくお願いいたします。

  2. hiro1173 より:
    2009 年 2 月 24 日 3:15 PM

    GIJOE氏のFCKeditor on XOOPSで試して見ました。
    http://xoops.peak.ne.jp/md/myd.....php?lid=93

    XOOPS設置URL/common/fckeditor/editor/plugins/ へ flvPlayerのフォルダをコピー

    /commmon/fckeditor/fckconfig.js を変更する

    98行目に’flvPlayer’を追加
    ['Image','Flash','flvPlayer','Table','Rule','Smiley','SpecialChar','PageBreak','UniversalKey'],

    最終行へ追加

    FCKConfig.Plugins.Add( 'flvPlayer','en,ja') ;

    FCKConfig.Plugins.Addの行が入っていないと「未知のツールバー項目 “flvPlayer”」というダイアログボックスが表示されます。

    基本的にこれだけの設定ですので、もう一度確認してください。

    あと考えられるのが、変更しても変わらない場合にブラウザのキャッシュが呼び込まれていて変更が反映していない場合があります。
    ブラウザのキャッシュをクリアするか、シフトキーを押しながらリロードするとブラウザのキャッシュを使わずに読み込むので変更が反映すると思います。

  3. mame より:
    2009 年 2 月 25 日 11:55 AM

    コメントどうもありがとうございます。

    原因はどうやら、flv形式のファイルが「Media」として認識されていない（？）ことが問題のようでした。

    /plugin/flvplayer/flvPlayer.js の 227行目
    function BrowseServer()
    {
    OpenServerBrowser(
    ‘flv’,
    oEditor.FCKConfig.LinkBrowserURL,
    oEditor.FCKConfig.LinkBrowserWindowWidth,
    oEditor.FCKConfig.LinkBrowserWindowHeight ) ;
    }

    上記のように、MediaBrowser だった部分を LinkBrowser に変更したらファイルマネージャの画面が開けました。
    応急処置になってしまいますが、当面はこれで運用いたします。
    どうもありがとうございます。


»