Ustawienia stylu formularza - Referencje
W tym dokumencie
Czas czytania: 4 minuty | Poziom trudności: Średniozaawansowany
Przegląd
To jest kompletny spis wszystkich dostępnych ustawień stylu formularza w WP Simple Pay. Używaj go wraz z głównym przewodnikiem po stylu formularza, aby uzyskać szczegółowe instrukcje konfiguracji.
Wymagania wstępne
- WP Simple Pay Pro z licencją Plus lub wyższą
- Formularz płatności używający typu formularza w witrynie (Osadzony lub Nakładka)
Predefiniowane motywy
| ID motywu | Nazwa | Podstawowy | Drugorzędny | Tekst | Tło |
|---|---|---|---|---|---|
domyślny |
Domyślny | #0f8569 |
#0e7c62 |
#32325d |
#ffffff |
zachód słońca |
Zachód słońca | #e74c3c |
#c0392b |
#2c3e50 |
#ecf0f1 |
las |
Las | #27ae60 |
#219955 |
#2c3e50 |
#f9f9f9 |
ocean |
Ocean | #3498db |
#2980b9 |
#2c3e50 |
#ecf0f1 |
monochromatyczny |
Monochromatyczny | #333333 |
#555555 |
#333333 |
#ffffff |
słoneczny |
Słońce | #f1c40f |
#f39c12 |
#34495e |
#ffffff |
koralowy |
Koralowy | #e67e22 |
#d35400 |
#2c3e50 |
#f9f9f9 |
minimalny |
Minimalny | #bdc3c7 |
#95a5a6 |
#2c3e50 |
#ffffff |
Po wybraniu motywu, kolor podstawowy jest mapowany na tło przycisku i kolor akcentu, kolor drugorzędny jest mapowany na stan najechania myszką na przycisk, kolor tekstu jest mapowany na ogólne kolory tekstu i etykiet, a kolor tła jest mapowany na tło formularzy i pól wejściowych.
Ustawienia kolorów
Wszystkie ustawienia kolorów akceptują:
- Kolory szesnastkowe:
#0f8569,#fff - RGB/RGBA:
rgba(15, 133, 105, 0.8) - HSL/HSLA:
hsl(160, 80%, 29%) - Pusta wartość (dziedziczy domyślną lub powraca do ustawienia nadrzędnego)
| Ustawienie | Opis | Zachowanie awaryjne |
|---|---|---|
| Tło formularza | Tło kontenera formularza | Przezroczysty (dziedziczy tło strony) |
| Tło pola wejściowego | Tło pola wejściowego | Przezroczysty |
| Ogólny kolor tekstu | Wszystkie elementy tekstowe | Domyślny dla przeglądarki |
| Kolor tekstu etykiety | Tylko etykiety pól | Powraca do Ogólnego koloru tekstu |
| Kolor tekstu w polach | Tekst wewnątrz pól | Powraca do Ogólnego koloru tekstu |
| Kolor tytułu | Tytuł formularza | Powraca do Ogólnego koloru tekstu |
| Kolor opisu | Opis formularza | Powraca do Ogólnego koloru tekstu |
| Kolor podstawowy (akcent) | Stany fokusu, podświetlenia | Domyślny dla motywu |
| Kolor obramowania | Obramowania pól i elementów | Domyślny dla motywu |
| Kolor obramowania błędu | Obramowania błędów walidacji | Domyślny czerwony |
| Kolor tekstu błędu | Tekst komunikatu o błędzie | Domyślny czerwony |
| Tło przycisku | Tło przycisku wysyłania | Kolor podstawowy |
| Tekst przycisku | Tekst przycisku wysyłania | Biały |
| Tło przycisku po najechaniu | Stan przycisku wysyłania po najechaniu | Ciemniejszy podstawowy |
Ustawienia typografii
| Ustawienie | Opis | Dozwolone wartości | Domyślny |
|---|---|---|---|
| Rozmiar czcionki etykiety | Rozmiar etykiety pola | Liczba całkowita dodatnia (piksele) | 14 |
| Grubość czcionki etykiety | Grubość etykiety pola | normal, pogrubiony, 100–900 |
— |
| Rozmiar czcionki pola wprowadzania | Rozmiar tekstu pola wprowadzania | Liczba całkowita dodatnia (piksele) | 16 |
| Rozmiar czcionki tytułu | Rozmiar tytułu formularza | Liczba całkowita dodatnia (piksele) | 24 |
| Grubość czcionki tytułu | Grubość tytułu formularza | normal, pogrubiony, 100–900 |
— |
| Rozmiar czcionki opisu | Rozmiar opisu formularza | Liczba całkowita dodatnia (piksele) | 16 |
| Grubość czcionki opisu | Grubość opisu formularza | normal, pogrubiony, 100–900 |
— |
Ustawienia projektu i układu
| Ustawienie | Opis | Dozwolone wartości | Domyślny |
|---|---|---|---|
| Promień zaokrąglenia obramowania formularza | Zaokrąglenie narożników kontenera formularza | Liczba całkowita dodatnia (piksele) | 0 |
| Promień zaokrąglenia obramowania pól wprowadzania i przycisków | Zaokrąglenie narożników pól wprowadzania/przycisków | Liczba całkowita dodatnia (piksele) | 4 |
| Wypełnienie formularza | Wewnętrzne odstępy kontenera formularza | Liczba całkowita dodatnia (piksele) | 0 |
Zastosowanie
| Typ formularza | Zastosowano style? |
|---|---|
| Osadzony na stronie | Tak |
| Nakładka na miejscu (modalna) | Tak |
| Kasa Stripe (poza witryną) | Nie |
| Strona płatności (na miejscu) | Tak |
Co dalej?
- Stylizacja formularzy płatności za pomocą stylu formularza – Przewodnik konfiguracji krok po kroku
- Typy wyświetlania metod płatności – Wybierz między układami zakładek i akordeonu
Nadal masz pytania? Jesteśmy tutaj, aby pomóc!
Ostatnio zmodyfikowano: