ポータルページのカスタマイズ

ポータルページのカスタマイズ

お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

Notes
このヘルプページは、2026年6月1日以降に作成されたポータルを利用しているCreator 6ユーザー向けです。
  1. それ以前に作成されたポータルについては、旧バージョンのポータルページのカスタマイズについてこちらのドキュメントを参照してください。
  2. Creator 5を利用している場合は、こちらのドキュメントを参照してください。ご利用中のCreatorのバージョンを確認してください。
このページで説明する内容
新しいポータルページの作成、ポータルページ設定の構成、カスタマイズやブランディング要件を満たすためのコンポーネントの整理など、ポータル内のページを作成、管理する方法について説明します。

利用条件

  1. ポータルページは、Creatorのすべての有料プランで作成できます。
  2. ポータルページを作成、管理できるのは、特権管理者、管理者、開発者のみです。

1. ポータルページの作成手順

ポータルを作成する際には、ポータルページの生成方法を定義できます。既存のポータルには、後からポータルページを追加することもできます。どちらの場合も、ポータルが作成されるとポータルページビルダーが表示され、ポータルの要件に応じてこれらのページを編集、管理できます。

1.1. ポータル作成時

ポータルの作成時に、ポータルページの生成方法を選択できます。ポータルページは、最初から作成することも、テンプレートを使用して作成することもできます。
テンプレートを使用してポータルページを作成する場合、Zoho Ziaを使用して、要件に応じたコンテンツや画像を生成または更新できます。また、参考画像をアップロードして、ポータルページの外観をさらにカスタマイズすることもできます。このオプションにより、コンテンツ要件に応じてポータルページをすばやく設定できます。

1.2. 既存のポータルへの新しいページの追加

既存のポータルに新しいポータルページを追加するには、次の手順を実行します。
  1. 移動して、対象のポータルのポータルページビルダーを開きます。
  2. 左上の[+]アイコンをクリックします。

  3. [ポータルページ名][リンク名]を入力します。
  4. 必要に応じて参考画像をアップロードしてポータルの外観をカスタマイズし、[作成]をクリックします。
  5. コンポーネントをドラッグ&ドロップしてページに追加し、必要に応じて設定します。コンポーネントプロパティを設定する方法を確認してください。
  6. [保存]をクリックして変更を適用します。

2. ポータルページの管理

ポータルページの詳細の更新、コンテンツの変更、不要になったページの削除により、ポータルページを管理します。
  1. ポータルページの詳細の編集
  2. ポータルページの編集
  3. ポータルページの削除

2.1. ポータルページの詳細の編集

ポータルページの名前とリンク名を更新して、内容に合った整理された状態に保ちます。ポータルページの詳細を編集するには、次の手順を実行します。
  1. 移動して、対象のポータルの[ポータルページ]を開きます。
  2. 左上にあるポータル名の横のドロップダウンをクリックします。
  3. 編集するページの横にあるペンアイコンをクリックします。

  4. [ポータルページ名][リンク名]を更新します。

  5. [更新]をクリックして変更を保存します。
Notes
メモデフォルトページの名前とリンク名は編集できません。

2.2 ポータルページの編集

既存のポータルページを編集するには、次の手順を実行します。
  1. 移動して、対象のポータルのポータルページビルダーを開きます。
  2. 左上の[ページ]ドロップダウンから対象のページを選択します。
  3. ビルダーを使用して変更を行います。
  4. コンポーネントペインからコンポーネントをドラッグ&ドロップします。
  5. コンポーネントを選択して、基本プロパティを更新します。
  6. 省略記号アイコンを使用して、選択したコンポーネントの詳細プロパティにアクセスします。コンポーネントプロパティの設定方法を確認してください。

  7. 要素を別の要素の方向にドラッグしてグループ化します。青い線のインジケーターが表示されたら、要素をドロップしてグループ化を完了します。
  8. レイアウトの要件に応じて、要素を水平方向(左、中央、右)または垂直方向(上、中央、下)にスナップ配置します。
  9. 要素を右クリックすると、1段階前面または背面に移動したり、最前面または最背面に移動したりする追加オプションにアクセスできます。
  10. 最近の変更を元に戻す、または再適用する場合は、右上の[元に戻す/やり直し]を選択します。
  11. [保存]をクリックします。
ここで作成したすべてのページは、モバイルやタブレットに対応させることができます。スタックコンテナーを使用してページを作成すると、レスポンシブ表示を実現できます。

2.3. ポータルページの削除

