• Skip to primary navigation
  • Skip to main content

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

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

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

3-19 Teachableでエディタ1.0でページブロックを編集する

Last updated on 2022年5月30日 By 石崎 力也

今回はTeachableで、1.0のページエディターを使いページブロックを編集する方法についてやっていきます。

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

  • Step1. ページエディター1.0とは
  • Step2. ページエディター1.0で編集する方法
    • #1. Rich Text
    • #2. Liquid/HTML
    • #3. Background Image
    • #4. Video Embed
  • Step3. ページエディター1.0で編集できるその他のブロック(Other Blocks)
    • #1. Course Hero Header
    • #2. Coupon Banner
    • #3. Course Description
    • #4. Author Bio
    • #5. Course Curriculum
    • #6. Bundled Courses
    • #7. FAQ
    • #8. Course Page Closing Letter
    • #9. Primary Enroll Button
    • #10. Embed Form
    • #11. Testimonial
    • #12. Features Courses
    • #13. Homepage Hero Header
    • #14. Upsell Offer
    • #15.Purchase Confirmation
    • #16.Proceed to Course
  • Step3. ソーシャルメディアのアイコンを消す方法
  • やり方を動画で見る

Step1. ページエディター1.0とは

今はコースの中のPagesに入っています。EDITOR VERSIONにページエディターのバージョンが表示されています。各ページに1.0、2.0とありますが、古いスクールになればなるほど、1.0となっているのを目にすると思います。

チェックアウトページとサンキューページでは、1.0しかない場合は2.0のものを作ることができないんですよね。古いスクールだったら、チェックアウトページとサンキューページがもう1.0で固定されてしまっています。ある時を境に新しいスクールに登録したらすべて2.0になっているのですが、今回はレガシーの1.0のページエディターを使って編集していきます。

Step2. ページエディター1.0で編集する方法

まずは中を見てみましょう。「Edit」で中に入っていきますね。サンキューページなので、Purchase Confirmationという買ってくれてありがとうと表示するページや、Video Embed、Proceed to Courseというコースの受講に進むようなボタン、HTMLのボタンなどいろいろなものがすでにあります。

今回は「+Insert new block」で挿入しながら見ていきましょう。

#1. Rich Text

まずは何があるかというと、Rich Textですね。これはリッチテキストを入れることができます。このような感じです。良いですよね。HTMLエディターというか、すごく汎用性のあるものですね。フォントを大きくしたり、いろいろな事ができます。HTML表示もできますね。

#2. Liquid/HTML

次は先ほどもありましたが、Liquid/HTMLですね。LiquidというのはTeachableの中で使っているショートコードのようなもので、Web ページがHTMLの言語で作られているならば、Teachableは半分がLiquidという言語で作られています。確かShopifyが作った言語で、それを使っていますね。

#3. Background Image

次はBackground Imageです。背景画像を入れます。テキストを入れることもできます。

#4. Video Embed

次はVideo Embedですね。埋め込みのビデオです。僕たちはここにアップセルのビデオセールスレターを入れて、そこでさらにサンキューページでアップセルするといったことをしています。Headingでは見出し、Descriptionでは説明文を入れることができます。

Step3. ページエディター1.0で編集できるその他のブロック(Other Blocks)

あとはほかにもこんなにたくさんあるんですよね。ひとつひとつ見てみましょうか。

#1. Course Hero Header

まずはCourse Hero Headerですね。ここにコース名が出ているのですが、これは画像になっています。画像をリプレイスしてあげると、その画像の上にこのテキストが載ります。OVERLAYでは画像の暗さを設定できます。Resetで戻すこともできます。このような感じです。Customize Enroll Buttonで「参加する」と入れるとどう映るか見てみましょう。このようになります。ボタンの文字を変えることもできますね。

#2. Coupon Banner

まだ沢山あります。次はCoupon Bannerです。クーポンが適用されているときの何パーセント割引されますよという表示で、セールスページでよく使いますね。サンキューページではあまり使わなくてもいいかなという感じですね。

