Lightningで音楽フェスのランディングページ（LP）を作れるかやってみた

こんにちは！ベクトルスタッフのササキです。

昨日のちあきさんの記事「2023年はアジアにちょっと幅を広げてみたベクトルのお話」はもう読まれましたか？2023年の今年、ベクトルチームが日本から飛び出し、アジアで活動してきたあれこれを振り返っています。ぜひ読んでくださいね。

続いて今回の記事では、WordPressのテーマ「Lightning」を使って、架空の音楽フェスのランディングページ（LP）を作ってみたお話をまとめてみました！趣味全開です。

この記事を読んで、自分でもやってみようかな？となったとき。環境の準備については、2022年のアドベントカレンダーの以下の記事を参考にしてください。Lightning でランディングページ（LP)を作るときの手順を、初心者さん向けに書いています。

完成イメージ

以下の動画でぜひご確認ください。

プチ解説

どのパターンや機能を利用したのか？について、簡単に紹介していきます。

ヘッダーとヒーローエリア

まず、ヘッダーは透過にしています。プラグイン「Lightning Pro Unit」の機能を利用すると簡単です！

次に、ヒーローエリアの画像は、WordPress標準のカバーブロックを。カバーブロックなら動画も簡単に配置できます。

日付の部分は、以下のパターンから利用しました。こういうのを自分で組むと、バランスとか調整に手間がかかります。パターンならコピペして書き換えるだけ。

ARTISTS

ヘッドライナー2組にはこのパターンを利用しました。

ほかの出演者はこのパターンを利用しました。業種が全然違うパターンでも「これ使えそう！」と思ったら、ぜひ試してみてください。

TIMETABLE

フェスじゃなくてイベント系なら、こっちのパターンが使いやすいですよー

ACCESS

交通案内図を少しアレンジして利用しました！線のスタイルを変更するには、以下のようにします。

TICKETS

チケ代高い…！以下のパターンを利用しました。

INFO

以下の会社案内のページから、地図を含むカラムのパターンを利用しました。

NEWS

ここは、VK Blocks Pro の投稿リストブロックを利用しました。

フッター

このLP下部のフッターの部分だけ利用しました！

まとめ

いかがでしたか？あなたも架空の音楽フェスのサイトを作って、部屋でひとりニヤニヤしてみませんか？

最後に。パターンは複数のブロックを組み合わせているため、入り組んだ構成になっているものもあります。
作業中に、今どのブロックを選択しているのかは、編集画面最下部でわかります。また、ぜひリストビューを確認してみてください。「すごい！こんな風に組んでるの？！」って新しい発見があるかもです。

明日は、ベクトルスタッフのDRILL LANCERさん、が記事を書いてくれます！「Lightning G3 Three Column Unit をアップデートした話」とのことで、お楽しみにー！