【Shopify】特集ページを簡単にノーコードで作成！（PageFlyの使い方）

サイトの中におしゃれなLPを作成したい！どうすればいいの・・？

LPとは、広告などを経由して訪問者が最初にアクセスするページのことです。

例えばSNSの広告などをクリックすると、縦長のページに遷移し、知りたい情報が1ページに集約されていますよね。このページをLPと言い、商品の特集ページなどに用いられます。

ウェブサイトのトップページではなく、より商品・サービスの訴求に特化したLPに遷移させることで、購入や資料請求などのCV率をアップさせることが可能です。

しかし、LPは他ページに遷移させるのではなく１ページで購入・資料請求などまで完結することに特化している上、ブランディングとしても使用しているページですので、ユーザーの印象に残るようデザイン性が高いものが必要です。

Shopfyの基本機能でページ作成することも可能ですが、デザインのテンプレートはありません。そのため、１から画像・文字のレイアウトを考えなければいけなかったり、位置をずらそうと思うとコーディングの知識が必要だったり・・結局文字と画像を並べただけになりがちです。

今回ご紹介する「PageFly」アプリは、このような特集ページなどのデザイン性の高いLPを、ノーコードで作成したい方向けに作られたアプリなんです！

ちなみに、shopifyの基本機能で作成したLPとPageFlyを使って作成したLPの差はこんな感じです。

左がshopifyの基本機能で作成したLP、右がPageFlyで作成したLPです。

どちらもコーディングなしで作成していますが、デザイン性・訴求力の差は歴然ですね。

そのため、この記事は、以下のような方にぴったりの記事です！

では、実際にどのようにPageFlyでLPを作成するのかを見ていきましょう。

PageFlyの概要・料金

料金形態の概要は以下の通りです。

※2022年12月現在

管理画面は日本語対応していますし、豊富なデザインテンプレートからお好きなデザインを選択・編集できます。

そのため、コーディングなしで簡単におしゃれなLPを作れるというわけです。ストアのレビューが多いのも納得ですね。

無制限プランは他のプランと若干機能が異なっており、ページの最適化と優先的なサポート（ライブチャット・ビデオコール）が追加されています。

逆に言うと、無制限プラン以外はプランによって機能差分がなく、１ページまでなら無料でフル機能を試すことができるので、ぜひ、実際に試してみていただくことをおすすめします！

LP作成前の準備

LPの作成前に、アプリのインストールと言語設定をしておきましょう。

・shopifyストアサイトからPageFlyをインストールします。

・管理画面>「設定」>「User Interface」から言語を日本語に設定します。

準備はこれで完了です。

LP作成手順概要

大まかな流れとしては、

①デザインテンプレートの選択

②セクションを作成し、テンプレートに挿入

③テンプレートを編集し、セクションの順番などを適宜変更

という３つのステップで作成していきます。

では順番に手順をみていきましょう。

①デザインテンプレートの選択

・管理画面>ページより、作成したいページの種類を選択します。

　ページには以下の種類があり、LP作成後にページの種類を変更することもできます。

　今回は基本的なLPとしてレギュラーページを作成します。

ページの種類一覧

レギュラーページ　：基本的なLP。作成後はshopifyの「ページ」で管理できます。

ホームページ　　　　　　：おしゃれなホームページを作成したい時はこちらを選択。

商品ページ　　　　　　　　　：商品にピックアップしたLPを作成したい時はこちらを選択。作成後は任意の商品ページ（商品を選択した時のページ）に適用できます。

コレクションページ：コレクションにピックアップしたLPを作成したい時はこちらを選択。作成後は任意のコレクションページに適用できます。

ブログ記事ページ：おしゃれなブログページを作成したい時はこちらを選択。作成後はshopifyの「ブログ記事」で管理できます。

パスワードページ　：サイトにパスワードをかけた時の、パスワードを入力するページを作成したい時はこちらを選択。

・「テンプレートから作成する」を選択し、好きなデザインテンプレートを選択します。

　かなりの数のテンプレートがありますので、サイトのデザイン・コンセプト・訴求したいイメージにあったテンプレートを選択しましょう。

②セクションを作成し、テンプレートに挿入

LPを分解してみると、実は色々な要素が重なっています。

この要素のことをPageFlyではセクションと言い、セクションを並べることで１枚のLPを作成します。

それではセクションを作成しましょう。

・管理画面>左メニューの「セクション」>「新しいセクションを作成する」>「テンプレートから新しいセクションを作成する」を押し、テンプレートを選択します。

・テンプレートをカスタマイズします。画像などを差し替えたり、文字の大きさを変えたい箇所を選択すると、変更できます。

　また、左のメニューから画像・文章などの要素の追加や、shopifyで登録した情報の呼び出しができます。編集が完了したら保存＋公開して完了です。

　また、Googleフォントの中からであれば、日本語の別のフォントに変更することもできます。

　※Googleフォントの日本語一覧：https://googlefonts.github.io/japanese/

　フォントの種類はあまり多くありませんが、使いやすいフォントが多いです。shopifyは英語対応が主なので、おしゃれな日本語フォントの方がデザイン性高くおすすめです。また、他のページとフォントを合わせたほうがサイトに統一感が出るので、フォントは揃えましょう！

　フォントを変更したい文字を選択し、フォント>「グローバルスタイルを編集」>右の検索バーからフォントを検索・設定できます。

テンプレートを編集し、セクションの順番などを適宜変更

セクションを作成したら、テンプレートに挿入しましょう。

・管理画面>「ページ」より、作成中のページを選択します。

・挿入したい箇所にカーソルを合わせ「＋」のマークが出てきたら、保存済みのセクションを選択し、挿入します。

セクションの順番を変更したい時は、セクションの左にある点が集まったマークを押しながら、ドラッグするだけです。

　※今回はLPが複雑な場合を想定してセクションを作成してみましたが、要素が少ないなどあまり複雑でなければ、セクションを作らずテンプレートを直接編集して画像やレイアウトなどの要素を追加することもできます。

LPの公開

LPが作成できたら、サイトに公開しましょう。

・管理画面>ページ>歯車マーク「ページ設定」、またはテンプレートの右上の「・・・」>「ページ設定」より、URLを変更やページの種類を設定できます。特にURLはSEO対策にもなりますので、必ずチェックしておきましょう！

　また、「テーマ テンプレート名」が作成したページ名ですので、確認しておきましょう。

・「保存」を押し、管理画面左上よりshopifyに戻ります。

・shopifyの管理画面に戻ったら、PageFlyで設定したページの種類に合わせてLPを表示します。

　今回はレギュラーページなので、「ページ」に追加されています。

　TOPページにLPのリンクを表示させることも可能ですし、shopifyの管理画面>「オンラインストア」>「メニュー」より、メニューにLPを表示させることも可能です。