• Skip to primary navigation
  • Skip to main content

石崎力也のコンサルティング「いしこん」

年収1000万円以上のネットビジネス経営者を対象にデジタルコンテンツの販売方法とマーケティングオートメーションの導入方法に関する情報を発信するブログ。

  • いしこん 2.0
  • 無料ウェビナー
  • もう1本読む?
    • ネットビジネスの始め方【これでオランダ移住を実現しました】
    • オンラインコース(講座)ビジネスの作り方・やり方
    • 会員制サイトの作り方とサブスクリプションの導入方法
    • 動画広告の作り方マスター講座|種類、活用方法から効果測定のコツまで
    • 短くて成約率の高いVideo Sales Letter(VSL)の作り方
    • エバーグリーンローンチとは?ツールの使い方を詳しく解説!
    • 個人でKindle電子書籍を出版して利益を得る方法
    • Teachable(ティーチャブル)の使い方・操作方法
    • ClickFunnels(クリックファネル)の使い方・操作方法
  • コース一覧
  • お客様の声
  • 石崎力也とは?
  • リソース
  • ログイン
    • 新規登録はこちら
    • アカウントを持っている
  • Show Search
Hide Search
現在の場所:ホーム / ClickFunnels / 8-10 クリックファネルでOrder Formページを作る方法

8-10 クリックファネルでOrder Formページを作る方法

Last updated on 2021年8月25日 By 石崎 力也

今回はClickFunnelsでOrder Formページを作る方法を解説します。はじめにOrder Formページがなにかという話をしましょう。Order FormページはClickFunnels上で見ていただくと分かりますが、ページの左側にカートのアイコンがあるページです。ページと表現をわかりやすくして呼んでいますが、一つ一つがステップと呼ばれる単位になっています。ステップの中にはA/Bテスト用に作ることのできるバリエーションというものがあります。

今回お届けするノウハウはこちら

  • Step1. Order Formページを使う理由とPayment Gateway
  • Step2. Order Formページを追加する方法
  • Step3. Order Formページに必要な4つのエレメントを設定する
    • Product Selector
    • Credit Card
    • メールアドレス
    • 決済ボタン
  • Step4. Pathを設定する
  • Step5. APPLE /ANDROID PAY(オプション)
  • Step6. Product with variation selector
  • Step7. Order Bump
  • Step8. Product summary
  • Step9. 2 Step Order Formを設定する方法
  • やり方を動画で見る

Step1. Order Formページを使う理由とPayment Gateway

ではこのOrder Form、カートのアイコンと言いましたが、これがなぜ大事かというと、決済を受ける上で必ず必要になってくるものだからです。Salesページなど他のページタイプもあって、アイコンもいろいろとありますが、他のページタイプだとダメなんですね。例えば、Evergreen Factory Order Pageを見てみましょう。ここにクレジットカードの決済を受けるための専用のエレメントを配置しています。実はこのエレメントはOrder Formのページタイプ以外では出てこないんですよね。普通のオプトインページやSalesページ、あとは注文確認ページ、Order Confirmationページなどでは出てこないエレメントになるんですよ。そのため、僕は毎回Order Formは大事ですよという話をしています。

僕はSalesページを作るときも、必ずOrder Formのページで作るようにしています。なぜかというと、あとでSalesページの中で決済を受けたくなったときに、他のページタイプだとクレジットカードのエレメントを出せないからです。一度他のページタイプにしてしまうと、他のステップでOrder Formのページを作って、そこに飛ばして決済を受けるようになってしまい柔軟な運用ができなくなるため、セールスページは迷ったらOrder Formページで作るほうがいいかなと思います。

Order Formページの作成に必要なものはPayment Gatewayです。これが何かというと、ClickFunnelsをStripeやPayPalといった決済を受けるサービスと連携することができるものです。連携はあらかじめ済ませておいてください。連携していないと、Order Formページを作っても受け皿がないので、決済を受けられません。

Step2. Order Formページを追加する方法

では実際にOrder Formのページをどうやって追加していくのかをお見せします。新しいステップを追加するので、左下の+ADD NEW STEPをクリックします。名前はなんでもいいのですが、例えばExample Order Formにしましょうか。横にオプションがあって、Show in Funnel?と書いています。デフォルトは Yesなので、今はYesになっています。ここをYesにした場合は、ステップの一覧に出てきます。もしNoを選んだ場合は、一覧の下にあるOTHER FUNNEL STEPSにこのように入ります。普通はYesのほうにしておきましょう。

そしてPathという項目があります。Pathは URLのことですね。例えばrikiyaishizaki.clickfunnels.com/というURLをClickFunnelsで使っていたとしましょう。
その場合、スラッシュ以降のページのURLを指定することができます。今回は指定してみましょうか。例えば名前がExample Order Formなので、全て小文字にしてexample-order-form12345とします。ここはひとつひとつ被らないように違ったものを設定しなければならないのですが、とりあえずこれで作りましょう。

