あるワードプレス特に、プロモーション、オンラインコース、サービス、またはeBook、チェックリストなどの無料リソースを宣伝する場合、ウェブサイト構築プロセス中に通知バーを追加することは、ウェブサイトのコンバージョン率を高める効果的な方法です。使用方法ケイデンステーマでは、目を引く通知バーを簡単に設定することができます。
![画像 [1] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325140250217-image.png)
Kadenceテーマとプラグインのインストール
まずケイデンスKadenceは強力なカスタマイズ・オプションを提供しており、プラグインはKadenceのウェブサイトから購入することができる。ケイデンス・プロパッケージでより多くの機能を利用できる。
あるワードプレスバックエンドのプラグイン管理インターフェースで、"新しいプラグインを追加 "をクリックし、Kadence プレミアムプラグインをアップロード、インストールします。インストール後、プラグインを有効化し、ライセンスキーを入力します。
![画像 [2] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325102239140-image.png)
Kadenceテーマの要素オプションの有効化
あるケイデンス通知バー機能を有効にするには、テーマ設定の「要素を有効にする」オプションが必要です。以下はその手順です:
- " に移動します。外装状態">"ケイデンス".
- イネーブル"集合の要素「オプション
有効化されると、加盟店の設定に新しいオプションが追加されます。集合の要素".Add New Elementをクリックして、通知バーの追加を開始する。
![画像 [3] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325140529727-image.png)
通知バーのデザイン
使うケイデンス通知バーはカラムレイアウト機能でデザインされています。手順は以下の通り:
- 新しい要素を作成し、"固定"レイアウトでスティッキーな通知バーを作る。
![画像 [4] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325140734304-image.png)
- 2カラムレイアウトを追加し、Ready to Setボタンとカウントダウンブロックのサイズを変更する。
![画像 [5] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325140813653-image.png)
- サイトの全体的なスタイルに合わせて、背景色やフォントの色などを設定します。
![画像[6] - Kadenceテーマで通知バーを作成して設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325140913470-image.png)
セッティング後はこんな感じ:
![画像 [7] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325141310200-image.png)
通知バーにカウントダウンとテキストコンテンツを追加する
まず、背景色を設定し、カウントダウン・コンテンツを追加します。手順は以下の通り:
- クリックして新しいブロックを追加し、カウントダウンブロックを検索して選択します。
![画像 [8] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325141756716-image.png)
- 例えば7日間のカウントダウンなど、プロモーションのカウントダウンを設定する。
![画像 [9] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325141921382-image.png)
接頭辞付きテキストの追加
カウントダウンの前に説明文を加えるには、以下のようにする:
- カウントダウン・レイアウトで、先頭のテキストを検索して追加する。
- 25%割引で今年最高のオファーをお楽しみください。
![画像 [10] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325142103819-image.png)
- カウントダウンとテキストが同じ行に表示されるように、テキストをインラインモードに設定する。
![画像 [11] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325142141367-image.png)
![画像 [12] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325142159395-image.png)
文字色の調整
必要であれば、以下のようにテキストの色を調整して、背景と適切なコントラストになるようにすることができる:
- 行のレイアウト設定で、テキストの色を白に設定し、テキストがはっきりと見えるようにする。
![画像 [13] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325142302199-image.png)
これで、カウントダウンタイマーとテキストがオンデマンドで通知バーに表示されるようにセットアップが完了しました。
ボタン追加
通知バーには、プロモーションページやお問い合わせページへのリンクなど、ユーザーをさらなるアクションに誘導するボタンがあります。
- ボタンを追加し、ボタンのテキストを"今すぐ割引を受ける".
![画像 [14] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325142429335-image.png)
- ボタンの設定で、ターゲット・ページ(プロモーション・ページやコンタクト・ページなど)へのリンクを設定します。
![画像[15] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325142531700-image.png)
通知バーの位置を設定する
通知バーをページ上部に固定し、遅延表示距離を設定する。こうすることで、ユーザーがページをスクロールしても通知バーが表示されたままになります。
- エレメントの設定で、"トップ固定".
![画像 [16] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325142840259-image.png)
- 通知バーがページスクロールの一定距離後に表示されるように、遅延表示のピクセル値(100ピクセルなど)を設定します。
![画像 [17] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325142923821-image.png)
- 選択 "全ページに表示"をクリックすると、サイトのすべてのページに通知バーが表示されます。
![画像 [18] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325143005240-image.png)
通知バーの有効期限の設定
プロモーションが終了すると自動的に消えるように、通知バーに有効期限を設定することができます。これは期間限定のイベントに最適です。
- イネーブル"有効期限設定「オプション
![画像 [19] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325143120713-image.png)
- 通知バーの有効期限を設定します。例えば、7日後にプロモーションが終了すると、通知バーは自動的に消えます。
結果の公表と表示
すべての設定が完了したら、"ポスト"をクリックし、ウェブサイトの結果を確認する。ページをスクロールして、通知バーが上部に固定されていることを確認し、設定通りに正しく表示されていることを確認してください。
![画像 [20] - Kadenceテーマで通知バーを作成・設定する方法](https://www.361sale.com/wp-content/uploads/2025/03/20250325143230666-image.png)
概要
を使用します。ケイデンス高度なプラグインとケイデンス・ブロック通知バーは、強力で簡単に設定できる通知バーで、プロモーションの宣伝、ユーザー登録への誘導、その他の情報のプッシュ配信に使用できます。シンプルなセットアップステップにより、通知バーの作成は、コンバージョンを増加させ、イベントや購読サービスへのより多くの訪問者を引き付けるために、より効率的かつ効果的になります。
お問い合わせ |
---|
記事が読めない?無料でお答えします!個人サイト、中小企業サイトのための無料ヘルプ! |
① 電話:020-2206-9892 |
② QQ咨询:1025174874 |
三 Eメール:info@361sale.com |
④ 勤務時間: 月~金、9:30~18:30、祝日休み |
この記事へのリンクhttps://www.361sale.com/ja/47374
この記事は著作権で保護されており、必ず帰属表示を付けて複製してください。
コメントなし