Elementorで画像ギャラリーをプロのように追加・編集する
Elementor を使用すると、ページや投稿の作成に大いに役立ちますが、完全に機能させるためにはより多くのツールが必要になる場合もあります。これらの重要なツールの 1 つとして、強力なページビルダーを改善できるギャラリーマネージャーが挙げられます。 WP Media folder を使用して Elementor でギャラリーを追加および編集する方法を見てみましょう。.
ギャラリーマネージャや主要なページ ビルダーとの統合など、素晴らしいツールを使えば、WP Media Folderを使っていい感じのギャラリーを作成したり、メディアライブラリを数回クリックするだけで整理することができます!
このチュートリアルでは、ギャラリー・マネージャを使用して、Elementorから直接、ギャラリーを最初から作成します。.
目次
WP Media FolderでWordPressギャラリーを作成する
まず、 WP Media Folder Gallery Addonを使用してギャラリーを作成する方法を見ていきます。.
このギャラリーマネージャーは、WP Media Folderとギャラリーアドオンをインストールした後、メディアライブラリ > メディアフォルダーギャラリー
この画面では、+ 新しいギャラリーの追加の上にマウスを置き、+ 新しいメディアギャラリーの作成をクリックする必要があります。
これにより、ギャラリーのタイトルを入力し、テーマを選択できるモーダルが開きます。.
とりあえず、ここでは「マイギャラリー」と名付け、デフォルトのテーマのままにします。.
これにより、多くの設定オプションを備えたギャラリー作成ダッシュボードに移動し、ギャラリーを構築します。まず、ギャラリーに画像を追加します。.
ギャラリーにメディアを追加するための多くのオプションがあります。主なものは、メディアライブラリから追加するか、PCの
ファイルエクスプローラーから直接アップロードする方法です。両方の方法を見てみましょう。
まず、メディアライブラリオプションがありますので、それをクリックします。
ここをクリックするとメディアライブラリが開きます。メディアライブラリにフォルダがあることに気づくでしょう。これは WP Media Folderのおかげで、メディアフォルダとフィルターを使ってメディアを最適な方法で整理できるのです。これについてはこちらで詳しく説明していますが、それはまた別の機会に ;)
ここで画像を追加するには、追加したい画像を追加したメディアフォルダーに移動し、Ctrl + クリックで画像を選択し、最後に画像をインポートをクリックします。
これにより、選択したすべての画像がギャラリー・マネージャに追加され、使用したり調整したりできるようになります。.
PCから直接画像をアップロードするオプションを見てみましょうファイルエクスプローラー、このためには、フォルダーアイコンをクリックします。
これを行うと、ファイルエクスプローラーがすぐに開き、フォルダー内を移動してギャラリーに追加する画像を選択できます。.
アップロードしたい画像を選択し、開くをクリックします。
これを行った後、私たちは完了しているはずです!これで、ギャラリー・マネージャ内のすべての画像をギャラリーに使用する準備が整いました。.
すべての画像が揃ったので、ギャラリーの設定を確認しましょう。そのためには、2番目のタブ表示設定とショートコードをクリックします。
最初に、8つのギャラリーがあり、それぞれのギャラリーに独自の設定があることがわかります。.
見てみましょうMasonry、これは多くの画像が異なるサイズで表示される典型的な壁です。プレビュータブで見ることができます。
設定の下で、すべてのオプションから選択できます。たとえば、画像のサイズや masonry レイアウトなどです。現在の垂直方向から水平方向に編集し、画像を小さくしてみましょう。.
プレビュータブを確認し、現在の表示を確認します。
本当に良いツールであり、すばらしい機能を備えていることがわかります。数回クリックするだけで数秒で変更を加え、外観を確認できます。ギャラリーの作成がこれほど簡単だったことはありません。
ElementorでWordPressギャラリーを追加する
ここでは、WP Media Folderギャラリー・マネージャを使用してギャラリーを作成する方法を見てきました。次に、Elementorを使用して投稿やページにそれを追加する方法を見てみましょう。
これを行うには、ページまたは投稿に移動し(または作成し)、Elementorで編集をクリックします。ページ・ビルダーが読み込まれます。
エディターで、WP Media Folder アドオンギャラリーブロックを探し、それをコンテンツに追加します。
ブロックが読み込まれ、Media Gallery Addon Blockが追加されたことが通知されます。.
左のタブで、必要なギャラリーを選択したり、調整したりすることができます。.
まず最初に、ギャラリーの選択の下で作成したギャラリーを選択しましょう。
以前に作成したギャラリーは、ブロックの下にあるページ・ビルダーに自動的に読み込まれます。.
ここでは、ギャラリー・マネージャで選択した Masonry テーマが表示されています。ブロック設定から直接選択できるテーマで利用できるすべてのオプションを確認してみましょう。.
Masonry
ほぼすべてのページにぴったり合う非常に優れたテーマで、多数の画像を表示できます。.
デフォルト
このテーマでは、画像のタイトルとともにクラシックな方法で画像を表示することができます。.
ポートフォリオ
これにより、デフォルトのテーマと同様の画像を別のフォントで表示でき、アート作品の表示に最適です。.
スライダー
スライドごとに表示する画像の数を絞ることができるクラシックスライダー。.
フロースライド
スライダーテーマに似ていますが、アニメーションが異なり、1つのスライドに1つの画像を表示しますが、他の画像をプレビューすることもできます。.
グリッドフォーマット
画像にマウスオーバーしたときに画像のタイトルを表示する正方形の画像のクラシックギャラリー.
マテリアル
本当に素晴らしいテーマで、正方形の画像をきれいなシャドウとタイトルで表示できます。.
カスタムグリッド
画像のサイズを自由に変更して、望むように表示できるグリッドテーマは、独自の画像サイズ/寸法でギャラリーを作成したい場合に最適なオプションです。Gallery Managerでの動作を簡単に見てみましょう。.
左側のメニューにあるすべてのギャラリーのオプションを見てみましょう。.
まず最初に、ギャラリー・ナビゲーションがあります。このオプションを有効にすると、WP Media Folder ギャラリー・アドオンで利用可能なナビゲーション・ギャラリーを使用できるようになり、親ギャラリーやサブギャラリーも使用できるようになります。実際のデモはこちら
2番目のオプションとして、画像タグの表示があります。多数の画像をギャラリーに保存していて、フロントエンドでWP Media Folderのタグシステムを使って画像をフィルタリングしたい場合に便利です。
次に、テーマセレクター
さらに確認を続けると、ギャラリーの選択
画像サイズ
ライトボックスサイズオプションを使用すると、画像サイズと同様に、クリック時に表示されるライトボックスのサイズを選択できます。
クリック時のアクション
そして最後のオプションは、画像の表示順序を設定するもので、ギャラリーで画像をどのように表示するかを指定できます。.
もちろん、これらに加えて、画像間の余白の設定、ホバー時の色の変更、枠線や影の追加などの設定も可能です。.
Elementor を使用して、 WP Media Folder ギャラリーを微調整し、ページに合うようにするのは非常に簡単であることがわかります。
メディアフォルダーを使用して高速ギャラリーを作成する
余分なトピックとして、 WP Media Folder で作成されたフォルダを使用して数秒でギャラリーを作成する方法を紹介します。.
この機能により、フォルダに画像を追加すると、ギャラリーに自動的に画像が追加されます。.
まず、メディアフォルダギャラリーの メディアライブラリに移動します。ここでギャラリーを作成しました。ページ上でマウスを+ 新しいギャラリーを追加ボタンにホバーし、フォルダからギャラリーを作成をクリックします。
フォルダエクスプローラーが表示され、使用するフォルダを選択できます。.
作成をクリックすると、フォルダー内の画像が自動的にギャラリーに読み込まれ、わずか数秒でギャラリーを作成できます。
また、画像をメディアライブラリの同じフォルダに追加すると、自動的にギャラリーに追加されるため、ギャラリーマネージャに移動して画像を手動で追加する手間が省けます。.
このオプションを使用するには、フォルダに画像を自動追加が有効になっている必要があります。保存
そして魔法が完成!フォルダはフロントエンドで自動的に表示される画像でもあり、他に何を求めるでしょうか? :)
お気に入りのビルダーで WP Media Folder を使い始める
また、プラグインが実際に動作している様子をステップバイステップで説明するビデオを用意していますので、ぜひご覧ください。
驚くべき機能を備えたプラグインを使用すると、ギャラリーを作成できるだけでなく、メディアを整理したり、Googleフォトからのインポート、オフロードも可能です!
主要なビルダーとの互換性があり、数ステップでメディアを整理してプロフェッショナルな形で表示できます。何をお待ちですか?こちらから今すぐ入手してください!
ブログを購読すると、新しい更新情報があった際にメールでお知らせしますので、見逃すことはありません。.

コメント