• Skip to primary navigation
  • Skip to main content

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

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

  • いしこん 2.0
  • コース一覧
  • もう1本読む?
    • オンラインコース(講座)ビジネスの作り方・やり方
    • エバーグリーンローンチ・マスタークラス
    • 会員制サイトの作り方とサブスクリプションの導入方法
    • プロダクトローンチのやり方
    • ユーデミーで稼ぐ方法 – 売れるオンラインコースの作り方
    • 高額商品の作り方・売り方
  • 石崎力也とは?
  • サクセスパス
    • 1. PLAN
    • 2. MAKE
    • 3. SET
    • 4. LAUNCH
  • リソース
  • ログイン
    • 新規登録はこちら
    • アカウントを持っている
  • Show Search
Hide Search
現在の場所:ホーム / ClickFunnels / 5-1 ClickFunnelsで入力フォームを作る

5-1 ClickFunnelsで入力フォームを作る

Last updated on 2020年11月5日 By 石崎 力也

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

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

  • Step1. 入力フォームを追加する
  • Step2. 入力フォームで設定できること
  • Step3. THEMESタブ
  • Step4. ADVANCEDタブ
  • Step5. ANIMATIONタブ
  • やり方を動画で見る

Step1. 入力フォームを追加する

  • 「ADD NEW ELEMENT」で追加する

まずはオプトインページに入っていきます。すでに名前とEメールアドレスの入力フォームがあるので、この下に「ADD NEW ELEMENT」で追加していきます。入力フォームは「FORM」の「INPUT」を選択すると追加されるので、これを設定していきます。

Step2. 入力フォームで設定できること

  • TOP MARGIN:フォームの上の余白を調節することができます。これは大体のエレメントに付いている機能です。
  • INPUT TYPE:どういうタイプの情報を入力するかということで、だいたいの方は他のMailchimpやConvertKitのEメールのプラットフォームと連携していると思います。そのEメールのプラットフォームの欄に例えば住所などを入れた場合は、プラットフォーム側の住所の顧客情報のところにそれが入っていくようになっています。そこをカスタムにしたいという場合は「Custom Type」があります。これは他の動画で説明しているので、それを見てください。今回は名前にするので「Full Name」を選択します。
  • PLACEHOLDER TEXT:例えば「例)」という感じでこのフォームの中にあらかじめ表示される薄い文字を入れていきます。
  • REQUIRED:「Not Required」であれば何も入力せずに送信できますが、「Required」だと入力しなければ送信ボタンが押せないようになっています。
  • FONT FAMILY:フォントの種類を選択できます。
  • FONT SIZE:フォームの中のフォントサイズを変更することができます。
  • MOBILE SIZE:モバイルのフォントサイズのことです。通常はデスクトップ用のフォントサイズにひもづいているのですが、ここをクリックするとそのリンクを解除することができ、デスクトップ用とモバイル用に分けてサイズを変更することができます。プレビューの際はモバイル用のプレビューページを見ながら調整していくのですが、デスクトップと一緒に元に戻したい場合は「Remove mobile font size」のボタンをクリックすることで元に戻すことができます。

Step3. THEMESタブ

「THEMES」はすごく使い勝手が良く、あらかじめプリセットされたデザインを選べるようになっています。自らデザインしなくてもテーマを選ぶだけでいい感じのものが作れます。

Step4. ADVANCEDタブ

ADVANCEDタブは内容がけっこう複雑になります。

  • FONT WEIGHT:フォームの中のフォントの太さを変えることができます。
  • TEXT ALIGN:フォームの中のテキストのアラインメントを真ん中にしたり右側にしたりできます。
  • CORNERS:角の丸みを強調したりなくしたりできます。
  • SUBMIT ON ENTER:「ON」にすることでこのフィールドに何かを入力してEnterキーを押したときに下にあるボタンの代わりにサブミットしてくれる機能です。たまにそういうサイトがありますね。
  • BG COLOR:何種類か用意されていて、この中から選ぶことができます。
  • ICON:「ICON」はけっこうな頻度で使います。例えば「Name Icon」であれば人型のマーク、「Email Icon」であればEメールのマークが表示されます。これも「ICON STYLE」を「Color」にしたり「ICON POSITION」で「Left」にしたりできます。アイコンのスタイルやポジションを変えるのがこのメニューです。

Step5. ANIMATIONタブ

ANIMATIONタブはエレメントで共通しているのですが、「TIMED DELAY」はページがロードされてからどれくらいの時間差で表示するかを設定できます。

  • 「None」:そのままページのロードとともに表示される
  • 「Fade In」:1分に設定すると1分後にフェードインする
  • 「Fade In With Scale」:拡大しながら設定した時間にフェードインする

「ANIMATION」の「TYPE」で「On Page Load」を選択してページのロードから何ミリセカンドで表示するかが設定できたり、そのスタイルを選ぶことができるので、いろいろと試してみてください。「On Page Scroll (becomes visible)」ではスクロールしていってこのエレメントが見えてからどれくらいの時間でフェードインするように表示されるかということまで細かく設定することができます。これを使うとけっこうおしゃれに見えるかもしれません。今回は以上です。

やり方を動画で見る

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

Filed Under: ClickFunnels

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

Copyright © 2021 · Rikiya "Sales Funnel" Ishizaki