パレット - カラフルに🎨
Palette — ビジュアルページビルダー、デザインの専門知識は不要です。
Scroll
1.10 Colorbox:Drupal でシンプルなフォトギャラリーを作成する
05/08/2019, by mikhail
Menu
- LandoでDrupalをインストール
-
1. Drupal:基本機能
- 1.1 サイトコンテンツ、コンテンツタイプ、ノード。
- 1.2 ユーザー、ロール、権限
- 1.3 コメント
- 1.4 Blog + CKEditor は Drupal のブログ。
- 1.5. Taxonomy - タクソノミー、ボキャブラリーと用語
- 1.6. Block:リージョンとブロック
- 1.7. Field、Entity:フィールドとエンティティの操作。
- 1.8. Image:画像の操作、プリセット。
- 1.9 Views:Drupal のニュースフィード
- 1.10 Colorbox:Drupal でシンプルなフォトギャラリーを作成する
- 1.11 Forum:Drupal でフォーラムを作成する
- 1.12. Drupal のメニュー
- 2. Drupal:設定
- 3. Drupal:サイト構築
- 4. Drupal Commerce - Drupal 用のオンラインストアモジュール
- 5. Drupal と SEO。
- 6. Drupal:テーマ作成
- 7. Drupal:高度なテーマ作成
- 9. Drupal のモジュール開発
- Drupal decoupled。Drupal でバックエンドを構築する。
- 古い記事
サイトでは、画像をポップアップウィンドウで表示する必要がよくあります。そのために、Drupal には非常に人気のある Colorbox モジュールがあります:
https://www.drupal.org/project/colorbox
composer require drupal/colorbox
drush en colorbox
インストール後、モジュールフォルダーに移動し、README.txt ファイルを見つけて、colorbox ライブラリへのリンクを見つける必要があります
/web/modules/contrib/colorbox


ダウンロード後、colorbox-master フォルダーを解凍して colorbox に名前変更し、サイトのルートにある libraries ディレクトリに置く必要があります。このディレクトリがない場合は、作成します。

私は複数の Images フィールドを持つ Gallery コンテンツタイプを持っています。このフィールドに colorbox を設定しましょう:

さまざまな表示設定も利用できます

私はこのままにしましたが、ご自分に合わせて設定できます。モジュール設定にある設定を自分に合わせて変えることもできます。私はデフォルト設定のままにしました

いくつか写真をアップロードするために Gallery ページを追加しました:

クリックすると次のように見えます:

画像を 1 行に配置して間にマージンを追加すると、見栄えが良くなります。