3分でできるポップアップ體験談記事回転ブロックの作り方を教えます!この方法で超素敵なスライド効果が得られます!

コンテンツベースのウェブサイトやブログでは、「おすすめ記事」はユーザーの滯在時間やナビゲーションの深さを高めるための重要なモジュールであることが多い。おすすめコンテンツをより魅力的に表示するには エレメンタル?プロ ループ?カルーセル 記事をスライド表示させるこの機(jī)能は、ビジュアル的にも良く、インタラクティブで、ホームページや記事ページの下部に使うのに最適です。この記事では ループ?カルーセル 推奨記事のローテーションを可能にする機(jī)能。

I. 準(zhǔn)備

ループ?カルーセル機(jī)能を使用するには、以下の前提條件を満たす必要がある:

  • Elementor Proプラグインをインストールして有効にする
  • 推奨される表示については、すでに多くの記事が公表されている。
  • ループアイテムのテンプレートはあらかじめ作成されています(Elementorの公式ドキュメントを參照するか、既存のテンプレートを再利用してください)。

まだElementor Proをお持ちでない方は、公式サイトで購入し、有効化してください。

畫像[1] - 3分でできるポップアップ體験談記事回転ブロックの作り方を教えます!この方法で超素敵なスライド効果が得られます!

ループ?カルーセルをページに追加する

  1. 推薦文を追加したい記事を開くウェブページ(例:ホームページや記事ページ)
  2. Elementorで編集]をクリックします。
  3. 左のコンポーネントパネルで "Loop Carousel "を検索する。
  4. コンポーネントをページの適切な場所にドラッグします。
  5. 設(shè)定パネルで既存のループアイテムテンプレートを選択します。
畫像[2] - 3分でできるポップアップ體験談記事回転ブロックの作り方を教えます!この方法で超素敵なスライド効果が得られます!

III.記事フィルターの設(shè)定(おすすめコンテンツの表示)

このカルーセルで特定のカテゴリーやタグに屬する投稿のみを表示させたい場合は、クエリ設(shè)定で設(shè)定することができます:

  1. クエリー]タブをクリック
  2. 記事の種類]を投稿に選択する
  3. 特定のカテゴリ、タグ、または手動で選択した記事を[條件で含める]で表示するように設(shè)定します。
  4. また、表示する記事數(shù)を制限することも可能で、例えば直近の6記事を表示することもできる。

このようにして、「おすすめ記事」の表示內(nèi)容を正確にコントロールすることができます。

畫像[3] - 3分でできるポップアップ體験談記事回転ブロックの作り方を教えます!このようにスライドさせることができます!

第4に、スタイルとスライド効果の最適化

ループ?カルーセルは様々なインタラクション設(shè)定をサポートしています:

  • 自動再生を有効にするかどうか
畫像[4] - 3分でできるポップアップ體験談記事回転ブロックの作り方を教えます!この方法で超素敵なスライド効果が得られます!
  • 左右のトグルアイコンのサイズと色、回転の位置を設(shè)定する。
畫像[5] - 3分でできるポップアップ體験談記事回転ブロックの作り方を教えます!このようにスライドさせることができます!
  • 回転するナビゲーション?ドットのサイズ、色、位置、間隔を調(diào)整します。
畫像[6] - 3分でできるポップアップ體験談記事回転ブロックの作り方を教えます!このようにスライドさせることができます!

あなたのページのスタイルに合わせて、柔軟に調(diào)整してください。

V. モバイル適応 (レスポンシブ(最適化)

攜帯端末のディスプレイを確認(rèn)することをお忘れなく:

  1. Elementor 左下のデバイスアイコンをクリックします。
  2. 攜帯電話/タブレットモードに切り替える
  3. 1行の表示數(shù)、テキストサイズ、カードの余白などのパラメーターを調(diào)整する。

攜帯電話でも良好な表示が保証される。

畫像[7] - 3分でできるポップアップ體験談記事回転ブロックの作り方を教えます!このようにスライドさせることができます!

まとめ

Elementor Proのループカルーセル機(jī)能を使えば、美しく便利な「注目記事」回転モジュールを簡単に作成でき、ウェブサイトの視覚的階層を強(qiáng)化し、ユーザーの粘著性とページのインタラクション率を高めることができます。人気コンテンツ、関連記事を表示し、強(qiáng)化しましょう。換算率しかし、試してみる価値のあるレイアウトだと思う。


お問い合わせ
チュートリアルが読めない?無料でお答えします!個人サイト、中小企業(yè)サイトのための無料ヘルプ!
カスタマーサービス WeChat
カスタマーサービス WeChat
電話:020-2206-9892
QQ咨詢:1025174874
Eメール:info@361sale.com
勤務(wù)時間: 月~金、9:30~18:30、祝日休み
? 複製に関する聲明
この記事はzzzrによって書かれた
終わり
好きなら応援してください。
クドス130 分かち合う
おすすめ
解説 ソファ購入

コメントを投稿するにはログインしてください

    コメントなし