有料テーマ「lightning pro」の使い方を解説するシリーズです。
今回は、テーマに付属のプラグイン「VK Blocks Pro」を導入すると使えるブロック「ボタン」の使い方を解説します。
ブロック「ボタン」の使い方
プラグイン「VK Blocks Pro」を導入してリンクボタンを作るには、VKブロック内の「ボタン」を利用します。
STEP1
![](https://komatoki.com/wp-content/uploads/2020/10/bd8acd49725acf78703e6f7471373e0e-1024x736.jpg)
プラグインに「VK Blocks Pro」がインストールされていること、有効化になっていることを確認します。
STEP2
![](https://komatoki.com/wp-content/uploads/2020/10/3b81655b1787f6231c7dbfbb84b38f45-1024x739.jpg)
⊕ブロックの追加より、VKブロック内の「ボタン」を選択します。
STEP3
![](https://komatoki.com/wp-content/uploads/2020/10/486b4a5835f80d4c1e295760017691b6-1-1024x737.jpg)
ボタンのボックス内をクリックして、テキストを入力します。
STEP4
![](https://komatoki.com/wp-content/uploads/2020/10/78b01e0abc764b266adef91db9b43cb7-1024x734.jpg)
右サイドバー内でボタンの様々な設定が簡単にできます。
「サブテキスト」「ボタンURL」「リンクを別ウィンドウで開く」
「ボタンサイズ」「ボタンの位置」「ボタンスタイル」を設定しました。
STEP5
![](https://komatoki.com/wp-content/uploads/2020/10/5f06b9eddafac494f293b51edce85b89-1024x716.jpg)
右サイドバー内、さらに下へ進むと
「文字色」と「アイコン」の設定もできます。
アイコンは”アイコンを選択”をクリックして図柄を選びます。
文字の前または文字の後、片方だけ、両方にも設定できます。
※STEP4のボタンスタイルで”背景なし”を選択した場合、文字色は、
カスタムカラーから選択してください。
プレビュー画面
![](https://komatoki.com/wp-content/uploads/2020/10/9b3f11af932405b62a5e19f78fc20771.jpg)
実際の表示が確認できます。
(プレビューで表示される画面)