ウェブPDFフォームのデザイン
タブ
フォームの外観をブランドに合わせてカスタマイズできます。以下のことが可能です。
- ロゴを追加し、フォントを変更し、カラーを調整します。
- テーマを適用してスタイルを素早く更新します。
- デザイン設定を微調整して洗練された外観にします。
フォームデザイナーにアクセスする
-
ダッシュボードから既存のウェブPDFフォームを開きます。
-
フォームビルダーの左上にあるプレビュー＆デザインボタンをクリックします。
これにより、フォームのデザインを調整できるプレビューが開きます。
テーマを適用する
テーマを使用すると、フォームの外観を瞬時に変更できます。
-
左下隅にあるテーマボタンをクリックします。
テーマパネルが表示されます。
-
フォームに合ったテーマを選択します。
共有フォームテーマとして保存
チーム用にカスタムテーマを作成したい場合は、共有フォームテーマとして保存を使用します。
-
テーマボタンをクリックしてテーマパネルを展開します。
-
テーマを選択するか、カスタマイズします。
-
共有フォームテーマとして保存をクリックします。
-
テーマに名前を付けて保存をクリックします。
これで、チームはこのテーマを他のフォームに適用できます。
フォームデザインをカスタマイズ
フォームスタイルをさらにカスタマイズすることもできます。すべての変更は即座にプレビューされます。
-
プレビューページで、右上のデザインフォームボタンをクリックします。
デザインフォームパネルが開きます。
-
必要に応じてデザインを修正します。
Note利用可能なカスタマイズオプションについては、フォームデザインプロパティセクションをご覧ください。
-
希望する修正を行った後、保存をクリックして変更を適用します。
フォームデザインプロパティ
| プロパティ | 説明 |
|---|---|
| 外観 | フォームのビジュアルテーマをカスタマイズします。
|
| ロゴ | PNGまたはJPG（最大10MB）をアップロードしてフォームにロゴを表示します。
|
| ナビゲーションバー | フォームに複数のページがある場合、ナビゲーションバーを有効にすると、ユーザーがページ間を切り替えるためのトップメニューが追加されます。 注意: フォームをデザインする際にページブレークを挿入してページを追加します。 |
| ナビバーのスタイル | ナビゲーションバーが有効になったら、フォームのデザインに合ったスタイルを選択します。オプションにはタブ、プログレスバー、またはサイドバーナビゲーションが含まれます。 |
| ヘルプテキスト | フォームフィールドにヘルプテキストを追加した場合、その表示位置を選択します。
|
| RTLフォーム | アラビア語、ヘブライ語、ペルシャ語などの言語に適した右から左へのレイアウトでフォームを表示します。この設定はテキストの配置と全体的なフォームの方向に影響します。 |
| 角の丸み | フォームの要素に丸みを加え、スムーズでモダンな外観にします。 |
| マテリアルスタイル | マテリアルデザインに似た、入力フィールドのためのミニマリストな直線デザインを使用します。 |
| フォーム幅 | フォーム全体の幅を調整します。オプションには以下が含まれます。
|
| フォームマージン | フォームの端にスペースを設定します。オプションには以下が含まれます。
|
| フォント | システムのデフォルトフォントを使用するか、ブランドのアイデンティティに合わせてカスタムフォントをアップロードします。 |
| フォントサイズ | 読みやすさを確保するためにテキストサイズを調整します。利用可能なサイズは小から特大までです。 |
| 行間 | テキスト行間のスペースを制御します。オプションはXS、S、M、L、またはXLで、最適な読みやすさを提供します。 |
| ラベルレイアウト | 入力フィールドに対するラベルの配置を定義します。カスタマイズが選択されている場合、各フィールドのプロパティパネルに戻って個々のラベル位置を調整します。 |
| ラベル幅 | フォーム要素間で一貫した配置を確保するためにフィールドラベルの幅を指定します。 |
さらにカスタムスタイル
さらにカスタムスタイル機能を使用して、フォームの外観と動作をさらにカスタマイズできます。
-
フォームエディタでさらにカスタムスタイルボタンをクリックします。
-
3つのカスタマイズオプションから選択します。
- デザインタブ: 背景画像を変更し、バナーサイズを調整し、レイアウト要素を修正します。
- CSSタブ: フォント、カラー、スペースをスタイルするためのカスタムCSSを追加します。
- JSタブ: JavaScriptを使用してラベルをカスタマイズし、ロジックを追加し、フォームの動作を制御します。
NoteJavaScriptは安全で、セキュリティを維持するためにカスタムドメインでのみ動作します。
-
調整を行った後、保存をクリックして変更を適用します。