そうするとページタイプを選ぶところになります。先ほど言ったようにSalesページやオプトインのエレメントなどいろいろなエレメントがありますが、今回はSALESのところから間違えずにOrder Formを選択してください。画像がロードされてきました。ClickFunnelsで最初からあるものを使いましょうか。今回はこれにしましょう。+Select Templateをクリックするとページの読み込みが入って、ページが追加されます。ではEDIT PAGEから入ってみましょう。このようなページができました。

ちなみにOrder Formを作った後、必ずこのページ上に配置しなければならないエレメントが4つあります。それを順番にやっていきましょうか。

Step3. Order Formページに必要な4つのエレメントを設定する

Product Selector

まずはProduct Selectorというエレメントです。これですね。SELECT PRODUCT 2.0です。いろいろとバリエーションがあって、例えば先ほどのORDER SELECTや、他にもORDER SELECT W/INVENTORY、2 STEP ORDER INVENTORYなどがあります。ORDER SELECT W/INVENTORYに関しては別の動画で解説しているので、そちらを見てください。バリエーションはいくつかあるものの、ORDER SELECTのようにSELECTという言葉が入ったエレメントが必ず1つ必要です。どの商品をお客さんが購入するのかを明示するために必要になってきます。

Credit Card

2つ目はここにあるCredit Cardのエレメントです。クレジットカードの番号などを受けるためのエレメントになっています。

メールアドレス

3つ目はメールアドレスです。ClickFunnelsの決済のときに必ずメールアドレスを取るようになっています。それをStripeなどに渡して顧客情報を紐付けています。新しく作るときはINPUT FORMを追加して、INPUT TYPEをEmail Addressにすると自動的にRequiredになるのでそれでいいと思います。

決済ボタン

最後に大事な大事な決済ボタンです。決済ボタンも新しく作るときは、必ずEDIT ACTIONをSUBMIT ORDER/SUBMIT FORMにしてください。以上の4つが必要になってきます。

Step4. Pathを設定する

ではPathに戻りましょう。Pathを設定すると言いましたが覚えているでしょうか。今はfunnel.rikiyaishizaki.infoというドメインで運用しています。先ほど設定したPathがこのスラッシュより後ろですね。僕たちは代表 URLと呼んでいるのですが、このステップを代表するURLになります。

A/Bテストで作るときにバリエーションというものができるのですが、こちらのパスを指定することもできます。1つのステップの中に2つのページを作ることができるのですが、その各ページの個別のURLになります。

Step5. APPLE /ANDROID PAY(オプション)

ページにどんなものを入れてもいいのですが、例えばAPPLE /ANDROID PAYのようにオプションとしてページ上に配置するエレメントもあります。これはAppleであればiPhoneのSafariなどで出たりするそうなのですが、どのデバイスでも必ず出るものではなく、対応したデバイスでアクセスしたときにだけ出るようになります。こういうものも追加しておくとすごくいいと思います。

Step6. Product with variation selector

次のProduct with variation selectorは先ほどのプロダクトのセレクトと似ているのですが、これはバリエーションを設定していないと出ないですね。別の動画で解説しているので、よかったら見てください。

Step7. Order Bump

Order Bumpはこういうエレメントになります。注文情報を入力したあとに、このページでしか手に入れられないちょっとしたミニ商品がありますよと案内して、チェックをつけるだけでオーダーに追加できるものです。これも結構売れます。よく考えて実装していただきたいのですが、これがあってもなくても成約率はほとんど変わらないので試していただければと思います。

Step8. Product summary

複数のプロダクトをセレクトしたあとに、一体全部でいくらになるのかをProduct summaryで最終的に表示することができます。このようにしてみてください。もちろんこれを設定したあと、必ずプロダクトを1つ以上作ってください。そうしないと、決済が発生しません。

Step9. 2 Step Order Formを設定する方法

2 Step Order Formが何かというと、見ていただくのが一番早いと思います。このようなものです。最初に名前やメールアドレスなど自分の情報を入力してもらうのですが、電話番号や配送先など不要な項目を隠すことができるんですよね。隠すことですごくスッキリします。最初は名前とメールアドレスだけ入れてもらって、次でカード番号を入れてください、オーダーバンプはどうですかと2段階に分けることができます。

例えばこのようにたくさんの項目が最初に並んでしまうと、これだけで買う気が失せてしまうのですが、名前とメールアドレスだけなら入れてみようかなと進んでもらって、次にカード情報と細かく細かく分けることによって成約率を上げようという試みですね。これが2 Step Order Formになります。Order Formのエレメントでも工夫でいろいろと成約率を上げられる方法があるので試してみてください。

やり方を動画で見る

ClickFunnels(クリックファネル)の使い方・操作方法の一覧ページに戻る

Filed Under: ClickFunnels

知っていることはお金になる…1度限りのウェビナーをご用意しました

石崎力也のコンサルティング「いしこん」

Copyright © 2023 · Rikiya "Sales Funnel" Ishizaki