多くのウェブサイトでは、セール、お知らせ、速報などの重要な更新情報を呼びかけるために、ページ上部にスクロールするテキストラインを使用しています。
この機能は、しばしばニュースティッカーと呼ばれ、レイアウトを占有したり訪問者の注意をそらしたりすることなく、重要なメッセージを見てもらうための簡単な方法です。
私たち自身もWordPressサイトでニュースティッカーを使用して期間限定オファーを宣伝したり、重要な更新情報を共有したりしており、ホームページを再設計することなく何かを強調したい場合に特に効果的です。
このガイドでは、WordPressサイトにスクロールするニュースティッカーを追加する方法をステップバイステップでご紹介します。
💡クイックアンサー：ニュースティッカーの追加方法
WordPressにスクロールするニュースティッカーを追加する最も簡単な方法は、Dittyプラグインを使用することです。プラグインをインストールし、テキストアイテムを追加し、「Ticker」表示タイプを選択して、生成されたショートコードをサイトのヘッダーまたはホームページに貼り付けるだけです。
スクロールするニュースティッカーとは？
ニュースティッカーとは、画面上を連続してスクロールする単一行のテキストです。
目を引く方法で小さな情報の断片を表示するのに最適な方法です。コンテンツは常にスクロールしているため、限られたスペースで多くの情報を表示できます。
ティッカーは通常、以下を表示するために使用されます：
これは、スティッキーフローティングフッターバーを使用する方法に似ています。
WordPressブログまたはウェブサイトにスクロールするニュースティッカーを追加する方法を見てみましょう。
WordPressにスクロールニュースティッカーを追加する方法
ニュースティッカーを作成する最も簡単な方法は、プラグインを使用することです。カスタムCSSはいくつかのカスタマイズを提供しますが、初心者向けではありません。
Ditty（旧称 Ditty News Ticker）をお勧めします。これは市場にある最高のWordPressニュースプラグインの1つです。
このプラグインを使用すると、ウェブサイトに移動、スクロール、スライドするコンテンツを追加できます。アニメーションの方向、間隔、速度、スタイルも変更できます。
まず、プラグインをインストールして有効化する必要があります。詳細については、WordPressプラグインのインストール方法に関する完全なガイドをご覧ください。
有効化したら、WordPressダッシュボードのDitty » Add Newに移動する必要があります。次に、「Add Default」ボタンをクリックします。
次に、ティッカーの最初のアイテムを作成できます。「Content」ボックスに、表示したいテキストを入力します。
お知らせや役立つ情報を共有することができます。たとえば、予定されているセールや最近の投稿について買い物客に知らせることができます。
ニュースアイテムにリンクを追加することもできます。これにより、人々はティッカーに表示されているページや投稿に簡単にアクセスできます。
これを行うには、「Link」フィールドにURLを追加します。
リンクタイトルを追加したり、URLをノーフォローとしてマークしたりすることもできます。
ティッカーを最大限に活用するには、複数のニュースアイテムを追加したい場合があります。「Update Item Settings」ボタンをクリックして、変更を保存します。
作成したばかりのアイテムを表示するようにプレビューが更新されます。
ティッカーに別のアイテムを追加するには、「Add Item」ボタンをクリックします。
次に、上記の手順を繰り返して、必要な数のニュースアイテムを追加できます。
アイテムに満足したら、順序を並べ替えたい場合があります。移動したいアイテムを掴んで、新しい位置にドラッグするだけです。
デフォルトでは、Dittyはアイテムをリストで表示します。
スクロールするティッカーを作成したい場合は、「表示」タブをクリックしてください。
この画面で、「タイプを変更」リンクをクリックします。
表示されるポップアップで、「ティッカー」を選択し、「タイプを更新」をクリックします。
WordPressウェブサイトで、ティッカーの外観と動作を変更できるようになりました。
これには、スクロール方向、速度、およびティッカーアイテム間の間隔の変更が含まれます。
タイカコンテナ、アイテム、タイトルなどのスタイルも選択できます。これらの設定のほとんどは自明なので、どのような変更を加えたいかを確認するために探索する価値があります。
チッカーの設定が完了したら、「Dittyを保存」ボタンをクリックします。
その後、ショートコードを使用してサイトにティッカーを追加する準備が整います。このショートコードを取得するには、「設定」タブをクリックします。
次に、「ショートコード」フィールドの値をコピーします。
ショートコードは、任意のページ、投稿、またはウィジェット対応領域に追加できます。ただし、ティッカーはサイトヘッダーまたはホームページの上部に配置すると最も効果的です。
ショートコードの配置方法の詳細については、ショートコードの追加方法に関するガイドを参照してください。
これが完了したら、変更を更新または公開するだけで、ティッカーがWordPressウェブサイトでライブになります。
🎁ボーナス：最大限の効果を得るためにスティッキーフッターバーを追加する
スクロールするニュースティッカーは、ローテーションするお知らせを強調するのに役立ちます。ただし、スティッキーなフローティングフッターバーと組み合わせることで、さまざまな目的で訪問者の注意を効果的に引きつけることができます。
フッターバーは、重要な静的情報を表示したままにします。ニュースティッカーは、タイムリーな更新が前面と中央にあることを保証します。
OptinMonsterのようなツールを使用すると、魅力的なフッターバーを作成し、ニュースティッカーと連携させて特別オファー、緊急ニュース、または人気の投稿を表示できます。
フッターは常にコールトゥアクションとして考え、ニュースティッカーは短期的な重要な更新情報を提供します。
これらの機能は連携してユーザーエクスペリエンスを向上させ、オファーや重要なコンテンツとのタイムリーなエンゲージメントを促進することで、コンバージョン率を高めることができます。
開始するには、WordPressで「スティッキー」フローティングフッターバーを作成する方法に関するチュートリアルをご覧ください。
スクロールニュースティッカーに関するよくある質問
WordPressにスクロールニュースティッカーを追加することについて、読者からよく寄せられる質問を以下に示します。
WordPressにスクロールニュースを追加するにはどうすればよいですか？
スクロールニュースを追加する最良の方法は、Dittyのような専用プラグインを使用することです。プラグインをインストールし、新しいティッカーアイテムを作成し、生成されたショートコードを使用して投稿、ページ、またはサイドバーにニュースフィードを表示できます。
WordPressにスクロールテキストを追加するにはどうすればよいですか？
モバイルデバイスで機能するようにするには、プラグインを使用してスクロールテキストを追加する必要があります。古いHTML<marquee>タグは時代遅れであり、最新のWebブラウザで正しく表示されない可能性があるため、使用しないことをお勧めします。
WordPressでスクロールバーを追加するにはどうすればよいですか？
サイトにテキストのスクロールバー（ティッカー）を追加したい場合は、このガイドで示されているようにDittyプラグインを使用できます。ナビゲーション用のカスタムスクロールバーや読書進捗バーを追加したい場合は、Worth The Readのような別のプラグインが必要になるでしょう。
このチュートリアルが、WordPressでスクロールするニュースティッカーを追加する方法を学ぶのに役立ったことを願っています。また、訪問者が戻ってきたときに新しい投稿を強調表示する方法を学ぶか、最高のWordPressサイドバートリックの専門家による選択肢を確認することもできます。
この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。
イジー・ヴァネック
この記事をありがとうございます。1年間悩んでいた問題を解決するのに役立ちました。ブログを持っていて、いわゆるマイクロブログを追加したかったのです。これは、新しい開発に関する非常に迅速で簡潔な更新を投稿できるウェブサイトの小さなセクションです。しかし、現在、マイクロブログ専用のプラグインはありません。この方法は、ついにマイクロブログの問題に対処し、サイトに迅速で短い更新を追加するために必要な方法です。1年後に実用的なソリューションを見つけられて興奮しています。素晴らしいです！
kzain
リンクの外観を調整したいと思っていて、この記事でとても簡単にできました。カスタムオプションは私の基本的なニーズに最適でしたが、より高度な変更のために CSS メソッドを覚えておく価値はあります。
リンクの色がウェブサイトの他のデザインとよく対照されるように、カラーパレットツールを使用することを検討してください。
Lin
ウェブサイトが2つあります。一方のサイトに、もう一方のサイトを反映するティッカーを追加できますか？
WPBeginnerサポート
ティッカーは他のサイトに情報を送信しませんが、同じ情報をティッカーに追加することは確かに可能です。
管理者
karbhari
メインページでヘッダーの後に表示されるスクロールニュースに「最新ニュース」というタイトルを追加するにはどうすればよいですか？
アンナ・スー
ティッカーのテキストはどこに入力しますか？私のインストールでは、スクリーンショットにある項目の一部が表示されません。
アンナ・スー
これが私が欲しいティッカーかもしれませんが、多くのオンラインプラグインのビデオと同様に、あなたが話すのが速すぎて指示を理解できませんでした。
H.M.Mohiuddin
プラグインを使わずにニュースティッカーを追加するにはどうすればよいですか
plazma
動的ではありません。
felix
スクロールニュースに「最新ニュース」というタイトルを追加するにはどうすればよいですか？サイトには表示されていますが、最新ニュースなのか最新アップデートなのかなどを追加する場所が見つかりません。
hosam abdallah
とても良いプラグインですが、質問があります。
テーマ作成にArtisteerを使用していますが、ウィジェットにPHP関数を追加するにはどこに追加すればよいか教えていただけますか？
この中で、またはどこからテーマに追加すればよいですか？
アブドゥルムミン
こんにちは、直接機能を追加するにはどうすればよいですか？直接機能を追加する手順を教えてください。
ショートコードを「会社概要」ページに追加したところ機能しましたが、「ホームページ」に追加したところ機能しませんでした。アドバイスをお願いします。
WPBeginnerサポート
記事の最後のスクリーンショットに示されているダイレクト関数をコピーし、テーマのhome.phpまたはheader.phpに貼り付けます。ニュースティッカーを表示したい場所に貼り付けます。
管理者
スジャニ
こんにちは、
指示を明確にいただきありがとうございます。ショートコードとダイレクト関数はどこに配置すればよいかという質問があります。
投稿/ページに配置しますか？
ありがとうございます、
スジャニ
WPBeginnerサポート
投稿/ページ/ウィジェット用のショートコード、またはテーマのテンプレートファイルに直接コードを記述したい場合の直接関数。
管理者
Peter Johnson
素晴らしいテーマのようですね。私は PHP 開発者ではありませんが、このテーマを使用して WordPress ブログに統合したいと考えています。テレビのスライドショーのように、最新ニュースをメインメニューの上または下に表示するには、ブログでこのテーマをどのように使用できるか説明していただけますか。手順が必要です。
ありがとう
Mackenzie
ありがとうございます、とても良いチュートリアルです。