WordPress Avada(Avada)でImage Carousel使用する
最も人気のある WordPress テーマの一つである Avada(Avada)は長い間販売1位の座を守っているベストセラー WordPress テーマです。 Avadaが安定した人気を集めている理由の一つは、初心者でも簡単に使用できるように、さまざまなオプションと機能を提供するポイントでいます。
Avadaは、独自のページビルダーであるFusion Builder(フュージョンビルダー)を使用します。 (参考までに、多くの有料テーマで Visual Composer(Visual Composer)を基本搭載しています。)
Avada テーマでImage Carousel(画像回転スライド)を使用する
次の図は、Fusion Builderで追加できる要素(Element)を示しています。
フュージョンビルダーでは、次のような要素を追加することができます:ブログ記事リスト、ボタン、チェックリスト、コードブロック、コンテンツボックス、カウントダウン、カウンターボックス、カウンターサークル、エベント、フリップボックス、Font Awesome、フュージョンスライダーは、Googleマップ、イメージキャラ設定、画像フレーム、 LayerSlider、メニューアンカー、モーダル(Modal)、Person、ポストスライダー、価格表(価格表)、進行状況バー、最近の記事、最近Works、 Slider Revolution、Section Separator(セクション区切り)、Separator、Sharing Box(共有ボックス)、スライダー、ソーシャルリンク、Soundcloud、表、タブ、タグラインボックス、Testimonial(使用期限)、テキストブロック、タイトル、トグル、ユーザのログイン、非メオ動画、ウィジェットエリア、 WooCommerce キャラ設定(Woo Carousel)、Woo Featured、 WooCommerce ショートコード(Woo Shortcodes)、YouTubeの動画。
画像回転スライド(Image Carousel)を追加するには、上の図の「イメージカルーセル「」をクリックしてドラッグし、目的の場所にドロップします。
たとえば、Fusion Builderの Column Options(カラムオプション)から Full Width Container(全体の幅コンテナ)を配置した後、その中に イメージカルーセルを置くことができます。
上記のようにImage Carouselを挿入した場合、編集アイコンをクリックして、各種オプションを設定して、画像を追加することができます。 編集アイコン(鉛筆のアイコン)をクリックすると、Image Carouselを設定できる画面が表示されます。
(1)画像のサイズを固定(Fixed)にするか、自動(Auto)に調整されるようにするかどうかを設定します。
(2)Hover Type:マウスを画像の上に置くときに適用する効果を指定します。
(3)Autoplay:画像の回転、スライドを自動的にプレイされるようにするかを設定します。
(4)列の最大数:表示する最大列数
(5)カラムの間隔
(6)スクロールするアイテム数
(7)ナビゲーション表示するかどうか
(8)マウスのスクロール
(9)枠
(10)画像ライトボックス設定するかどうか
(11)CSS classを追加することができます。
(12)CSS IDを追加することができます。
Add New Imageをクリックして画像を追加できます。 上記のようにImage Carousel Item 5+式で表示されます。 」Image Carousel Item 1「」をクリックすると、下図のように画像をアップロードできる画面が表示されます。
画像ウェブサイトのリンクを追加したり、 アップロードをクリックして、メディアライブラリの画像を指定するか、アップロードすることができます。 Image Alt Text(イディッシュか代替テキスト)にaltテキストを追加することができます。
テストのために、同じ画像を複数追加しました。 画像のサイズが同じになるよう同一の画像を続けて追加してPicture SizeをAutoに指定しました。 Autoに設定すると、画像のサイズが異なる場合、他のサイズで表示されます。 Fixedに指定すると、元の画像サイズに関係なく、すべての画像が同じサイズで表示されます。
その他の方法 - Carouselプラグイン
基本的に提供する画像の回転、スライドが気に入らない場合、外部のプラグインを使用することができます。 このような機能をプラグインとして Super Carousel, Responsive Posts Carousel WordPress Plugin (反応型ポストカルーセル WordPress プラグイン)があります。
3D効果をしたい場合はUltimate 3D Carousel WordPress Pluginというプラグインを考えてみることができそうです。 (※このプラグインは Codecanyonマーケットで除去され、提供されていません。)
そして多目的コンテンツスライダー/回転スライドを提供する オール・アラウンドというプラグインも大丈夫なようです。 コンテンツスライダーとCarousel機能を同時に提供することです。 (※このプラグインは、長い間更新されていない。)
最後に、
Avadaを使用している場合、Fusion BuilderでImage Carousel要素を使用して、基本的な画像の回転、スライドを作成することができます。 より洗練されたCarouselをしたい場合は上に紹介したCarouselプラグインを使用することができます。
image carousel はカテゴリやポストの recent イメージを carousel してくれませんね… あまりにも残念… だからといって recent post 機能に carousel やアライメント機能もあまりにも虚接… WooCommerceでのみサポートされているcategory image carousel ...
Avadaは多目的テーマに多くの機能が含まれています。
ただし、洗練された機能が必要な場合には、別の専用のプラグインを使用するか、カスタムして使用することを検討してください。
Elementorを使用している場合は、エレメントが提供する画像カルーセル機能を使用できます。
https://brunch.co.kr/@wordcreater/72
WooCommerce用carouselプラグインが必要な場合には、YITHプラグイン(無料/有料)をインストールしてテストすることができます。
https://www.thewordcracker.com/basic/%EC%9A%B0%EC%BB%A4%EB%A8%B8%EC%8A%A4-%EC%83%81%ED%92%88-%EC%8A%AC%EB%9D%BC%EC%9D%B4%EB%8D%94-%EC%BA%90%EB%9F%AC%EC%85%80-%ED%94%8C%EB%9F%AC%EA%B7%B8%EC%9D%B8-yith-woocommerce-product-slider-carousel/