WordPressボタンブロックの使用方法

公開: 2021-08-29

Webサイトのボタンは、その外観と使いやすさにおいて重要な役割を果たします。これらは、訪問者がさまざまなページをナビゲートするのに役立ち、重要なアクション（コンテンツのダウンロードやニュースレターの購読など）を簡単に実行できるようにします。この重要な要素を挿入してカスタマイズするためのシンプルで効果的な方法があることが重要です。幸いなことに、WordPressのボタンは、缶の助けをブロックします。

この投稿では、WordPress Buttonsブロックを投稿やページに追加する方法と、その使用方法について説明します。それぞれの設定と構成オプションについて説明し、ブロックを効果的に使用するためのいくつかの最良のヒントを提供します。次に、よくある質問に答えて締めくくります。

始めましょう！

私たちのYoutubeチャンネルを購読する

ボタンブロックを投稿またはページに追加する方法

WordPressコンテンツにボタンを追加するには、最初に、ボタンを挿入する投稿またはページに移動します。次に、[ブロックの追加]アイコン（1）をクリックし、テキストフィールドで「ボタン」を検索して、[ボタン]オプション（2）を選択します。

WordPressにButtonsブロックを追加します。

テキストエディタに「/ buttons」と入力し、キーボードのEnterキーを押して、 Buttonsブロックを追加することもできます。ブロックを挿入すると、新しいツールバーメニューにアクセスできるようになります。これについては以下で説明します。

ボタンブロック設定とオプション

各WordPressブロックには、独自のコントロールと構成オプションのセットが付属しています。ボタンを追加するとき、それらをリンク、整列、およびスタイル設定するためのかなりの数のオプションがあります。まず、テキストとリンクの設定について説明します。

テキストとリンク

Buttonsブロックを最初に挿入すると、プレースホルダーコンテンツとともにデフォルトのボタンが追加されます。

WordPressボタンブロックの「テキストの追加」オプション。

テキストフィールドをクリックすると、ボタンに表示したいテキストに変更できます。たとえば、「詳細」などの召喚状（CTA）を追加できます。

2番目のツールバーオプションはリンクアイコンです。これを使用して、ボタンがユーザーを誘導する場所を決定できます。

WordPressボタンブロックをリンクします。

テキストフィールドに入力すると、リンクする内部ページを検索できます。外部ページのURLを入力またはコピーして貼り付けることもできます。次に、矢印アイコンを選択するか、 Enterキーを押してリンクを挿入します。

[新しいタブで開く]オプションを切り替えることもできることに注意してください。これにより、ユーザーが同じウィンドウ内で新しいページに移動するか、新しいタブで移動するかが決まります。

ボタンのフォーマット

ボタンのテキストを追加して適切なリンク先ページにリンクすると、フォーマットとカスタマイズを開始できます。まず、ツールバーに沿ったそれぞれのアイコンを使用して、ボタンのテキストを太字または斜体にすることを選択できます。

Buttonブロックのフォーマットオプション。

下矢印をクリックすると、いくつかの追加オプションも表示されます。たとえば、テキストの色を変更したり、下付きまたは上付きのテキストを含めたりできます。

スタイル、タイポグラフィ、色

ボタンをカスタマイズする最後のステップは、ボタンのスタイル、タイポグラフィ、色を選択することです。これはすべて、ブロックのサイドバーメニューのコントロールを使用して行うことができます。

WordPressでボタンのスタイルを設定するためのオプション。

使用できる2つのスタイルオプションは、塗りつぶしとアウトラインです。 塗りつぶしはボタンを単色にしますが、アウトラインはオプションの色付きの境界線を持つ透明なボタンを提供します。プレビュー付きのアイコンをクリックするか、[デフォルトスタイル]ドロップダウンメニューから目的の外観を選択することで、選択を行うことができます。

次に、[タイポグラフィ]セクションで、ボタンのテキストのフォントサイズを選択できます。

WordPressボタンのフォントサイズメニュー。

