ポータルページの概要

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

このヘルプページは Creator 6 をご利用のユーザー向けです。旧バージョン（Creator 5）をご利用の場合はこちらをクリックしてください。ご利用中の Creator のバージョンを確認しましょう。

概要（ポイント）

ポータルページは、外部ユーザー（ポータルユーザー）がアプリケーションにアクセスするためのエントリーページです。サインイン、ユーザー登録、パスワードの作成、パスワードのリセット用のページが含まれます。ポータルページデザイナーを使用して、ページやフォームの背景画像や色、枠線、配置、余白などを調整し、ポータルページの見た目をカスタマイズできます。

提供状況

ポータルは、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 アプリケーションのポータルにアクセスするためのパスワードをリセットできるページです。
パスワード作成	ポータルユーザーが、Creator アプリケーションのポータルにアクセスするためのパスワードを新たに作成できるページです。サインアップ後、ポータルユーザーには、このページに移動してパスワードを設定するためのリンクを含むメールが送信されます。

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

Zoho Creator では、ポータルのサインイン、ユーザー登録、パスワードリセットページのデザインをカスタマイズするための直感的なデザイナーを提供しています。この高度なデザイナーは 4 種類すべてのポータルページで共通しており、各ページのすべてのコンポーネントをカスタマイズできます。

デザイナーを使いこなすことで、ポータルページとアプリケーションとの間で最大限デザインを統一できます。各ポータルページには共通の一般プロパティに加え、ページ内のコンポーネント固有のプロパティがあります。コンポーネントは 3 つ（ポータルバックドロップ、ポータル列、ポータルフォーム）あり、以下で詳しく説明します。

ポータルページのコンポーネント

ポータルページには、ユーザーインターフェイスのデザインにそれぞれ異なる形で寄与する 3 つのコンポーネントがあります。各コンポーネントは独自のプロパティを持ち、それらを活用して特徴的なユーザーインターフェイスレイアウトを設計できます。コンポーネントは次のとおりです。

ポータルバックドロップ - ページ幅、余白、背景色、背景画像の編集や、見出し、表、スペーサーなどの要素を追加して、ポータルの背景全体をカスタマイズできます。
ポータル列 - ポータル列はポータルフォームを内包し、ニーズに合わせてカスタマイズできる追加の領域を持ちます。配置、余白、背景色、背景画像などを編集することができます。
ポータルフォーム - ポータルフォームには認証情報用の入力項目が含まれます。フォーム内の各要素について、背景色、ボタンや項目名のフォント、ボタンの色、リンクにカーソルを合わせたときの色などをカスタマイズできます。

ポータルバックドロップ

ポータルバックドロップ固有のプロパティを使用すると、ポータルページの既定要素およびカスタム要素をデザインできます。これらのプロパティは、ポータルページを編集するとデフォルトで表示されます。

プロパティ	アイコン	説明
ページ幅		初期設定 - ポータルページ全体に一律で適用される既定のページ幅です。メモ : 初期設定値は 100% に設定されます。カスタム - ポータルページの幅を、必要に応じてピクセル単位でカスタマイズできます。メモ : ページ幅を調整できるピクセル範囲は 790 ～ 1500 です。
Padding		コンテンツとポータルページの枠線との間の余白を、ピクセル単位でカスタマイズできます。メモ : パディングを調整できるピクセル範囲は 0 ～ 100 です。
背景色		ポータルページの背景色です。選択できる設定は次のとおりです。塗りつぶしなし - 背景を空白のままにします。プリセットカラー - あらかじめ定義されたカラースキームから背景色を選択します。その他の色 - カラーパレットから、必要に応じて任意の色を選択できます。HEX や RGB コードを使用して特定の色を指定することもできます。
背景画像		ポータルページの背景として表示される画像です。ファイルマネージャーまたはWeb URL からアップロードできます。アップロード後は、画像を変更したり削除したりできます。画像は .jpg または .png 形式で、ファイルサイズが 5MB 未満である必要があります。画像サイズ - ポータルページの背景に対する画像の表示方法を指定します。利用可能な設定は次のとおりです。 Auto Contain Cover
要素		デザイナー左側の要素列には、あらかじめデザインされた要素が用意されています。これらをポータルページの背景に追加できます。見出し段落画像表スペーサービルダーでは、各要素専用のツールバーが用意されており、表示値や外観のカスタマイズ、システム変数の挿入など、さまざまな操作が行えます。
元に戻す & やり直し		元に戻す - ポータルページの編集操作を 1 手順前に戻します。やり直し - ポータルページの編集で元に戻した操作を再実行します。メモ : これらの操作には、標準的なキーボードショートカットも使用できます。最大 10 回分の変更を元に戻したり、やり直したりできます。

