
Webサイト制作所のWordPressテーマには、クリックデザインを自由に操る「ボタン」カスタムブロックが標準搭載。リンクボタンの色・形・アニメーションなどをブロックエディター上で簡単に設定でき、デザイン性と操作性を両立したサイトづくりを実現します。
カスタムブロックで作成できるボタンサンプル
光るボタン(1)
| 文字色 | カラーピッカーでカスタム可能 |
| 背景色 | カラーピッカーでカスタム可能 |
| 角丸 | 変更可能 |
| 横幅 | 変更可能 |
| エフェクト | 変更不可 |
光るボタン(1)
| 文字色 | カラーピッカーでカスタム可能 |
| 背景色 | カラーピッカーでカスタム可能 |
| 角丸 | 変更可能 |
| 横幅 | 変更可能 |
| エフェクト | 変更不可 |
影(1)
| 文字色 | カラーピッカーでカスタム可能 |
| 背景色 | カラーピッカーでカスタム可能 |
| 角丸 | 変更するとスタイルがくずれます |
| 横幅 | 変更可能 |
| 影 | 変更不可 |
影(2)
| 文字色 | カラーピッカーでカスタム可能 |
| 背景色 | カラーピッカーでカスタム可能 |
| 角丸 | 変更するとスタイルがくずれます |
| 横幅 | 変更可能 |
| 影 | 変更不可 |
影(3)
| 文字色 | カラーピッカーでカスタム可能 |
| 背景色 | カラーピッカーでカスタム可能 |
| 角丸 | 変更するとスタイルがくずれます |
| 横幅 | 変更可能 |
| 影 | 変更不可 |
ボタンの作成方法
STEP 1 ボタンブロックを呼び出す ブロックエディターの挿入したいところに「ボタン」ブロックを呼び出します
- 「ブロックを追加」を選択
- 「ボタン」ブロックを選択
STEP 2 ボタンを作成 テキストを入力し横幅や位置を設定
- ボタンのテキストを入力
- ボタンの横幅を設定
- ボタンの位置を設定
STEP 3 カスタム・リンク設定 ボタンをカスタムしてリンクを設定
- ボタンを自由にカスタム
- ボタンにリンクを設定
- ボタンが完成