Elementorのベーシックギャラリーウィジェットの基本的な解説

ホーム » コラム » 実務課題 » サイト制作 » Elementor » Elementorのベーシックギャラリーウィジェットの基本的な解説
目次

今回はElementorの無料版でも使用できるウィジェット「ベーシックギャラリー」の使用方法について解説していきます。

ベーシックギャラリーは画像を複数登録し並べて表示できるウィジェットです。
画像ウィジェットを複数並べて使うのとは異なり、1つのウィジェットで複数の画像を登録し表示が可能です。

ベーシックギャラリーウィジェットで使える設定項目

まずは下記画像のベーシックギャラリーウィジェットの基本的な設定に関して解説していきます。

画像

ギャラリーに表示する画像を追加または選択するエリアです。
このエリアをクリックするとメディアライブラリが開き、既存の画像を選択したり新たに画像をアップロードできます。

Image Resolution

ギャラリー内に表示する画像の解像度を選択します。

カラム

ギャラリーの列数を設定します。
1~10の間で選択可能。例えば「4」を選択すると、1行に4つの画像が表示されます。

キャプション

画像に添付するキャプション(説明文)の設定方法を指定します。

リンク

画像をクリックした際のリンク先を指定します。下記3種類から選択可能です。

  • メディアファイル: 元画像を開く。
  • 添付ファイルのページ: 添付ファイルページへ移動。
  • なし: クリックしてもリンク動作は発生しない。

Lightbox

画像クリック時にポップアップで画像を表示するかどうかを設定します。

並び順

ギャラリー内の画像の表示順序を設定します。デフォルト/ランダムから選択可能です。

画像設定

スタイルの画像設定に関して説明を記載していきます。

間隔 (Custom Spacing)

画像同士の間隔を調整する設定です。
カスタムでは手動で画像間隔を指定可能です。

Border Type

画像に枠線を追加するかどうか、またそのスタイルを選択します。

枠線の幅

画像の周囲の枠線の幅を調整します。

枠線の色

枠線の色を指定します。

枠線の丸み

画像の角の丸みを調整する設定です。

キャプション設定

スタイルのキャプション設定項目に関して説明していきます。

 配置

テキストの配置を左/中央/右/均等割付から選択可能です。

文字色

キャプションテキストの色を指定します。

タイポグラフィ

キャプションテキストのフォントスタイルをカスタマイズします。

Text Shadow

キャプションテキストに影を追加します。

間隔

キャプションと画像の間隔を調整します。

まとめ:画像を複数並べるならこのウィジェットを使おう

画像ウィジェットを複数並べると管理が大変でレイアウトの調整も面倒です。しかしベーシックギャラリーウィジェットを使用すれば一つのウィジェットで複数の画像を一括管理できます。

画像一つ一つのレイアウトの調整をして並べたいなどの理由がなければこのウィジェットを使うのが無難でしょう。

下記は通常の画像ウィジェットの記事です。合わせてぜひご確認ください。

LP作り放題
月額1万円~
更新もすべてお任せ

WordPressを利用したノーコードツール。更新などもすべてお任せ月額1万円~。LPデザインや組み込みなども柔軟に対応します。

動く!印象に残る!
使いやすいサイト
作ります。

発注したデザインをお客様に届けるうえで、ウェブサイトと広告は非常に重要です。
デザインを最大限に生かしたサイトを作りたい方はお気軽にご相談ください。

関連する記事
その他の情報をチェック
サイト内検索
新着お役立ち記事
カテゴリ一覧
NEW
Elementorで
テーブルが簡単に作れる
アドオンにアーリーアクセス
Elementorで
驚くほど簡単にテーブルが作れる
アーリーアクセス受付開始
今すぐ詳細をチェック
よくダウンロードされている
SHI-SOおすすめ資料
No1を目指している企業向けサポート
PDFの計測機能を使いたい
自社ドメインで短縮URLを使いたい