ポータル列

ポータルフォームを内包するパネル（ポータル列）のプロパティをカスタマイズできます。これらのプロパティは、ポータル列をクリックすると表示されます。

プロパティ	アイコン	説明
配置		ポータル列内でのポータルフォームの配置を指定します。利用可能な設定は次のとおりです。左揃え中央揃え右揃え
余白		ポータル列のマージンと、その中に配置されたポータルフォームとの間の余白を指定します。利用可能な設定は次のとおりです。左上右下メモ : 余白として設定できるピクセル値の範囲は 0 ～ 1400 です。
背景色		ポータル列の背景色を指定します。選択できる設定は次のとおりです。塗りつぶしなし - 背景を透明（無色）のままにします。プリセットカラー - あらかじめ用意されたカラースキームから背景色を選択します。その他の色 - カラーパレットから任意の色を選択できます。特定の色を指定するために HEX や RGB コードを使用することもできます。
背景画像		ポータルページの背景として表示される画像です。ファイルマネージャーまたはWeb URLからアップロードできます。アップロード後は、画像を変更または削除できます。拡張子が .jpg または .png のファイルで、ファイルサイズが 5MB 未満である必要があります。画像サイズ - ポータルページの背景に対する画像の表示方法を指定します。利用可能な設定は次のとおりです。自動内側に収める（Contain）全面表示（Cover）

ポータル Form

ポータルフォーム専用の フォームカスタマイズ プロパティを使用して、ポータルフォームのデザインや設定を詳細にカスタマイズできます。これらのプロパティは、フォームカスタマイズ をクリックするか、ポータルフォーム自体を直接選択すると表示されます。

プロパティ	説明
Background	ポータルフォームの背景色です。
Border	Color - ポータルフォームの枠線の色です。 Style - 枠線のスタイルは次から選択できます: 実線破線点線 Width - ポータルフォームを囲む枠線の太さです。メモ: 枠線の太さは 0 ～ 20 ピクセルの範囲でカスタマイズできます。
Shadow	Shadow Color - ポータルフォームの影の色です。 X - X 軸方向の影の距離です。 Y - Y 軸方向の影の距離です。 Blur - 影のぼかし具合です。 Spread - 影の広がり具合です。
Typography	フォント Family -ポータルフォーム全体に適用されるフォントです。ドロップダウンから 23 種類のフォントファミリーを選択できます。件名 Text Color - 件名テキストの表示色です。本文 Text Color -本文テキストの表示色です。
項目 Input	Text Color - エンドユーザーが項目に入力するテキストの色です。差し込み項目 Color - 入力項目のプレースホルダーテキストの色です。 Background Color - 入力項目ボックスの背景色です。 Border Color - 入力項目ボックスの枠線の色です。メモ : これらのプロパティは、初期表示時とホバー時の両方について設定できます。初期設定タブとHoverタブを切り替えて設定します。
Button	Text Color - ボタン上に表示されるテキストの色です。 Background Color - ポータルフォーム内に配置されたボタンの背景色です。 Border Color - ポータルフォーム内に配置されたボタンの枠線の色です。メモ : これらのプロパティは、初期表示時とホバー時の両方について設定できます。初期設定タブとHoverタブを切り替えて設定します。
リンク	初期設定 Text Color - ポータルフォーム内に配置されたリンクテキストの表示色です。 Underline - リンクテキストを下線付きまたは下線なしで表示するかを設定します。メモ : これらのプロパティは、初期表示時とホバー時の両方について設定できます。初期設定タブとHoverタブを切り替えて設定します。