Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生

drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
video
customization
development
module usage

やりたいこと：Drupalのモジュール（Views）で構成したページにあるビデオデータをモジュール（Lightbox2）で再生

  • 必要なモジュールとバージョン情報
    • Drupal：7.54
    • Views：7.x-3.14
    • Lightbox:2:7.x-2.10
    • Views PHP:7.x-1.0alpha3
    • Devel:7.x-1.5
  • コンテンツ（Article）のビデオを保持するフィールドはモジュール（Youtue Upload）を利用しているので、表示設定に「ビデオ」か「サムネール」2選択肢しないので、Lightbox2にサポートはしていなしていないです（Lightbox2で自動的にビデオの再生はできません）
  • モジュール（Views）で構成したビデオ一覧の表示はビデオのサムネールを選択したので、直接にビデオの再生はできません（一ページに多数のビデオを表示するため、全部Youtueのリンクよりビデオが表示されるまで時間がかかり、見た目にはあまりよくないです）
  • ここで、いろいろなテクニックを駆使して、Lightbox2でビデオ再生することになりました

解決手法：Lightbox2でのビデオ再生可能なコードをビデオのサムネールに挿入

  • Lightbox2でのビデオ再生コードは：<a href="[ビデオのURL]" ref="lightvideo"><img src="[imgパス]"/></a>
    • aタグにある「ref="lightvideo"」はLightbox2でのビデオ再生決め手となります
  • モジュール（Views PHP）を利用して、保存したビデオIDを割り出し、イメージのパスを取得します
    • Viewsで新規フィールド（タイプ：グローバルPHP）を作成します
    • 表示可能なデータ一覧にある「＄data」を出力して観察します（Develモジュールのdsm($data) ）。
  • Lightbox2でのビデオ再生コード（説明は：　Lightbox2 - How to display video content　をご参考）以下のように合成します 
    <?php
  print("<a href='https://www.youtube.com/watch?v=".$data->field_field_video[0]['rendered']['#video_id']."'  rel='lightvideo'>".$data->field_field_video[0]['rendered']['#image']."</a>");
?>
    • Lightbox2でビデオ再生できるフィールドを有効化して、表示させます（元のビデオフィールドを非表示に）

最後：Lightbox２のビデオ再生サポート設定を忘れないよう

  • Lightbox2の初期設定はビデオ再生サポートはOFFになっています
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）にある「ビデオの設定」セクションで「ビデオのサポートを有効化」をチェックして有効化します
Embedded thumbnail for Drupalのモジュール（Lightbox2）を利用してViewsで構成したビデオフィールドを再生
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示
drupal
customization
display suite
module usage
token

問題点：Lightbox2導入前にコンテンツにイメージにLightbox起動の記述コードはありません

  • Lightboxでイメージ表示の基本はimgタグをラップしているaタグにあるrel属性がlightboxに指している必要があります 
    <a href="イメージのURL"
   rel="lightbox[field_image]"
     <img typeof="foaf:Image"
          src="イメージのURL"
          alt="">
</a>
  • Lightbox2が導入前に、コンテンツに挿入されたイメージには、当然Lightbox2起動の記述がありません

解決方法：ページロード時にLightbox起動用のクラスを動的にimgタグに挿入

  • コンテンツの表示はコンテンツ表示管理画面（ホーム » 管理 » サイト構築 » コンテンツタイプ » Article）で操作できます
  • ここで、モジュールDS（Display Suite）のコードフィールドを利用して新規Bodyフィールドを作成します
  • コンテンツ表示管理画面で新規作成したBodyフィールドで既存のBodyフィールドを入れ替えます

注意点：DSのコードフィールドがPHPのeval()関数を利用しているのでセキュリティ上としては危険です

  • eval()関数がどんなphpコードも実行しますので、セキュリティ上は問題があるでしょう。利用時に自己責任で行うべきです
  • 上記例はBody（記事の内容）のデータを扱うので、記事にタブルコーテーション（”）とイングルコーテーション（’）が混在する場合に、eval()の評価は失敗するだろう
Embedded thumbnail for DrupalのTokenを利用してLightbox起動クラスをページロード時にimgタグに追加
drupal
video
media
module usage

モジュール（Lightbox2）でフィールドのイメージ表示は簡単だが、コンテンツ（例：Article）にあるイメージを表示させるには少し手間

  • Lightbox2でイメージフィールドの表示：Lightboxを選択すれば、Lightbox2で表示することができます
  • コンテンツ（例：Article）に埋め込んだイメージをLightboxで表示させるのは少し手間がかかります
  • その理由としては、Lightboxの起動方法：イメージタグをラップしているaタグの属性 rel="lightbox" の記述が必要 
    <a href="http://www.old-pine.net/sites/pine/files/field/image/drupal-module-filt…" 
   rel="lightbox[field_image]" 
   title="" 
   class="lightbox-processed">
     <img typeof="foaf:Image" 
          src="http://www.old-pine.net/sites/pine/files/styles/thumbnail/public/field/…" 
		  width="64" 
		  height="36" 
		  alt="">
</a>
  • ポイントはどのように属性rel="lightbox"をaタグに追加するかのところです。
  • もちろん、画像をコンテンツに挿入する際に、エディターのソースモードで、上記属性をaタグに追加することができます。ちょっと面倒です

Lightbox2のカスタム・イメージ・クラスを設定して、イメージ属性に登録したクラスを追加すれば、Lightbox2の起動ができます

  • Lightbox2の起動トリガークラス設定より、イメージタグの属性の登録したクラスを追加すれば、Lightbox2の起動ができます
  • Lightbox2の管理画面（ホーム » 管理 » 環境設定 » ユーザーインターフェース » Lightbox2）の「カスタムクラスのイメージ」セクションで
    • カスタムクラスのイメージに適用する自動ハンドラー：Lightboxか、グループされたLightboxを選択します
    • カスタムイメージトリガclass：適切なクラス名（例：lightbox-show）を設定します

コンテンツ編集（例：エディタ使用）時に、登録したクラス名をイメージ挿入時に設定すれば良い

  • コンテンツ（例：Article）の変更時に、プレンテキスト編集はもちろん登録したクラスをイメージタグに追加することができます（面倒だけですね）
  • ほとんどの場合に、エディタ（例：CKeditor）で編集します。そのエディタのイメージ挿入ツールを利用して、イメージのタグに登録したクラス名を追加します
  • 注意点：
    • ここでトリガークラスをイメージタグに追加、aタグに追加ではありません
    • イメージをラップするaタグが必須です。aタグが無ければ、イメージのクリックができないからです
  • コンテンツ表示画面でイメージをクリックすると、Lightbox2が起動して、イメージを表示します
  • 具体的な操作はビデオでご参考ください
Embedded thumbnail for Drupalのモジュール（Lightbox2）のカスタム・イメージ・クラス機能でコンテンツにある写真の表示