オプションの範囲は、極小から巨大までです。カスタムサイズを入力することもできます。

カラーパネルには、テキストとボタンの色を変更するためのオプションがあります。どちらの場合も、使用可能なオプションのリストから選択するか、カスタムシェードを選択できます。

WordPressボタンはカラーオプションをブロックします。

あなたの背景色のために、あなたはソリッドまたはグラデーションの間で選ぶことができますことに注意してください。

WordPressボタンブロックの色設定。

グラデーションを選択すると、さまざまなブレンドされたトランジションカラーから選択できます。カラースライダーを使用して、各色の普及率とグラデーションの方向を決定できます。

ボタンブロックを効果的に使用するためのヒントとベストプラクティス

WordPressサイトでボタンを使用する方法はたくさんありますが、CTAとして最も一般的に使用されています。これらには、訪問者に次のことを促すボタンを含めることができます。

続きを読む/詳細
今すぐ購入
ダウンロード
カートに追加
今予約する

CTAやその他の種類の重要なボタンを作成するときは、ページ上で目立つようにすることが重要です。そうしないと、訪問者がそれを見落とし、目的のエンゲージメントやコンバージョンのレベルが得られない可能性があります。

したがって、投稿やページに挿入するときは、WordPressに組み込まれているボタンスタイルオプションを利用することをお勧めします。たとえば、ボタンの背景色をテーマの背景とのコントラストが高い色合いに変更すると、テーマをより区別しやすくすることができます。

また、ボタンの配置について戦略的に考えるのは賢明です。通常、訪問者の目が自然に落ちるページのどこかにそれらを配置することは理にかなっています。たとえば、ユーザーに新しいページを紹介する準備ができたら、ブログ投稿の最後にボタンを追加できます。

ボタンの目的によっては、サイドバーにボタンを追加して、ユーザーがサイトを閲覧しているときに常に表示されるようにすることも意味があります。これは、[連絡先]または[購読]ボタンを作成する場合に特に適しています。

ボタンブロックに関するよくある質問

これまでに、 Buttonsブロックとは何かとその使用方法の両方をしっかりと理解しているはずです。ただし、すべての重要な情報を確実に網羅するために、このブロックに関して最もよくある質問のいくつかを確認しましょう。

WordPressのボタンブロックはどこにありますか？

このブロックは、ボタンを追加する投稿またはページ（またはウィジェット領域）に移動することで見つけることができます。次に、「/ buttons」を検索してEnterキーを押すか、[ Add block ]アイコンをクリックして、テキストフィールドで「buttons」を検索します。

ボタンの投稿とページブロックは何をしますか？

Buttonsブロックを使用すると、視覚的に区別できる方法で内部ページと外部ページにリンクできます。訪問者をWebサイトまたはサードパーティサイトの別のコンテンツに誘導するボタンを挿入し、好みに合わせてカスタマイズすることができます。

WordPressのどこにボタンブロックを追加できますか？

投稿やページにボタンを追加できます。さらに、ブロックエディタにアクセスできる場所ならどこにでも挿入できます。たとえば、これは、フッターまたはサイドバーにボタンを挿入できることが多いことを意味します（テーマのオプションによって異なります）。

結論

ボタンは効果的なウェブデザインの重要な要素です。彼らはあなたの訪問者を彼らが行きたい場所に導き、あなたがエンゲージメントとコンバージョンを増やすのを助けます。したがって、サイト全体にすばやくシームレスに挿入および編集する方法が不可欠です。

ご存知のように、 Buttonsブロックを使用すると、これらの要素をサイトに簡単に追加できます。ブロックを挿入すると、設定とコントロールを使用してその外観をカスタマイズし、訪問者がブロックをクリックしたときに送信される場所を決定できます。再利用可能なブロックにカスタムボタンを追加して、サイト全体で繰り返し使用することもできます。

Buttonsブロックの使用について質問がありますか？ 以下のコメントセクションでお知らせください！

RobinKhan / shutterstockによる注目の画像