• Skip to primary navigation
  • Skip to main content

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

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

  • いしこん 3.0
  • 無料ウェビナー
  • もう1本読む?
    • 【初心者でもわかる】失敗しないセールスファネル完全攻略ガイド:リード獲得から高額商品販売まで、売上を最大化する自動化戦略
    • 個人事業主のためのAIツール活用術|ChatGPTから始めるビジネスの自動化・効率化マスターガイド
    • ネット広告代理店を個人で開業!Facebook広告運用のスキルを身につけて成功する方法|ツールの設定、数値分析、営業、業務効率化まで
    • 【保存版】コンテンツマーケティングのネタ切れを防ぐ!ネタの見つけ方と戦略のコツ
    • 上級者をペルソナに設定し優良顧客だけを集める方法
    • Eメールマーケティングの基礎知識|開封率と成約率の向上、セグメンテーションまで
    • 30代フリーランスが家族と一緒にオランダに移住した体験を話します
    • Webマーケティングのやり方マスター講座|ブランディング戦略、SNS発信、スケジュール管理を解説
    • ネットビジネスの始め方【これでオランダ移住を実現しました】
    • オンラインコース(講座)ビジネスの作り方・やり方
    • 会員制サイトの作り方とサブスクリプションの導入方法
    • 動画広告の作り方マスター講座|種類、活用方法から効果測定のコツまで
    • 短くて成約率の高いVideo Sales Letter(VSL)の作り方
    • エバーグリーンローンチとは?ツールの使い方を詳しく解説!
    • 個人でKindle電子書籍を出版して利益を得る方法
    • Teachable(ティーチャブル)の使い方・操作方法
    • ClickFunnels(クリックファネル)の使い方・操作方法
  • コース一覧
  • お客様の声
  • 石崎力也とは?
  • リソース
  • スクール
  • Show Search
Hide Search
現在の場所:ホーム / ClickFunnels / 5-1 ClickFunnelsで入力フォームを作る

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

Last updated on 2021年4月14日 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(クリックファネル)の使い方・操作方法の一覧ページに戻る

カテゴリClickFunnels

About 石崎 力也

石川県金沢市出身。モントリオール在住。専門スキル:競艇、コピーライティング、DRM、アニメーション。このサイトの運営責任者です。2013年3月に六本木と西麻布で会社を設立し、同年11月までに全てのメディア・広告事業を軌道に乗せる。現在は、家族と一緒に、3か月に1度、住む国を変えながら生活をしています。

「デジタルマーケティング完全ガイド」を無料プレゼント0円でダウンロード

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

Copyright © 2025 · Rikiya "Sales Funnel" Ishizaki