WP Simple Pay ドキュメント

WP Simple Pay のドキュメント、参考資料、チュートリアル

フォームスタイル設定リファレンス

読む時間: 4分 | 難易度: 中級

概要

これは、WP Simple Pay で利用可能なすべてのフォームスタイル設定の完全なリファレンスです。詳細なセットアップ手順については、メインのフォームスタイルガイドと併せてご使用ください。

前提条件

  • Plusライセンス以上のWP Simple Pay Pro
  • オンサイトフォームタイプ(埋め込みまたはオーバーレイ)を使用する支払いフォーム

テーマプリセット

テーマID 名前 プライマリ セカンダリ テキスト 背景
デフォルト デフォルト #0f8569 #0e7c62 #32325d #ffffff
サンセット サンセット #e74c3c #c0392b #2c3e50 #ecf0f1
#27ae60 #219955 #2c3e50 #f9f9f9
#3498db #2980b9 #2c3e50 #ecf0f1
白黒 白黒 #333333 #555555 #333333 #ffffff
太陽光 太陽光 #f1c40f #f39c12 #34495e #ffffff
サンゴ サンゴ #e67e22 #d35400 #2c3e50 #f9f9f9
ミニマル ミニマル #bdc3c7 #95a5a6 #2c3e50 #ffffff

テーマを選択すると、プライマリカラーはボタンの背景とアクセントカラーに、セカンダリカラーはボタンのホバー状態に、テキストカラーは一般的なテキストとラベルの色に、背景色はフォームと入力フィールドの両方の背景にマッピングされます。

色の設定

すべての色の設定で受け入れられる形式:

  • 16進数カラー:#0f8569#fff
  • RGB/RGBA:rgba(15, 133, 105, 0.8)
  • HSL/HSLA:hsl(160, 80%, 29%)
  • 空の値(デフォルトを継承するか、親の設定にフォールバックします)
設定 説明 フォールバック動作
フォームの背景 フォームコンテナの背景 透明(ページの背景を継承)
入力フィールドの背景 入力フィールドの背景 透明
一般的なテキストの色 すべてのテキスト要素 ブラウザのデフォルト
ラベルテキストの色 フィールドラベルのみ 一般的なテキストの色にフォールバック
入力フィールドのテキストの色 入力フィールド内のテキスト 一般的なテキストの色にフォールバック
タイトルの色 フォームのタイトル 一般的なテキストの色にフォールバック
説明の色 フォームの説明 一般的なテキストの色にフォールバック
プライマリ(アクセント)カラー フォーカス状態、ハイライト テーマデフォルト
境界線の色 入力および要素の境界線 テーマデフォルト
エラー境界線の色 検証エラーの境界線 デフォルトのエラー
エラーテキストの色 エラーメッセージテキスト デフォルトのエラー
ボタンの背景 送信ボタンの背景 プライマリカラー
ボタンテキスト 送信ボタンテキスト
ボタンのホバー時の背景 送信ボタンのホバー時の状態 より暗いプライマリ

タイポグラフィ設定

設定 説明 受け入れ可能な値 デフォルト
ラベルのフォントサイズ フィールドラベルのサイズ 正の整数(ピクセル) 14
ラベルのフォントウェイト フィールドラベルのウェイト normalbold100900
入力フォントサイズ 入力テキストサイズ 正の整数(ピクセル) 16
タイトルのフォントサイズ フォームタイトルのサイズ 正の整数(ピクセル) 24
タイトルのフォントウェイト フォームタイトルの太さ normalbold100900
説明フォントサイズ フォーム説明サイズ 正の整数(ピクセル) 16
説明フォントの太さ フォーム説明の太さ normalbold100900

デザインとレイアウト設定

設定 説明 受け入れ可能な値 デフォルト
フォームの角丸半径 フォームコンテナの角丸加工 正の整数(ピクセル) 0
入力欄とボタンの角丸半径 入力欄/ボタンの角丸加工 正の整数(ピクセル) 4
フォームのパディング フォームコンテナの内部余白 正の整数(ピクセル) 0

適用対象

フォームタイプ スタイルが適用されていますか?
サイト埋め込み はい
サイトオーバーレイ(モーダル) はい
Stripe Checkout(サイト外) いいえ
支払いページ(サイト内) はい

次にやること

まだ質問がありますか?私たちが喜んでお手伝いします!

最終更新日:

今日から決済を受け付けましょう

WordPressウェブサイトで、単発および定期的な支払いまたは寄付の受け付けを開始しましょう。