遅まきながらDruap7にUpgradeしましたでも述べたように、このサイトでは、Drupal6とDrupal7で、画像もジュールの使い方がガラリと変わったので、Drupal6によるVideo Galleryの構築を、Drupal7仕様に全面的に書き換えました。
◆使用したモジュール
・Drupal Core
| Image | 画像の操作を行います。 |
| Taxonomy | コンテンツを分類するためのタグを付けます。 |
・DrupalのPlugin
| Video | 動画ファイルのアップロードの際には、FLV変換とサムネイル抽出を行います。表示に際しては、動画(プレイヤー)とサムネイルの使い分けが可能です。 |
| Video Presets | Videoモジュールの事前設定を行います。 |
| Flowplayer | VideoがFLVを表示する際に使用するFlash Playerです。 |
| Image resize filter | 本文に画像を挿入する際、サイズを変更するフィルターです。 |
| Taxonomy Menu | Taxonomyで分類されたコンテンツを、Term毎にメニュー表示します。 |
| Views | コンテンツの検索結果を、様々なフォーマットで表示します。 |
・その他のフリーソフト
| FFMPEG | ビデオコーデックの変換やサムネイルの抽出を行います。 |
◆Videoのインストール
Videoモジュールは、動画のコード変換に、ZencoderかFFMPEGを使用します。Video 7.x-1.xまではFFMPEGが標準でしたが、Video 7.x-2.xからはZencoderが標準に変わりました。Video 7.x-2.xの使い方がまずいのかもしれませんが、Zencoderを選ぶとサムネイルがうまく抽出できません。また、FFMPEGを選ぶと、Video 7.x-1.xにあった設定項目がなくなっているので、FFMPEGはまともに機能しません。Video 7.x-2.xにアップグレードすれば、本文中にビデオが挿入できると期待したのですが、Video 7.x-1.xに戻しました。
Zencoderと異なり、FFMPEGは別途インストールする必要があります。Red Hat系の場合、FFMPEGはRPMforgeから入手できます。Ubuntuの場合は、標準リポジトリに入っているので、apt-getでインストールできます。ただし、標準のコーデック・ライブラリ(libavcodec52)では、MP3をエンコードできないので、libavcodec-extra-52をインストールする必要があります。
Flash Playerをインストールせずに、Videoモジュールを有効化すると、PlayersタブにSWF ToolsかFlowplayerをインストールするように表示されます。しかし、SWF ToolsはDrupal7に対応していないので、選択肢はFlowplayerしかありません。
Configuration » Media » Video で設定する必要のある項目は、下記の通りです。
◆ Blog entryにImage Fieldを追加
ブログに挿入した画像を、Teaserにサムネイルで表示するためにBlog entryに手を加えます。Blog entryにImage Fieldを追加し、Image Fieldに一旦アップロードした画像を、別途 Image resize filter を用いて本文に挿入します。Teaserには、Image Fieldをサムネイル表示します。全文表示に際しては、Image Fieldは非表示にします。
Structure » Content typesの画面で、Blog entryのmanage fieldsをクリックします。先ずAdd existing fieldを確認し、Image Fieldがあればそれを使用します。なければ、Add new fieldで、Image Fieldを作成します。Field TypeでImageを選択すると、Widgetは自動的にImageに切り変わるので、LabelとField nameに適当な名前を入れて、一旦保存します。引き続き設定画面が現れるので、次の項目を設定します。
Manage Display画面でDefaultを選択し、Image FieldのFormatを<Hidden>にし、全文表示の際にImageがFieldとして表示されないようにします。Imageは、別途 Image resize filter を用いて、本文中に挿入します。そのためには、Configuration » Content authoring » Text formats で使用するformatをconfigureし、Image resize filter を有効化する必要があります。また、Configuration » Content authoring » Wysiwyg profiles で使用するformatをEditし、Buttons and Plugins のImageを有効化すれば、Wysiwyg Editorで挿入できるようになります。
Manage Display画面でTeaserを選択し、Image FieldのFormatをImageにします。しかし、このままではTeaserにOriginal imageが表示されるので、右横の編集ボタンをクリックし、Image styleをthumbnailに変更します。また、Link image toで画像のリンク先を指定できます。Contentを選択すればコンテンツの全文表示に、Fileを選択すればOriginal imageにリンクします。
◆Galleryの作成
○Menu
Taxonomy Menuを組み込むmenuを作成します。Navigation等既存のmenuに組み込む場合は、必要ありません。 Structure » MenusでAdd menuをクリックし、Titleを入力します。英数字を入力した場合はURL pathが自動生成されますが、日本語の場合は別途入力する必要があります。保存すれば完了です。
○Taxonomy
Structure » TaxonomyでAdd vocabularyをクリックし、Nameを入力します。Menuと同様、英数字を入力した場合は Machine nameが自動生成されます。Menu locationに作成したMenuを選択します。Menu path typeは、Defaultしか選択できません。Defaultでは、taxonomy_termというViewしか使えないので、Taxonomyにより表示を変えたいときに困ります。README.txtには、“The modules Taxonomy Menu Custom Path and Taxonomy Menu Hierarchy provide additional path configuration types (see the "INTEGRATION WITH VIEWS MODULE" section below). ”とあるので探したのですが、そのようなモジュールは見つかりませんでした。
Structure » Taxonomyでadd termsをクリックし、画像を分類するタグを登録します。その際、RelationsのParentsを選択すれば、階層メニューが作れます。
○Content type:Image
ギャラリーに登録する画像を格納するコンテンツを作成します。
Structure » Content typesでAdd content typeをクリックし、NameにImageを入力します。Machine nameは自動的にimageに設定されます。Display settingsの“Display author and date information.”で、コンテンツに“Author username and publish date”を表示するか否かを選択できます。私は、ギャラリーをすっきりさせるため、このチェックを外しています。
ここで一旦保存すると、Structure » Content typesの一覧にImageが加わります。この段階では、Content type:Imageには、TitleとBodysしかありません。続いて、Structure » Content typesの画面で、Imageのmanage fieldsをクリックし、画像を登録するImage Fieldと、Taxonomy Termを登録するTerm Reference Fieldを追加します。
Image Fieldを登録する方法は、Blog entryと同じです。ただし、このコンテンツは、必ず一つだけ画像を格納するので、“Required field”はOnに、“Number of values”は1に設定します。
Add new fieldのField TypeでTerm Referenceを選択します。Wiget は、“Select list”か“Check boxes/radio buttons”か“Autocomplete term widget(tagging)Image”の中から選択します。最初の二つは、コンテンツにタグを付ける際、事前登録したタグのリストから選択します。この二つには、文字列を直接クリックして選択するか、チェックボックスをクリックして選択するかの違いしかありません。“Autocomplete term widget(tagging)Image”は、付けたいタグを、直接文字列で入力します。タグを事前に登録する必要はありません。
LabelとField nameに適当な名前を入れて、一旦保存すると、設定画面が現れます。最初の画面では、Vocabulary欄でギャラリー用に作成したTaxonomyを選択します。保存すると、次の設定画面が現れます。登録した画像を全てギャラリーに表示したければ、“Required field”をOnにします。また、複数のタグ付けを認めるならば(同じ画像がメニューの中に複数登場してもよければ)、“Number of values”に1以外の値を設定します。
Manage Display画面で、全文表示およびTeaserにおける各フィールドの表示方法を指示します。ギャラリーは、サムネイルの一覧にしたいので、TeaserではBodyを非表示にしています。
○Content type:Video
ギャラリーに登録するビデオを格納するコンテンツを作成します。
Structure » Content typesでAdd content typeをクリックし、NameにVideoを入力します。Machine nameは自動的にvideoに設定されます。ギャラーには、画像とビデオを混在させるので、Content type:ImageとContent type:Videoの表示設定は、揃えないと不細工です。
ここで一旦保存すると、Structure » Content typesの一覧にImageが加わります。この段階では、Content type:Videoには、TitleとBodysしかありません。続いて、Structure » Content typesの画面で、Videoのmanage fieldsをクリックし、ビデオを登録するVideo Fieldと、Taxonomy Termを登録するTerm Reference Fieldを追加します。
Add new fieldで、Video Fieldを作成します。Field TypeでVideoを選択すると、Widgetは自動的にVideo Uploadに切り変わるので、LabelとField nameに適当な名前を入れて一旦保存すると、設定画面が現れます。最初の画面では、“Enable video conversion.”と“Automatically generate thumbnails”をOnに設定し、再び保存します。次の画面では、“Required field”はOnに、“Number of values”は1に設定します。
Term Reference Fieldは作成済みなので、Add existing fieldから選択します。設定は、Content type:Imageに合わせてください。
Manage Displayの設定も、Content type:Imageに合わせてください。
○Views
Structure » ViewsでTaxonomy termを有効化し、編集します。編集する項目は下記の通りです。
○Blocks
Structure » Blocksで、作成したMenuを、sidebar firstに表示します。