アバダテーマチュートリアル：検索要素を使用すると、サイトがよりインテリジェントで実用的かつ便利に検索してみましょう！

アバダのテーマWordPressのビルトイン検索機能を継承しているだけでなく、簡単にカスタマイズできる 検索エレメントに挿入することができる。サイト内どこでも気付くリアルタイム検索そしてコンテンツ・タイプのフィルタリングといった高度な機能を備えている。本記事では アバダ検索要素の役割を果たし、プロ級の検索フォームを素早く作成するための詳細な設定手順を提供します。

アバダ・サーチ・エレメントとは何ですか？

アバダ・サーチ・エレメント はAvada Builder Elementのコンポーネントで、Webサイトに以下の機能を提供します。検索内容検索バーは、例えばページのどのエリアにも挿入することができる：

• ページコンテンツ領域
• ヘッダーレイアウト
• フッターレイアウト
• カスタムレイアウトセクション

をサポートしている。 WordPressグローバル検索以下も利用できる。優れた機能::

• ライブ検索
• 特定のコンテンツタイプ（記事、ポートフォリオなど）の検索をサポート。
• 特集画像、投稿タイプ、カテゴリーなどのメタ情報を表示する。
• デザインのフルカスタマイズ（ボーダー、フォント、背景、色など）

検索要素の追加と設定方法

検索要素の追加

• ページ・エディター (アバダ・ライブ・ビルダー).
• 検索ボックスを挿入したい場所を見つけてください。

• 要素を追加(+)をクリックして検索し、選択します。 検索.

• そうしれいかん検索要素ページを挿入し、パラメーターの設定を開始することができます。

全般タブの設定

1.検索結果コンテンツ

• 検索するコンテンツの種類を選択します。デフォルトは空で、サイト全体が検索されることを示します。
• 例えば、動画コンテンツがポートフォリオタイプ（Portfolio）であれば、そのタイプのみを検索対象とするように指定できます。

2.ライブ検索を有効にする

を有効または無効にする。リアルタイム検索"をオンにすることを推奨する。オンにすると以下のオプションが表示される：

• ライブ検索最小文字数デフォルトは3。
• ライブ検索 投稿数デフォルトは100、10～500に設定可能。
• 注目画像の表示検索結果のサムネイルを表示するかどうか。
• 投稿タイプを表示する: コンテンツタイプのタグ（投稿、ページなど）を表示するかどうか。
• 検索対象を投稿タイトルに限定するタイトルだけを検索するかどうか（デフォルトはno、つまり全文を検索する）。

3. プレースホルダー

検索ボックスのテキストは、例えば、「ビデオを検索する」に設定することができます。

デザインタブ（スタイル外観）の設定

1.検索フォームのデザイン

ステップ： 検索 -> デザイン

オプションのスタイルは以下の通り：

• クリーン
• クラシック

ウェブサイトのスタイルに合わせて選ぶことができる。

2. フォントと色

• デフォルトのフォントサイズ 16px
• フォントカラーアバダのカラー7がデフォルトで使用される
• 背景色、ボーダー色、フォーカス色はすべて自由にカスタマイズ可能（Avadaカラー・プリセットを使用）

3. 角丸の半径

フィールドのボーダー半径のデフォルトは6pxで、わずかに丸みを帯びた効果になっている。

4. ライブ検索ドロップダウン・ボックスのスタイル

カスタマイズ可能：

• 背景色
• リンクカラー
• メタ情報の色（記事のカテゴリーなど）
• コンテナの最大高さ（例：500px）
• スクロールバーのスタイル（デフォルト、非表示、カスタム）

エクストラタブ（詳細設定）

検索バーにローディング・アニメーションを追加することができる：

• すべりこむ
• フェードイン
• ルンルン
• 倍率とその他7つの効果

アニメーションが必要ない場合は None に設定できる。

試験効果

1. ページを保存し、フロントエンドページを更新します。
2. 挿入された検索バーのエリアまでスクロールする。
3. キーワードを入力する。チュートリアル"または "ビデオ"）をクリックすると、リアルタイムの提案結果がドロップダウン表示されます。
4. Enterキーを押すと、WordPressの標準的な検索結果ページに移動します。

使い方の提案と練習のヒント

• コンテンツが記事、商品、ビデオなどのタイプに分かれている場合は 検索結果コンテンツ 検索タイプを正確にコントロール。
• ライブ検索を有効にすることで、インタラクションの感覚を向上させ、結果の最大数やトリガー文字数を適切に設定することをお勧めします。
• 検索ボックスはヘッダーまたはトップページの目立つ位置これは、訪問者のエンゲージメントを高めるのに役立つ。
• 検索バーは、レイアウトビルダーと連動して、ヘッダー、スティッキーバー、またはオフキャンバスエリアに追加できます。

概要

アバダ・サーチエレメントは強力で高度にカスタマイズ可能なコンポーネントで、ユーザーの検索体験を向上させるだけでなく、豊富なスタイリングとコンテンツ・コントロール・オプションにより、視覚的な統一性とインタラクションの最適化を可能にします。WordPressと アバダ・チュートリアルフォロー歓迎光子ゆらぎネットワーク実践的な日々の共有ウェブサイト構築のヒントウェブサイト最適化の経験