ボタンは小さなもののように見えるかもしれませんが、あなたのウェブサイトでは大きな力を発揮します。ボタンは、訪問者をあなたの望む行動へと導く最もシンプルな方法のひとつです。
製品ページへの誘導から、続きを読むやサインアップを促すまで、見栄えの良いボタンはあらゆる違いを生み出します。良いニュースは、デザインにコーディングのスキルは必要ないということです。
WordPressには組み込みのオプションがあり、ブロックプラグインの助けを少し借りることで、ボタンの見た目をさらにコントロールすることができる。
この記事では、WordPressでスタイリッシュなボタンを作成する3つの簡単な方法をご紹介します。
デフォルトのエディターから始まり、より柔軟性のあるプラグインを紹介し、最後にテーブル内にボタンを追加するボーナスメソッドを紹介する。さあ、飛び込もう。
美しいテーブルを作る
ブロックエディター付き
方法1：デフォルトのボタンブロックを使う
WordPressには、ほとんどのケースで問題なく動作するButtonsブロックが組み込まれています。ブロックエディターで小さな（+）アイコンをクリックし、"Buttons "を検索すると見つかります。
ボタンブロックが挿入されると、ボタンの中にテキストを追加するように指示されます。
ブロックを挿入すると、1つまたは複数のボタンを並べて追加できます。各ボタンは右サイドバーから直接カスタマイズできます。以下のオプションがあります：
- ボタン幅（フルまたはオート）
- テキストと背景色
- パディングとアライメント
- ボーダー半径（角丸用）
特にミニマルなデザインにこだわるのであれば、良い出発点となるだろう。⚠️しかし、ホバー効果、グラデーション、レスポンシブ・スペーシングなど、より多くのスタイリング・オプションが必要な場合は、すぐに限界に達するだろう。
🛠️ プロのアドバイス 完璧な丸みを帯びたボタンにしたいですか？ボーダー半径を 100 ピル式ボタン
方法2：Ultimate Blocksのボタンブロックを使う
CSSを書かずにもっとコントロールしたい場合、 アルティメット・ブロック は試してみるべき素晴らしいGutenbergプラグインだ。このプラグインは ボタン・ブロック カスタマイズを念頭に置いて作られている。
アルティメット・ブロックの設置は簡単だ。
-
に移動する。 プラグイン
-
プラグインの追加をクリックする
-
"Tableberg "で検索
-
Click インストールそして アクティベート
その後 アルティメット・ブロックのインストールと有効化 ボタン（アルティメットブロック）」ブロックを追加する。
アルティメット・ブロックのボタンを挿入するには、小さな（＋）アイコンをクリックし、"ボタン（改良版）"を検索する。