不要になったポータルページを削除して、ポータルを整理された最新の状態に保ちます。
Notes
メモ:ポータルページを削除すると、元に戻すことはできません。関連するすべての変更内容とコンテンツは失われ、復元できません。
ポータルページを削除するには、次の手順を実行します。
  1. 移動して、ポータル内の[ポータルページ]を開きます。
  2. 左上にあるポータル名の横のドロップダウンをクリックします。
  3. 削除するページの横にあるごみ箱アイコンをクリックします。

  4. 削除を確定します。
Notes
メモ:デフォルトページは削除できません。

3. コンポーネントプロパティの設定

ビルダーダッシュボードでは、コンポーネントを追加し、そのレイアウト、外観、動作をカスタマイズしてポータルページをデザインできます。コンポーネントの設定に使用できるプロパティについて確認してください。
コンポーネントプロパティを設定するには、次の手順を実行します。
  1. 移動して、ビルダーダッシュボードを開きます。
  2. コンポーネントをクリックし、省略記号アイコン(⋯)を選択してプロパティを表示します。

  3. コンポーネントプロパティペインがビルダーの右側に表示されます。
  4. 利用可能なプロパティを使用して必要に応じてコンポーネントを設定し、ページ右上の[保存]をクリックします。

3.1. 共通プロパティ

プロパティ
オプション
設定手順
レイアウト(幅、高さ)
幅:フィル、px、%、自動
高さ:自動、px、%、フィル
コンポーネントのサイズを定義するには、幅と高さの値を選択します。
pxまたは%を選択した場合は、対応する数値を入力します。
背景
色:
  1. 標準色
  2. カスタム(カラーピッカー、16進コード)
画像:
  1. ストック画像(Zoho)
  2. 画像をアップロード
標準オプションから色を選択するか、カラーピッカーまたは16進コードを使用してカスタム色を定義します。背景に画像を使用するには、クリックしてストック画像から選択するか、独自の画像をアップロードします。
角丸
0px、6px、12px、16px、24px、円形
角の丸みを調整するには角丸の値を選択します。端を完全に丸くするには円形を選択します。

枠線
太さ:1~5
色:
• 標準色
• カスタム(カラーピッカー、16進コード)
枠線の太さ(1~5)を選択します。次に、標準オプションから色を選択するか、カラーピッカーまたは16進コードを使用してカスタム色を定義します。

エレベーション1~5
影の深さを設定するには、エレベーションレベル(1~5)を選択します。
不透明度
0%~100%
透明度を調整するには、不透明度の値を変更します。

3.2. コンポーネント固有の設定

選択したコンポーネントに応じて、以下のプロパティを使用できます。
プロパティ
対象コンポーネント
オプション
設定手順
フォントファミリー
テキスト
Lato、Barlow、Comfortaa、Montserrat、Nunito、Open Sans、Poppins、Quicksand、Raleway、Rubik、Source Sans Pro
テキストのフォントファミリーを選択します。
フォントの太さ
テキスト
細字、標準、セミボールド、太字、極太
テキストの強調度を定義するには、フォントの太さを選択します。
フォントサイズ
テキスト
8~72
対応範囲内でフォントサイズを入力または選択します。
テキストの色
テキスト
標準色、カスタム(カラーピッカー、16進コード)
標準オプションから色を選択するか、カスタム色を定義します。
テキストの配置
テキスト
左、中央、右
テキストの水平方向の配置を選択します。
垂直方向の配置
テキスト
上、中央、下
コンポーネント内での垂直方向の配置を選択します。
パディング
すべてのコンポーネント
px
内側の余白を調整するには、単位を選択して値を入力します。
画像ソース
画像
ストック画像(Zoho)、画像をアップロード
クリックしてストック画像から画像を選択するか、独自の画像をアップロードします。
画像の表示方法
画像
合わせる、塗りつぶし、引き伸ばし
コンポーネント内での画像の表示方法を選択します。
画像の位置
画像
左上、上、右上、左、中央、右、左下、下、右下
画像を配置する位置を選択します。
アイコン
アイコン
アイコンギャラリー
アイコンギャラリーを開き、使用可能なアイコンの一覧からアイコンを選択します。
キャンバスの種類
H-Stack、V-Stack
H-Stack、V-Stack

H-Stack
  1. コンポーネントを水平方向(左から右)に配置します。
  2. 行内で要素の間隔と位置を調整します。
  3. ナビゲーションバーやインラインセクションなどのレイアウトに便利です。

V-Stack
  1. コンポーネントを垂直方向(上から下)に配置します。
  2. 列内で要素の積み重ね方と間隔を調整します。
  3. フォームやコンテンツセクションなどのレイアウトに便利です。
コンポーネントを配置するレイアウトの種類を選択します。

項目の配置
H-Stack、V-Stack
左上、上、右上、左、中央、右、左下、下、右下
端から端まで、均等分割