#3. Course Description

次はCourse Descriptionです。コースの説明ですね。

#4. Author Bio

Author Bioは講師の説明です。講師はコースごとに割り振られているじゃないですか。InformationのAuthorのところに割り当てられていますね。これが表示されます。そのため、直接は編集できません。Authorを切り替えてください。

#5. Course Curriculum

ほかにはどんなものがあるでしょうか。次はCourse Curriculumです。これもコースのカリキュラムがそのまま反映されて載っているものになります。

#6. Bundled Courses

次はBundled Coursesです。ほかのレクチャーでも解説していますが、Teachableでは1つのコースに対して、バンドルといっていくつもコースを寄せ集めてパッケージのようにできます。これは同じパッケージの中に含まれる別のコースを表示するときに有効です。今のテスト用のコースはバンドルされていないので、なにもありませんよと言われています。

#7. FAQ

次はFAQですね。よくある質問です。

#8. Course Page Closing Letter

次はCourse Page Closing Letterです。これはコースの一番下にコースのまとめを書くようなところですね。普通のリッチテキストエディタでもいいんじゃないかなと僕は思ってしまいました。

#9. Primary Enroll Button

次はPrimary Enroll Buttonです。これは参加するボタンですね。プライマリーとセカンダリーでなにが違うか見てみましょうか。

ちなみに右側のゴミ箱のマークからDelete blockでいらないブロックをデリートできるので、いらないやつを消していきましょう。

ではプレビューします。どのような感じかというと、これですね。プライマリーのエンロールボタンにはこのようにプライシングを選ぶボタンがついています。こちらのセカンダリーのエンロールボタンにはついていません。セカンダリーのほうをクリックするとプライマリーに飛ぶようになっています。

#10. Embed Form

次はEmbed Formです。Mailchimpなどランディングページのフォームがあるじゃないですか。お客さんに情報を入力してもらってMailchimpのリストに登録してもらうフォームですね。「GetResponse」「CampaignMonitor」といったほかのEメールプラットフォームがありますが、これはここにコードを入れてくださいとやるものですね

#11. Testimonial

次はTestimonialです。これも良いですよね。お客さんの声をここに書けます。たくさん配置するとリアル感が出て良いですよね。

#12. Features Courses

次はFeatures Coursesです。注目のコースを3つ並べることができますね。サンキューページで他のコースを紹介したいときに結構良いんじゃないかなと思います。

#13. Homepage Hero Header

次はHomepage Hero Headerです。このように背景の画像があって、ここにテキストを載せたものをヒーローヘッダーと言うのですが、それが簡単に作れます。

#14. Upsell Offer

次はUpsell Offerです。来ました。これです。僕たちは必ずアップセルのオファーを必ず出していますね。確かCourseを選ぶとPricing Planが選べるんですよね。デモのコースを選ぶとPricing Planが選べました。Couponでクーポン適用する、しないを選ぶこともできます。これは結構汎用性が高いですね。

#15.Purchase Confirmation

次はPurchase Confirmationですね。これは買ってくれてありがとうという表示ですね。

#16.Proceed to Course

次はProceed to Courseです。これはもともとあったものですね。すぐコースに入りましょうという表示ですね。

Step3. ソーシャルメディアのアイコンを消す方法

よく左側のソーシャルメディアのアイコンをあまり使わないのですが、これを消す方法はないですかと聞かれることがあります。実はCourse Descriptionを削除すると消えるんです。セーブしてプレビューします。消えましたね。ということでどうしても消えない消えないと思ったらCourse Descriptionを削除してください。今回は以上です。やってみてください。

やり方を動画で見る

Teachable(ティーチャブル)の使い方・操作方法の一覧ページに戻る

Filed Under: Teachable

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

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

Copyright © 2023 · Rikiya "Sales Funnel" Ishizaki