サムネイル

Shopifyでランディングページ(LP)を作成する方法は3種類!アプリの使い方も解説

目次

Shopify でランディングページ(LP)を作成する方法は 3 種類!アプリの使い方も解説

ランディングページとは以下のようなもので、検索結果や広告などを経由してユーザーがはじめて着地する(Land)ページのことを指します。LP は Landing Page の略称です。

LP 例1
LP 例2

Shopify では、ランディングページ(LP)を商品ページや割引ページ、コレクションページなどにするといいかと思います。

今回の記事は、以下の記事を参考にしています。

Shopify でランディングページ(LP)を作成する方法を徹底解説

Easy LP 公式サービスページ

Shopify でランディングページ(LP)を作成する方法

Shopify でランディングページ(LP)を作成する方法としては、以下の 3 つが挙げられます。

  • Shopify 内で簡易的に作成する
  • コーディングでいちから作成する
  • アプリを導入する

Shopify 内で簡易的に作成する

まず、Shopify 内で簡易的なランディングページ(LP)を作成する方法について説明します。この方法は無料である点がメリットですが、手の込んだものは作れない点はデメリットといえるでしょう。

ストアの管理画面でオンラインストア>ページとクリックし、右上に表示されるページを追加をクリックします。
ページを追加をクリック

すると、以下の画面になるので、画像やキャッチコピーの設定、ボタンの追加などをしてランディングページを作成していきます。
ランディングページを作成

ウェブサイトの SEO を編集するをクリックすると、ページタイトルや説明文などを入力できます。ここでランディングページにおける検索エンジンの最適化(SEO)を図ることが可能です。
ウェブサイトの SEO を編集するをクリック
ページタイトルや説明文などを入力

コーディングで 0 から作成する

コーディングでランディングページを作成する場合、Liquid の知識が必要になります。

自身に Liquid の知識があるか、専門の開発者を雇うかすれば、デザインや機能の充実した高度なランディングページ(LP)を作成できるのがメリットです。

ただし、手間がかかる点や、専門の開発者を雇う場合にはコストがかかる点はデメリットといえるでしょう。

アプリを導入する

最後に、ランディングページ(LP)を作成できるアプリを導入する方法です。

アプリを利用すると、Shopify 内の簡易的なものより本格的に、コーディングで一から作成するより手軽にランディングページを作成できるのがメリットです。

月額料金がかかる点はデメリットですが、初期費用はかからないため比較的導入しやすいでしょう。

Shopify で使いやすいランディングページ(LP)の作成アプリはどれ?

Shopify でランディングページ(LP)を作成できるアプリとしては、Shogun や PageFly があります。しかしどちらも英語表示のため戸惑うケースもあるかもしれません。

そこで、今回は多くの人にとって使いやすいと考えられる、日本語に対応したランディングページ(LP)の作成アプリを使って解説していきたいと思います。

今回使用するアプリは以下の通りです。
らくらく画像ランディングページ | リテリア Easy LP

アプリの特徴は以下の通りです。

  • ノーコードで画像 LP を簡単に作成できる
  • ボタン LP や動画 LP も使える
  • 管理画面は日本語に対応
  • 操作に迷ったら日本人エンジニアの手厚いサポートが受けられる

月額料金は 14.99 ドルで、今現在は 7 日間の無料体験があります。

らくらく画像ランディングページ | リテリア Easy LP の使い方

アプリのインストール方法や使い方を確認していきましょう。

アプリのインストール方法

ストアの管理画面でアプリ管理>ストアをカスタマイズとクリックします。
ストアをカスタマイズをクリック

Shopify のアプリストアに移動するので、検索ボックスにらくらく画像ランディングページ | リテリア Easy LPと入力して検索しましょう。
らくらく画像ランディングページ | リテリア Easy LPと入力して検索

該当のアプリをクリックします。ここでは最上段の右側に表示されていました。
該当のアプリをクリック

アプリを追加する>アプリをインストールとクリックしていきます。ここまででアプリのインストールは完了です。
アプリを追加する>アプリをインストールとクリック
アプリをインストール後の管理画面

次に、テーマに反映の項目でアプリをインストールするテーマを選び、有効化をクリックします。

ここでは「Studio(公開中のテーマ)」を選択して有効化しています。
有効化をクリック

アプリを有効化しましたのポップアップがでればアプリの設定は完了です。

次に、有効化ボタンの隣にあるプレビューボタンをクリックしましょう。
プレビューボタンをクリック