端から端まで
  1. コンポーネントを利用可能な幅または高さ全体に広げます。
  2. 要素間のすき間をなくし、途切れのないレイアウトを作成します。
  3. 全幅セクションやバナーに便利です。

均等分割
  1. 利用可能なスペースをコンポーネント間で均等に分割します。
  2. すべての要素の幅または高さを同じにします。
  3. 均一なセクションで構成されるバランスの取れたレイアウトに便利です。
コンテナー内で項目を配置する位置を選択します。
オーバーフロー
H-Stack、V-Stack
スクロール、折り返し、逆方向に折り返し

スクロール
  1. コンテンツがコンテナーのサイズを超えた場合にスクロールできるようにします。
  2. レイアウトを固定したまま、はみ出したコンテンツにアクセスできるようにします。
  3. 長いセクションやコンテンツ量の多いコンポーネントに便利です。

折り返し
  1. はみ出した要素を次の行または列に移動します。
  2. コンテナー内でコンテンツが切れないようにします。
  3. 複数の項目を含むレスポンシブレイアウトに便利です。

逆方向に折り返し
  1. 折り返しと同様ですが、はみ出した要素を逆順に配置します。
  2. 項目が逆方向(例:下から上、右から左)に折り返されます。
  3. 代替のレイアウトフローや特定のデザイン要件に便利です。
コンテンツの動作を制御するオーバーフローオプションを選択します。

コンテナーの背景
フォーム
標準色、カスタム(カラーピッカー、16進コード)
背景色を選択します。
コンテナーのパディング
フォーム
px、%
間隔を調整するためにパディングを変更します。
コンテナーの角丸
フォーム
0px、6px、12px、16px、24px、丸
角丸の値を選択します。
コンテナーの枠線
フォーム
太さ:1~5、色
枠線の太さと色を選択します。
コンテナーの影
フォーム
なし、エレベーション 1~5
影のレベルを選択するか、影を削除します。
見出しの色
フォーム
標準色、カスタム
見出しテキストの色を選択します。
本文の色
フォーム
標準色、カスタム
本文テキストの色を選択します。
項目の背景色
フォーム
標準色、カスタム
背景色を選択します。
項目の枠線の色
フォーム
標準色、カスタム
枠線の色を選択します。
差し込み項目のテキスト色
フォーム
標準色、カスタム
差し込み項目のテキスト色を選択します。
ボタンのテキスト色
ボタン
標準色、カスタム
テキストの色を選択します。
ボタンの背景色
ボタン
標準色、カスタム
背景色を選択します。
ボタンの枠線
ボタン
太さ:1~5、色
枠線の太さと色を選択します。
リンクの色
リンク
標準色、カスタム
リンクの色を選択します。
リンクのテキスト色
リンク
標準色、カスタム
リンクテキストの色を選択します。
  1. ポータルページについて
  1. カスタマーポータル





              Zoho Campaigns Resources

                Zoho WorkDrive Resources




                  • Desk Community Learning Series


                  • Digest


                  • Functions


                  • Meetups


                  • Kbase


                  • Resources


                  • Glossary


                  • Desk Marketplace


                  • MVP Corner


                  • Word of the Day


                  • Ask the Experts









                                  • Related Articles

                                  • ポータルページのカスタマイズ

                                    お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。 このヘルプページは、2026年6月1日より前に作成されたポータルを利用しているCreator 6ユーザー向けです。 それ以降に作成されたポータルについては、ポータルページのカスタマイズの最新版に関するこちらのドキュメントを参照してください。 Creator ...
                                  • ポータルページの理解

                                    お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。 このヘルプページは、2026年6月1日より前に作成されたポータルを利用しているCreator 6ユーザー向けです。 それ以降に作成されたポータルについては、こちらのドキュメントを参照して、ポータルページのカスタマイズの最新バージョンについて確認してください。 Creator ...
                                  • ポータルページの理解

                                    お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。 このヘルプページは、2026年6月1日以降に作成されたポータルを利用しているCreator 6ユーザー向けです。 それ以前に作成されたポータルについては、古いバージョンのポータルページのカスタマイズについてこちらのドキュメントを参照してください。 Creator ...

                                  Resources

                                  Videos

                                  Watch comprehensive videos on features and other important topics that will help you master Zoho CRM.



                                  eBooks

                                  Download free eBooks and access a range of topics to get deeper insight on successfully using Zoho CRM.



                                  Webinars

                                  Sign up for our webinars and learn the Zoho CRM basics, from customization to sales force automation and more.



                                  CRM Tips

                                  Make the most of Zoho CRM with these useful tips.