yotigory ノリと勢いだけで Vektor WordPress Solutions Advent Calendar 2021 に参加を決めたのですがw、書きます！
内容は、今年開催したイベント「Lightning と Shifter でランディングページを作ろう！」の書き起こしになります。イベントレポート書いてなかったので…(〃▽〃)
この記事は「Vektor WordPress Solutions Advent Calendar 2021」の12月21日の記事になります。
前回のAkira Hashizumeさんの「エンドユーザー3人に訊いた、VK Blocks Pro「投稿リスト」の推しポイント！」の記事に引き続き「Lightning」を使ってLPをどうやって作ったの？をざっくり説明しつつ、テーマのカスタマイズの良さと楽しさについて書きたいと思います。
テーマ「Lightning」をベースに作ったページがこちら！
WordPress のための Jamstack ホスティングプラットフォーム
どこに「Lightning」の要素があんねん…と思われた方も多いと思いますが、ちゃんとテーマを活かして作っているんですよ〜！
では、説明していきましょう。
「Lightning」の何を使ったの？
テーマの基本設定を有効活用！
ページレイアウトやデザイン、サイト情報の基本を設定しました。
サイトのタイトル、キャッチフレーズ、ヘッダーロゴのセットから始まり、デザインの基本的な、カラー、ページ全体のフォントやサイズ。
レイアウトでは、コンテナの幅や固定ページの余白設定。ヘッダーの上部は表示させずすっきりと、フッターカラムは１カラムに、モバイルナビのメニューボタンの位置は右に設定しました。
ささーっと書いちゃってますが、これイチから自分でやるとなると超めんどくさいじゃないですか、画面ポチでできるここの手軽さよ！！ステキ！
メニューも使っていますよー！
ランディンページを作るのに、テーマいる？と思われた方も多いかもしれませんが、決め手となったのはデザインにヘッダーとフッターがあったということです。
メニューの位置やレスポンシブの対応をテーマ側にお任せしたい…という思いがありました。
ヘッダーメニューは、既存のものに中身を変更し、フッターの場合は「フッターウィジェットエリア１」を使って中身を入れました。
ウィジェットはバージョンが上がってガラリと雰囲気が変わりましたが、割となんでも放り込めるので私は好きですw
↓CSSを当てて調整した出来上がりがこちら。
「よくある質問」は、VKBLOCKS のアコーディオンで。
CSS を上書きしてデザイン変更していますが、最初から枠も動きも作ってあるしきちっと class を設定してくれているので、CSS書くだけです！
CSSを書くだけですw！！！（大切なことは二度言うやつ
インストールしたプラグインは？
実は、ほぼほぼ入れていませんw。
◯テーマ関連
- lightning-g3-pro-unit.zip
- VK Blocks Pro
- VK All in One Expansion Unit
- VK Block Patterns
◯制作関連
- Advanced Editor Tools (旧名 TinyMCE Advanced)（テーブルの装飾）
- SVG Support（SVG を使用）
どうやってカスタマイズしたの？
子テーマを使いました。
詳しい使い方が、ベクトレ（Vektor Training）のサイトにありますね。迷うことなし！
カスタマイズの準備 1 : Lightningの子テーマの準備
今回、見た目が大きく変わっていますが、めちゃくちゃに CSS を書いたわけではありません。
ブロックエディターの恩恵が大きいですね、必要な class を追加して装飾用に CSS を書いたというイメージです。
もちろん JavaScript なんて一切書いてませんから、すごいことです。
今までサイトを制作するにあたって、当たり前のように JavaScript でアコーディオンやタブ、グローバルメニューなどを実装してきましたが、テーマ側であらかじめ用意されているの最高！！
functions.php はほんのちょっとだけ書きました。
コピーライトのところ、画像にしてリンクを貼りたかったのでそこだけかなー
マニュアル要らず！
今回作ったパーツ群はすべて VKブロックパターンに追加しました。
こうやってパターン登録しておけば、投稿や更新する時にいつでも表示・非表示できますし、うっかりページから消してしまっても安心です。
またマニュアルを作って、ここをこうしてくださいっていう手間も省けますし、自分のうっかり忘れ防止のためにもこれはやっとくべきかなと。
テーマのカスタマイズいいよね！
私は CSS を書くのが好きなので、今回のカスタマイズは本当に楽しいものでした！
テーマをイチから作るっていうのは、毎回同じことの繰り返しが多く（まぁオレオレ基本セットをみんな準備してると思うけど）そこを全てお任せして自分の好きなことに専念できるのはいいことです。
ただ進化が早いので、私の頭がついていかねぇぇということはありますがw、そこはコミュニティの Slack やフォーラム、勉強会などを利用して楽しみつつ自分もアップデートしていきたいですね！
来年も、どーぞよろしくお願いします！！