ポータルページの概要
お知らせ：当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。
このヘルプページは Creator 6 をご利用のユーザー向けです。旧バージョン（Creator 5）をご利用の場合は こちらをクリックしてください。ご利用中の Creator のバージョンを確認する方法はこちら。概要
ポータルページは、ポータルユーザー（外部ユーザー）がアプリケーションにアクセスするためのエントリポイントです。サインイン、ユーザー登録、パスワードの作成、パスワードのリセット用のページが含まれます。さらに、ポータルページデザイナーを使って、ポータルページやそのフォームの背景画像や色、枠線、配置、余白などを調整し、ページの見た目をカスタマイズできます。
提供状況
1. 概要
ポータルページは、ユーザーがサービスに登録したり、ログインしたり、認証情報をリセットしたりするためのポータルを収容する、整理されたページ構造です。また、ポータルに関する必要な情報を表示し、エンドユーザーが認証情報などのデータを入力するための入力項目も提供します。多くの場合、これらのページは、情報の表示方法とデザインの両面で、オンラインサービスの目的やテンプレートと調和するように作られています。
Creator では、ポータルには、ポータルユーザーのライフサイクルに不可欠な 4 つの要素 ― サインイン、ユーザー登録、パスワード作成、パスワードリセットの各ページ ― があります。各ポータルページは複数の行と列で構成され、その中にポータルフォーム、関連する見出し、説明テキスト、背景画像などが含まれます。
Zoho Creator では、これらの各ページに対してデフォルトで堅牢なデザインが用意されており、ポータルページデザイナーを使ってさらにカスタマイズできます。ページの設計に利用できる詳細なプロパティについては、ポータルページのカスタマイズの手順をご確認ください。
1。1 動作イメージ
1。2 ユースケース
たとえば、中古の高級車を再販するZylker Automobile Resaleアプリケーションを構築したとします。プラットフォーム上で自分の車の価格を提示し、出品したい認証済みの売り手向けにポータルを追加したとします。彼らがあなたのサービスに登録するためのページ、継続的にログインするためのページ、パスワードをリセットしたい場合のページなど、用途ごとに別々のポータルページを用意できます。これらのページは、自社の目的に合うようにデザインしましょう。ポータルページデザイナーを使用して、既存アプリケーションのデザインと調和する背景色を設定し、そのページの目的を視覚的に説明する画像を追加します。また、ログイン用ポータルページについては、ポータルフォームや入力項目、ボタンの色やテキストスタイルを選択して、ブランドのテーマに合うようにカスタマイズすることもできます。
1。3 ナビゲーションガイド
Creator アカウントにサインインすると、左側ペインのDEPLOYセクションの下にPortalsが表示されます。そこで、あらかじめ作成しておいた目的のポータルを選択すると、Page カスタマイズタブを選べます。ここからポータルページをカスタマイズできます。
1。4 ポータルページの種類
Zoho Creator アプリケーション内でポータルを作成すると、4 種類のポータルページが用意されます。各ページの詳細は以下のとおりです。
|
ポータルページの種類
|
説明
|
|
ユーザー登録
|
|
|
サインイン
|
ポータルユーザーが、Creator アプリケーションのポータルにアクセスするための認証情報を入力するページです。
|
|
パスワードリセット
|
ポータルユーザーが、Creator アプリケーションのポータルにアクセスするためのパスワードをリセットできるページです。
|
|
パスワード作成
|
ポータルユーザーが、Creator アプリケーションのポータルにアクセスするためのパスワードを新たに作成できるページです。サインアップ後、ポータルユーザーには、このページに移動してパスワードを設定するためのリンクを含むメールが送信されます。 |
1。5 ポータルページのカスタマイズ
Zoho Creator では、ポータルのサインイン、ユーザー登録、パスワードリセットページのデザインをカスタマイズするための直感的なデザイナーが用意されています。この高機能なデザイナーは 4 つすべてのポータルページで共通で、各ページのすべてのコンポーネントをカスタマイズできます。
デザイナーを活用することで、ポータルページとアプリケーションとの間で、最大限一貫したデザインを実現できます。各ポータルページには共通の一般プロパティに加え、そのページに含まれるコンポーネント固有のプロパティがあります。コンポーネントは 3 つ（ポータルバックドロップ、ポータル列、ポータルフォーム）あり、以下で詳しく説明します。
ポータルページのコンポーネント
ポータルページには、ユーザーインターフェイスのデザインにさまざまな形で寄与する 3 つのコンポーネントがあります。各コンポーネントは独自のプロパティを持ち、それらを活用して特徴的なユーザーインターフェイスレイアウトを設計できます。コンポーネントは次のとおりです。
- ポータルバックドロップ - ページ幅、余白、背景色、背景画像の編集や、見出し、表、スペーサーなどの要素を追加して、ポータルバックドロップをカスタマイズできます。
- ポータル列 - ポータル列にはポータルフォームが含まれ、その周囲の余白部分もニーズに合わせてカスタマイズできます。配置、余白、背景色、背景画像などを編集することができます。
- ポータルフォーム - ポータルフォームには認証情報用の入力項目が含まれます。フォーム内の各要素について、背景色、ボタンや項目名のフォント、ボタンの色、リンクにカーソルを合わせたときの色などをカスタマイズできます。
ポータルバックドロップ
ポータルバックドロップ固有のプロパティを使用すると、ポータルページの既定要素およびカスタム要素をデザインできます。これらのプロパティは、ポータルページを編集するとデフォルトで表示されます。
|
プロパティ
|
アイコン
|
説明
|
|
ページ幅
|
|
 メモ : 初期設定 値は幅 100% に設定されます。
