この記事では、Kajabi(カジャビ)におけるウェブサイト作成と編集の基本について初心者でも分かるように解説いたします。
前回の記事はこちら
- 1 ページ内での基本的な構成を理解する
- 2 カスタマイズに入る方法は2つ
- 3 ①まずは「Website」にある「Design」を選択するところから
- 4 ②もう一つは「Pages」の「Website」から
- 5 編集画面の解説
- 6 画面左側のメニュー
- 7 構成しているエレメントが表示される
- 8 タブレットの縦画面およびスマホ表示では
- 9 Section構成の続き
- 10 引き続きSection構成
- 11 必要な箇所を編集することで手間が省ける
- 12 Kajabiの無料お試し期間を14日→30日に増やす方法(さらに超豪華特典もプレゼント!)
- 13 解説動画はこちら
- 14 次の記事はこちら
- 15 Kajabiの使い方まとめ記事はこちら
ページ内での基本的な構成を理解する
今回はKajabi(カジャビ)でウェブサイトを作る際の基本について解説します。
Kajabiにおけるウェブサイト(ホームページ)のページ内での基本的な構成を理解することで、ウェブサイトの編集方法のみならず、他のページを作ったり、カスタマイズする際に役に立つので、ぜひ参考にして下さい。
カスタマイズに入る方法は2つ
カスタマイズに入る方法は2つあります。
①まずは「Website」にある「Design」を選択するところから
すると、上部には今公開しているホームページ(テーマ 「Prosper」)が表示されています。
そのままHomeのページを編集する場合は「Customize Page」を押下することで編集画面に移行します。
Home以外のページを編集したい場合、矢印を使って編集するページを表示(右下にページのタイプが表示されます)して、同じく「Customize Page」で編集する方法もあります。
②もう一つは「Pages」の「Website」から
もう一つは「Pages」の「Website」です。
ここでは、テーマを選択して作成された一連のページが表示されているので、そこから編集を行いたいページの「Customize」ボタンを押下して編集する方法もあります。
編集画面の解説
編集画面に移行しますが、まずは画面を解説します。
画面は直感的に操作しやすく構成されていて、画面上部のボタンでは編集を行うページを切り替えることができます。
その隣に配置されているボタンは、順に「PC画面でのプレビュー」、「タブレット横画面でのプレビュー」、「タブレット縦画面でのプレビュー」、「スマホ画面でのプレビュー」と並んでいて、それぞれの端末での「見え方」を確認できます。
公開状態を示す「LIVE」表示の隣には作業を「戻す」「進める」ボタンが配置されています。
さらにその隣に「Preview」(プレビュー)ボタンと「Save」ボタンが配置されています。
画面左側のメニュー
画面左側には「Sections」(項目)と「Settings」(設定)ボタンが表示されています。
Sectionを押下すると、ページ内に構成されている項目(Section)を見ることができます。
例えば、一番上に表示されている「Header」を押下すると、ページの頭部にあるヘッダーが選択されます。
そこから「EDIT」を押下することで左の編集エリアで、日本語にカスタマイズして編集入力することができます。
今回選択しているテーマ「Prosper」のHomeページのSectionを見てみると、上から順に「Header」、「Hero」(冒頭に表示される文字)、「Social Proof Logos」(掲載メディア情報)、「Get started」(メニューを横三列に表示)・・・と上から順に構成されています。
構成しているエレメントが表示される
試しに「Get started」を押下してみると、構成されているエレメントが表示されます。
内容としては、「Text」(文字)と、
3つの「Feature」(ボタンを含むメニュー)です。
タブレットの縦画面およびスマホ表示では
ちなみにこの3つの「Feature」セクションは、タブレット縦画面だとこのように表示されます。
横画面だとこのようになります。
スマホではこのように表示されます。
Section構成の続き
Sectionの構成に戻ります。
「Get started」の下にある「Lead Magnet」では、イメージ画像やボタンが配置されていて、ボタンがポップアップ表示に繋がりフォームを表示させる仕組みになっているのが分かります。
その下にある「Blog Post」はブログの更新情報です。
(私の場合はブログ記事が上部に表示されるように構成しています)
「About」は自己紹介的なページです。
「Courses」は講座の表題や概要が表示されています。
最後は「Newsletter Opt-in」となっています。
このSectionは、メルマガ登録や無料オファーに誘導する場合に編集します。
Section自体をページの上(目立つ箇所)に移動させるか、または一番下のままでフォームに誘導し、お客様のメールアドレスを取得する目的で編集します。
公式サイトを作る際には、何かしら無料オファーを作らないとリストが集まらないので、「Newsletter Opt-in」における編集が重要になります。
引き続きSection構成
Sectionの構成に戻ります。
最下には「Footer」があり、ここにはリンク集や会社名を入力すると良いでしょう。
その下にある「Exit Popup」ではポップアップ表示を編集することができ、同じく「Two Step Optin」では、ボタンを押すことでポップアップが表示される機能です。
「Two Step Optin」の場合、「Edit Two Step Popup」にチェックを入れてポップアップ画面でフォーム入力させて無料オファーなどに誘導することができます。
チェックを入れると編集画面に切り替わり、チェックを外すと表示されなくなります。
Section自体の名前を変えたり、表示を隠したり削除することもできます。
さらにドラッグ&ドロップで順番を変えることもできます。
必要な箇所を編集することで手間が省ける
このように、まずは各ページの構成を理解することで、編集を行うSectionや削除、または追加するSectionなどが理解でき、ホームページ全体の構成や理解などに非常に役に立ちます。
それに、Kajabiから公開されているホームページのテーマ(今回は「Prosper」)を選択することで、ウェブページが自動で生成され、そこから必要な箇所を編集することでゼロからウェブページを構成するよりもはるかに手間が省けます。
別の回では、さらに詳しいSectionの編集方法などを解説させて頂きます。
以上、Kajabi(カジャビ)でウェブサイトを作る際の基本を解説しました。
Kajabiの無料お試し期間を14日→30日に増やす方法(さらに超豪華特典もプレゼント!)
もしあなたがKajabiの導入を検討されたい場合は以下のブログ記事内のリンクからKajabiの無料お試しにお申し込みいただくと、Kaiabiを使い方をわかりやすく解説した100本以上の動画を収録した「Kajabiマスタークラス(定価9万9700円)」とKajabiの使い方をヒルトルに直接質問が出来る「海外ツールサポートコミュニティ」の参加権利を無料でプレゼントします。
詳細は以下の記事からご覧ください↓
Kajabiの導入をご検討されている方はぜひご活用くださいね!