Elementorを使用してWordPressにスクロールテキストを追加する方法

スクロールテキストは、訪問者の注意を引くための素晴らしい方法かもしれません。重要な更新、発表、または人々に見逃したくないオファーを強調するのに役立ちます。さらに、それはあなたのコンテンツをより魅力的にすることができるので、人々はそれを読むのが大好きです。

テキストのスクロールは、モダンに見えるだけでなく、簡単な情報を共有する方法を改善します。たとえば、スタイリッシュでダイナミックな方法で、壊れたニュース、プロモーションメッセージ、またはイベントカウントダウンを表示できます。あまりにも多くのスペースを占有することなく、サイトを新鮮でアクティブに保ちます。

Elementorは、最もユーザーフレンドリーなドラッグアンドドロップページビルダープラグインの1つであり、サイトで簡単にこれを行うことができます。このブログ投稿では、WordPress Elementorにスクロールテキストを追加する方法に関するステップバイステップガイドについて説明します。始めましょう！

WordPressのスクロールテキストとは何ですか？

WordPressのスクロールテキストは、水平または垂直に画面を横切って移動するテキストです。多くの場合、注意を引く方法でアナウンス、更新、またはその他の重要なメッセージを表示するために使用されます。販売、締め切り、または見出しを強調するために、ニュースWebサイトやeコマースストアで使用されているのを見たかもしれません。

テキストは動き続けているので、ユーザーはページを下にスクロールしなくても気づきます。 WordPressでは、プラグイン、テーマ、またはElementorなどのページビルダーを使用してスクロールテキストを追加できます。この効果を作成するためにコードを作成する必要はありません。組み込みのツールまたはアドオンを使用して、スクロールメッセージを設計するだけです。

WordPressにアニメーションテキストを追加する方法を学びます。

WordPressのスクロールテキストのユースケース

スクロールテキストを使用することは、エンゲージメントを後押しする素晴らしい方法かもしれない場所や状況がたくさんあります。以下では、あなたの理解のためにいくつかの一般的で実際的なユースケースをカバーしています。それらを探索するためにさらに数分かかります。

• 壊れたニュースや更新を表示します

時間に敏感なコンテンツを共有するニュースWebサイトまたはブログを実行している場合、テキストのスクロールは速報を示すのに最適です。また、新しく公開された投稿やトレンドトピックなどの更新を強調することもできます。

• オファーや割引を強調する

オンラインストアでは、スクロールテキストを使用して、特別な販売、クーポンコード、または限られた取引を促進できます。ホームページまたは製品ページの上部にある感動的なメッセージは、注意を高めることができます。

• イベントやウェビナーの発表

サイトがイベント、ウェビナー、またはオンラインコースを宣伝している場合、スクロールテキストを使用して、ページを重くすることなく、イベント名、日付、登録へのリンクを共有できます。

• 緊急通知またはアラートを表示します

学校、病院、政府ポータルなどのウェブサイトの場合、テキストのスクロールは、緊急時の更新、通知の閉鎖、またはサービスの中断を表示するのに役立ちます。

• 証言またはクライアントのフィードバックを特徴とします

また、スクロールテキストを使用して、スムーズでアニメーション化された方法で顧客のレビューまたは証言を表示することもできます。ウェブページにスペースを節約しながら、信頼を築くのに役立ちます。

• ソーシャルメディアや連絡先情報を共有します

スクロールテキストを追加して、WhatsApp番号、サポートメール、またはソーシャルメディアリンクを表示します。これにより、訪問者があなたに気づき、連絡しやすくなります。

ソーシャルメディア共有ボタンをWordPressに追加する方法を調べます。

Elementorを使用してWordPressにスクロールテキストを追加する方法

すでに述べたように、組み込みのElementorツールとアドオンを使用して、WordPressにスクロールテキストを追加できます。 HappyAddonsは、この点で使用できる素晴らしいアドオンです。