メモ : ページ幅を調整できるピクセル範囲は 790 ～ 1500 です。
|
|
Padding
|
|
コンテンツとポータルページの枠線との間の余白を、ピクセル単位でカスタマイズできます。
メモ : パディングを調整できるピクセル範囲は 0 ～ 100 です。
|
|
背景色
|
|
ポータルページの背景色です。選択できる設定は次のとおりです。
|
|
背景画像
|
|
ポータルページの背景として表示される画像です。ファイルマネージャーまたはWeb URLからアップロードできます。
|
|
要素
|
|
デザイナー左側の要素列には、あらかじめデザインされた要素が用意されています。これらをポータルページの背景に追加できます。
ビルダーでは、要素ごとのツールバーが用意されており、表示値や外観のカスタマイズ、システム変数の挿入など、さまざまな操作が行えます。
|
|
元に戻す & やり直し
|
|
メモ :
|
ポータル列
ポータルフォームを内包するポータル列パネルをカスタマイズするための、ポータル列固有のプロパティです。ポータル列をクリックすると設定できます。
|
プロパティ
|
アイコン
|
説明
|
|
配置
|
|
ポータル列内でのポータルフォームの配置です。利用可能な設定は次のとおりです。
|
|
余白
|
|
ポータル列のマージンと、その中に配置されたポータルフォームとの間の余白です。利用可能な設定は次のとおりです。
メモ : 余白を設定できるピクセル範囲は 0 ～ 1400 です。
|
|
背景色
|
|
ポータル列の背景色です。選択できる設定は次のとおりです。
|
|
背景画像
|
|
ポータルページの背景として表示される画像です。ファイルマネージャーまたはWeb URLからアップロードできます。
|
ポータルフォーム
ポータルフォーム専用の フォームカスタマイズ プロパティを使用すると、ポータルフォームのデザインとカスタマイズを詳細に行えます。これらのプロパティは、フォームカスタマイズ をクリックするか、ポータルフォームを直接選択することでアクセスできます。
|
プロパティ
|
説明
|
|
Background
|
ポータルフォームの背景色です。
|
|
Border
|
メモ: 枠線の太さは 0 ～ 20 ピクセルの範囲でカスタマイズできます。
|
|
Shadow
|
|
|
Typography
|
|
|
項目 Input
|
メモ : これらのプロパティは、通常時の表示とホバー時の表示の両方に対して設定できます。初期設定タブとHoverタブを切り替えて設定します。
|
|
Button
|
メモ : これらのプロパティは、通常時の表示とホバー時の表示の両方に対して設定できます。初期設定タブとHoverタブを切り替えて設定します。
|
|
リンク
|
初期設定 Text Color - ポータルフォーム内に配置されたリンクテキストの色です。
Underline - リンクテキストを下線付きまたは下線なしで表示するかを指定します。
メモ : これらのプロパティは、通常時の表示とホバー時の表示の両方に対して設定できます。初期設定タブとHoverタブを切り替えて設定します。
|
2. 注意点
- ポータルページ内の各要素に対して、行単位および列単位でカスタマイズを行うことができます。利用可能なプロパティは次のとおりです:
- Row - Spacing、Fill Color、HTML の編集、Border
- 列 - Fill Color、Border
- デザイナーで行った変更は自動的に保存されます。
- ポータルページ内のすべての列の幅は、列の境界をドラッグして調整できます。