ストアが表示されるので、画面の一番上・真ん中にあるボックスをクリックし、商品ページをクリックします。
画面の一番上・真ん中にあるボックスをクリック
商品ページをクリック

ここではデフォルトの商品をクリックします。
デフォルトの商品をクリック

デフォルトの商品ページに移動するので、下の方までスクロールするとLP 画像のアプリボックスが追加されています。
商品ページ
LP 画像のアプリボックスが追加

ランディングページ(LP)の作成方法

ここからは、簡単にランディングページ(LP)を作成してみたいと思います。

画面右側にあるLP 画像の詳細設定の項目を見ていきましょう。
LP 画像の詳細設定の項目

画像を選択をクリックし、無料の画像から選択するか画像をアップロードするかして、選択するをクリックします。
画像を選択をクリック
選択するをクリック

ランディングページ(LP)のメイン画像が表示されました。
(LP)のメイン画像の表示

画面右側の項目で、画像の下にある代替テキストを追加するをクリックして画像の alt 属性を入力しておくと、検索エンジンの最適化(SEO)に有効です。
代替テキストを追加するをクリック

そのほか、パソコン・スマホそれぞれで上下の余白を調整できます。
パソコン・スマホそれぞれで上下の余白を調整

動的ソースの挿入も可能です。
動的ソースの挿入

なお、ストアの画面上でセクションを追加をクリックすると、以下のメニューが使えます。

  • LP ボタン
  • LP 動画
  • LP 画像
  • ヘッダーを消すためのブロック
    セクションを追加をクリック
    追加できるセクション一覧

まとめ

Shopify でランディングページ(LP)を作成する方法としては、以下の 3 つがあります。

  • Shopify 内で簡易的に作成する
  • コーディングで一から作成する
  • アプリを導入する

今回は、より本格的に、より手軽にランディングページを作成する方法として「アプリを導入する方法」を選び、解説してきました。

使用したアプリは以下の通りです。
らくらく画像ランディングページ | リテリア Easy LP

日本語対応のアプリはやはり使いやすいなと思いました。ここまでお読みいただき、ありがとうございました。

最後に、改めて参考記事を貼っておきます。

Shopify でランディングページ(LP)を作成する方法を徹底解説

Easy LP 公式サービスページ

おすすめ Shopify アプリ

シンプル外部購入リンク|お手軽アフィリエイト対応のアイコン

シンプル外部購入リンク|お手軽アフィリエイト対応

Amazon・楽天など、実際に販売している場所へご案内。商品ページをカタログとして活用できます。

シンプル画像レイアウト|お手軽フォトギャラリー&グリッドのアイコン

シンプル画像レイアウト|お手軽フォトギャラリー&グリッド

グリッド・メイソンリー・カルーセル・モザイクの画像ギャラリーを作成。商品ホットスポットも設置できます。

シンプルチェックアウトリンク|広告・メール・DMから直接購入のアイコン

シンプルチェックアウトリンク|広告・メール・DMから直接購入

商品と割引を適用済みのリンクを作成し、お客様をそのままチェックアウトへご案内します。

シンプル関連商品レコメンド|よく一緒に購入されている商品のアイコン

シンプル関連商品レコメンド|よく一緒に購入されている商品

関連商品を一覧からまとめて設定。買い手はセットをワンクリックでカートに入れられます。

シンプル税込税抜併記|消費税込み・税別表示・軽減税率にも対応のアイコン

シンプル税込税抜併記|消費税込み・税別表示・軽減税率にも対応

商品価格に、税込と税抜のもう一方を並べて表示できます。軽減税率が混ざるお店でも、商品ごとに正しく計算します。

シンプル原産国表示|お手軽製造国・原産地ラベルのアイコン

シンプル原産国表示|お手軽製造国・原産地ラベル

商品ごとの原産国を、国旗つきのバッジで商品ページに表示できます。国はリストから選ぶだけなので表記ゆれもありません。

シンプル商品単価表示|お手軽単位価格表示のアイコン

シンプル商品単価表示|お手軽単位価格表示

「100gあたりいくら?」を、販売する国ごとに見慣れた単位で表示できます。商品ページ・商品カード・カートで、お客様が価格を比べやすくなります。

シンプル追従電話ボタン|お手軽お問い合わせ・電話サポートのアイコン

シンプル追従電話ボタン|お手軽お問い合わせ・電話サポート

電話・LINE・WhatsAppのボタンをストアの全ページに置けます。「買う前にちょっと聞きたい」お客様をそのまま逃しません。

関連記事