HappyAddonsには、Core Elementorプラグインを補完するためのウィジェットと機能の優れたコレクションがあります。 Core Elementorプラグインがデザインのニーズを満たすのに十分でないことがわかった場合、HappyAddonsはギャップを克服するのに役立ちます。

HappyAddonsにはテキストスクロールウィジェットがあります。これにより、ストレスせずにWordPress Webサイトにスクロールテキストを簡単に設計および追加できます。最も重要なことは、テキストスクロールウィジェットが完全に無料であることです。したがって、今日のプロジェクトには、ElementorとHappyAddonsの無料バージョンのみが必要です。

これらのプラグインがサイトで準備ができたら、以下に説明する手順に従ってください。

ステップ01：Elementor Canvasを使用してページを開きます

Elementor Canvasでページを開きます。新しいものをゼロから作成するか、テンプレートをインポートするだけです。

ステップ02：テキストスクロールウィジェットを追加する新しいセクションを作成する

目的の位置でプラス（+）アイコンをクリックして、テキストスクロールウィジェットを追加する新しいセクションを作成します。

新しいセクションの列構造を選択します。チュートリアルの単一列構造を選択しています。

新しいセクションのスペースが作成されたら、セクションにテキストスクロールウィジェットをドラッグアンドドロップします。

テキストスクロールウィジェットは即座にキャンバスに追加されます

ステップ03：スクロールタイプを選択します

ウィジェットには4つのスクロールタイプがあります。彼らです：

• 垂直線のハイライト
• 水平線のハイライト
• 垂直線マスク
• 水平線マスク

以下のビデオで、これらのタイプのそれぞれが選択されたときにどのように動作するかを見てみましょう。

チュートリアルには、水平線マスクを選択しましょう。

注：選択したテキストスクロールタイプに関係なく、スタイリライゼーションオプションはすべて同じになります。

ステップ04：テキストスクロールウィジェットを様式化します

[スタイル]タブに来てください。これらのオプションは、アライメント、テキストカラー、タイポグラフィ、テキストストローク、背景、マスキング不透明度、ラインパディングなどのタブに表示されます。

タブで利用可能なこれらのオプションを使用して、必要なスタイリズを自分で実行します。

必要なスタイリゼーションをウィジェットに追加したことがわかります。テキストの色、背景色、タイポグラフィ、テキストストロークなどを変更しました。

したがって、テキストスクロールウィジェットを使用して、必要に応じて魅力的なコンテンツを作成できます。

ステップ05：Webページにスクロールテキストを追加する

同様に、ウェブサイトに多くのスクロールテキストセクションを追加して、タイプを変更できます。インスピレーションについては、以下に添付されているビデオクリップをご覧ください。

垂直線のハイライト

水平線のハイライト

垂直線マスク

水平線マスク

チュートリアル全体を探索した後、スクロールテキストを作成することがどれほど簡単かを理解していることを願っています。現在、ElementorとHappyAddonsとWordPressで魅力的なスクロールテキストを作成する予定です。

WordPressのスクロールテキストのFAQ

このセクションでは、Google、オンラインフォーラム、ソーシャルメディアでよく見られるいくつかのよくある質問に答えました。

最終的な考え！

WordPressサイトにスクロールテキストを追加するのは小さな変更かもしれませんが、大きな影響を与える可能性があります。重要なメッセージにユーザーをフックできるだけでなく、メッセージをスタイリッシュに表示することもできます。 ElementorとHappyAddonsがあなたの指先にいるとき、これを作成するためにコーディングの専門家である必要はありません。

上から下までプロセスを理解できるように、最も簡単な方法でチュートリアルを説明するために最善を尽くしたことを願っています。ただし、長いブログの投稿を読むのが好きではない場合は、心配はありません！このトピックについてYouTubeでビデオチュートリアルを用意しています。

以下に埋め込まれたYouTubeビデオのチュートリアルをご覧ください。心に質問がある場合は、以下のコメントボックスに記載してください。可能な限り速い時間にあなたの質問に答えます。