3-5 ClickFunnels(クリックファネル)画像変更方法5ステップ完全解説

執筆者 | クリックファネル2.0, クリックファネル2.0の基礎

今回はClickFunnels2.0(クリックファネル2.0)の使い方としてセールスファネルの作成〜画像の編集について解説していきます。早速、画像を変えてみたいと思います。

3-5 セールスファネルの作成〜画像の編集

今回はこちらの画像(ワンちゃんの画像)ですね。画像の上にマウスを持ってきていただくと、画像の上の帯に「要素」として画像が入っていることがわかります。なので、帯の真ん中にある【設定(歯車マーク)】をクリックしていただきます。クリックしていただきましたら、画面右側に画像メニューが開きます。

「画像URL」項目を見ていただくと、この画像は画像URLを引っ張ってくる形になっていますので、ここにURLを入れるんですけれども、アップロードもできますので「URL窓」の右隣にある【ピクチャーアイコン】をクリックしてください。クリックしていただきますと、アップロードフォルダが出てきますのでここで画像をアップロードしていただきます。

すでに何かの画像が入れてある方は、画像を選択してみましょう。私も入れてありますので、画像を選択して入れてみます。画像が入っていない方は【画像をアップロード】をクリックして、画像を追加します。私は、自分の写真をアップローそして見ます。

3-5 セールスファネルの作成〜画像の編集

そうすると、ワンちゃんの画像が私になりましたね。画像の変更方法なんですが、いろいろありまして、まずは画像の幅ですね。ちょっと大きすぎたかなというときは「画像幅」項目にあるカーソルを左に動かしていただいて、ちょっと小さくしていただいても大丈夫です。

「画像の高さ」項目はあまり使いませんのでautoのままで大丈夫です。あとは「パディング」とかですね。「上マージン」項目は、画像がちょっと上すぎるという場合に、カーソルを先ほどのテキストと同じですが、左右にスライドしていただいて調整していただければと思います。

3-5 セールスファネルの作成〜画像の編集

そして、その他にもいろいろな要素がありますので、設定がオフになっているものはですね、スイッチをオンにしていただきます。そうすると「ボーダー」という項目がありますので、これはちょっと面白いのでやってみましょう。ボーダー項目のスイッチをオンにしただけで枠が入りました。

なので、たとえば、この「カラー」項目をですね、黄色にしていただくと黄色い枠になるし、紫色にしていただくと紫色の枠もつけることができます。次に、枠の太さですね。枠の太さを変更するには「ストロークサイズ」のカーソルを左右に動かすことで、大きくすることも小さくすることもできます。

「ボーダースタイル」項目では、画像の枠をいろいろなスタイルに変更することもできますので、いろいろな枠線にして遊ぶこともできます。変更した設定がいらなければ、ボーダースイッチをオフにしていただければ元に戻りますので安心してください。あとは「シャドウ」ですね。シャドウもちょっとやってみましょう。

シャドウのスイッチをオンにすることで、ちょっとこの写真に一瞬で影をつけることができました。シャドウもたくさんの項目がありますので、ここら辺の設定で変更することもできます。もし必要でしたらオンにして設定をしてみてください。次は「コーナー」項目ですね。コーナーも見てみましょう。

「すべての角」のカーソルを左右に動かすことで、画像の角をちょっと丸っこくすることができるんですね。なので、カーソルを右に動かしていただくと、思い切り丸にすることもできます。この点も、実際にいじってみてこういうことができるんだなと思っていただければと思います。できましたら、ページの関係ないところをクリックして元に戻ってきます。今回は、セールスファネルの作成〜画像の編集について解説させていただきました。