• Skip to primary navigation
  • Skip to main content

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

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

  • いしこん 2.0
  • 無料ウェビナー
  • もう1本読む?
    • オンラインコース(講座)ビジネスの作り方・やり方
    • ネットビジネスの始め方【これでオランダ移住を実現しました】
    • 会員制サイトの作り方とサブスクリプションの導入方法
  • コース一覧
  • お客様の声
  • 石崎力也とは?
  • リソース
  • ログイン
    • 新規登録はこちら
    • アカウントを持っている
  • Show Search
Hide Search
現在の場所:ホーム / ClickFunnels / 5-18 ClickFunnelsで住所入力フォームを入れる

5-18 ClickFunnelsで住所入力フォームを入れる

Last updated on 2021年4月14日 By 石崎 力也

今回はClickFunnelsで住所の入力フォームを作っていきます。

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

  • ClickFunnelsにおける住所の入力フォームの特徴
  • Step1. 「SHIPPING ADD.」を挿入する
  • Step2. SETTINGSタブを設定する
  • Step3. THEMESタブを設定する
  • Step4. ADVANCEDタブを設定する
  • やり方を動画で見る

ClickFunnelsにおける住所の入力フォームの特徴

今開いているのはオーダーフォームのページなのですが、「Step #2」の所に住所を入力するフォームが作ってあります。これは1つのエレメントで構成されているのですが、ClickFunnelsは英語圏にカスタマイズされているところがあるので、住所の番地が先にきていたりして英語表記になっています。

ここの「Full Address」や「City Name」は変更できません。入力フォームの中に表示される文字は日本語にできますが、「Select Country」の所も全部英語で出てしまうので、日本のお客さんにリーチする際に驚かれるかもしれません。そういうことを気にしないという人はデジタルプロダクト以外で配送先が必要であればClickFunnelsでこういうものが作れるので、このやり方を説明していきます。

Step1. 「SHIPPING ADD.」を挿入する

「ADD NEW ELEMENT」をクリックします。「BILLING ADD.」というものもあるのですが、今回は配送先のほうなので「SHIPPING ADD.」を選択します。そうすると先ほどと同じような画面が出てくるので設定していきます。

Step2. SETTINGSタブを設定する

  • TOP MARGIN:エレメントの上の余白を調整できます。
  • フォームの中の日本語化:例えば「ADORESS TEXT」を「番地」、「CITY TEXT」を「市町村」というふうにそれぞれ変えていきます。
    • 「ADORESS TEXT」:番地
    • 「CITY TEXT」:都市名
    • 「STATE TEXT」:都道府県
    • 「ZIP TEXT」:郵便番号
  • FONT SIZE:フォームの中のフォントサイズを変更できます。外側のフォントサイズは変わりません。

Step3. THEMESタブを設定する

だいたいはTHEMESタブでプリセットされたデザインが選べるのですが、残念ながらこのエレメントでは選べません。このようにデザインがあまり調整できないエレメントもあります。

Step4. ADVANCEDタブを設定する

STYLESタブから見ていきましょう。

  • REQUIRED:「Not Required」にしておけばこのフォームを記入せずに先へ進めます。デフォルトでは「Not Required」になっていますが、これも選んでみてください。
  • TOGGLE EXTRA INFO:「Full Address」を入力してもらうか「Country」だけを入力してもらうかが選択できます。デフォルトだと「Show Full Address」になっているのですが、場合によっては「Only Country」を選択するのもありだと思います。
  • TEXT ALIGN:「TOGGLE EXTRA INFO」を「Show Full Address」にしたときのフォーム内のテキストの左右の位置を変更できます。これは左側が一番いいと思います。
  • CORNERS:入力フォームの角丸の半径を変更できます。ピクセル数を大きくするほど角が丸くなり、デフォルトの「5px」に戻すと四角い感じになります。
  • BG COLOR:背景色を変更すると入力欄が認識しやすくなるので、「BG COLOR」でカラーを選択してもいいと思います。「White」「Gray」「Black」があるので、色味を確認しながら選択してみてください。

次はADVANCEDタブです。これは他のエレメントでも説明したのですが、ページを読み込んだりしたときにエレメントを表示する際のディレイを選択できます。上と下に分かれていて、上のほうは1秒以上の比較的大きなディレイを入れることができ、下のほうはJavaScriptでいうLazy Loadingのような感じで時間の短いディレイを入れることができます。

上のほうから見ていきます。「TIMED DELAY」ではエフェクトを選択できます。「Fade In」と「Fade In With Scale」があり、これも実際のエフェクトを確認してみてください。

「MINUTES」と「SECONDS」で時間を指定できます。「HOURS」はないのですが、例えば1時間半であれば90分で指定できるので、その辺は安心してください。これは例えば60分のウェビナーのときに30分のところでオーダーフォームなどを出したいという場合によく使います。「MINUTES」を「30」、「SECONDS」を「15」と入力すれば30分15秒たったときにセールスページでこういうフォームを出したりすることができます。

「ANIMATION」のほうは短い期間のディレイでしたね。「On Page Load」と「On Page Scroll (becomes visible)」の2つがあります。

「On Page Load」はページが表示されたときから起算して指定したミリセカンドでディレイを表示できます。「STYLE」は種類がたくさんあるのでいろいろ試してみてください。「DELAY (MS)」はデフォルトでは500ミリセカンドですが、これも変更できます。

「On Page Scroll (becomes visible)」は例えば長いセールスレターなどでページをスクロールしていってエレメントの場所に来た時点から起算するようにできます。こちらも「STYLE」と「DELAY (MS)」を変更できます。

今回はオーダーフォームで入れましたが、他のページでも「SHIPPING ADDRESS」のエレメントを使えるので、例えばオプトインの際に「Country」だけ選択してもらうということもできると思います。いろいろできるので使ってみてください。今回は以上です。

やり方を動画で見る

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

Filed Under: ClickFunnels

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

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

Copyright © 2022 · Rikiya "Sales Funnel" Ishizaki