Платіжні форми полегшують прийом онлайн-платежів за допомогою Stripe і PayPal. Приймайте платежі та пожертви за лічені хвилини. Продавайте продукти, послуги, онлайн-курси та багато іншого.
Ви можете легко створити сторінку платежів або пожертв на твій сайт або сторінка отримати пожертву або одноразовий платіж за допомогою Оплата та пожертвування .
Це також дає вам можливість налаштувати поля форми, які ви хочете у своїй формі, і дозволяє вказати адресу електронної пошти, на яку надсилаються зібрані дані форми.
Усі дані форми також зберігаються та доступні в Налаштування > Надсилання форми розділ студії. Детальніше.
У цій статті:
- Додайте розділ на сторінку
- зміст
- макет
- стиль
- Налаштування
- Повідомлення електронною поштою
- Перевірте платежі та способи оплати
- Живий приклад
Додайте розділ «Платежі та пожертви».
- До сторінки можна додати розділ. Ви можете або додати розділ до вже існуючої сторінки, або створити нову сторінку на вашому веб-сайті.
- На вашій сторінці, натисніть на синій + значок додати а Новий розділ на свою сторінку.

- Тепер ви побачите категорії розділів на лівій стороні.
- Виберіть Форми (1) категорію та натисніть на Оплата та пожертви вкладка (2), де ви можете вибрати різні макети в Оплата та пожертви (3) розділ.

- Виберіть макет будь-якого розділу та натисніть на нього, щоб додати його на свою сторінку.
Керувати формою оплати
- Натисніть Редагувати вміст (1) кнопка.

- Ви матимете можливість керувати зміст (2) макет (3) стиль (4) Налаштування (5), і Повідомлення по електронній пошті (6).
- хіт Зберегти (7), щоб застосувати зміни до форми.

зміст
Керування полями форми
У розділі «Керування полями форми» ви можете вказати поля, які відвідувачі мають заповнювати у цій формі.
- Натисніть Додати нове поле (1), щоб додати більше полів до форми.
- Редагувати або видалити (2) уже додане поле.
- Перетягування (3) поля для зміни їхньої послідовності у формі.
- Встановіть Мітка кнопки заклику до дії (4) для форми.

- Натиснувши на + Додати поле відкриється спливаюче вікно, де ви зможете вибрати поля форми.

- Захоплення ім'я вашого клієнта.
- Зберігайте будь-яку дрібну інформацію за допомогою Короткий текст .
- Зберігайте будь-яку складну інформацію/повідомлення через Довгий текст .
- Захоплення e-mail вашого клієнта.
- Захопити будь-яку числова інформація від вашого клієнта.
- Додайте послуги на вибір у a випадає шлях.
- Один вибір: Додайте вибір радіо для своїх послуг.
- Множинний вибір: Додайте поле прапорця для кількох варіантів.
- Додавати збирач дат щоб ваші клієнти могли вибрати дату будь-якого заходу.
- Додавати лінія між полями форми.
- Захоплення адреса вашого клієнта.
- Захоплення сайт вашого клієнта.
- Захоплення телефон номер вашого клієнта.
- Додавати час щоб ваші клієнти могли вказати час події самостійно.
- Додавати роздільник між полями форми.
- Команда поле згоди опцію можна використовувати для отримання дозволів на інформаційні бюлетені, прийняття конфіденційності та умов використання.
- Отримайте відгуки клієнтів за допомогою зірка масштаб, шкала чисел та масштаб смайлика.
Стиль форми
- Показати форму як спливаюче вікно – Увімкніть цю опцію, щоб відкрити форму у спливаючому вікні, натиснувши кнопку заклику до дії.
- Мітка кнопки заклику до дії – Встановіть Мітка кнопки заклику до дії за форму.
- Спливаюче вікно заголовка – Вкажіть форму Заголовок, якщо якийсь.

- Завантажити або видалити (1) зображення форми для форми.
- Додавати назва (2), і Опис (3) для форми. Перш ніж додати опис, перевірте це статті.

Headline
- Headline – Вкажіть Заголовок розділу (1) для розділу Форма оплати.
- Кнопка та значки – Дізнайтеся більше про Кнопки та значки (2).

Управління макетом
- Натисніть на Редагувати вміст (1) кнопка.

- Виберіть макет (2) вкладка.
- Оберіть розташування для вашого розділу (3) і Зберегти (4) зміни.

Параметри стилю
- Натисніть Редагувати вміст (1) кнопка.

- Виберіть стиль (2) вкладка.
- Змініть стиль для елементів розділу та Зберегти (3) ваші зміни.

Стилізація форми є важливим аспектом створення візуально привабливого та зручного для користувача досвіду.
Ви матимете кілька варіантів стилю для розділу:
- Поля форми
- Вирівнювання
- текст
- Відстань
- Headline
- зображень
- Границя зображення
- Спливаюча кнопка
- Кнопка форми
- Кнопки заголовків
- Заголовки соціальних іконок
Поля форми
Pixpa дозволяє ви до повністю налаштувати зовнішній вигляд of ваш форму полів. Ці моделювання опції застосовувати до всі вхід поля in ваш Оплата Форма та дати ви великий контроль над як ваш форму виглядає та почуває on ваш .

- Форма: Оберіть форму полів введення, наприклад, прямокутну, закруглену, у формі таблетки або текстову, щоб вона відповідала естетиці вашого веб-сайту.
- Заповнити: Увімкніть цей перемикач, щоб застосувати колір фону до полів форми.
- Базовий колір: Встановіть колір фону полів, коли ввімкнено опцію заповнення.
- Outline: Увімкнути або вимкнути рамку (контур) для кожного поля.
- Колір контуру: Виберіть колір межі поля, коли контур увімкнено.
- Колір тексту поля: Встановіть колір тексту, який користувачі вводять у полях форми.
- Зріст: Налаштуйте висоту полів, вибравши один із варіантів: Маленький, Середній, Великий або Дуже великий.
- Мітки: Виберіть, де відображатимуться підписи полів форми: всередині поля чи зовні нього.
- Колір етикеткиВизначає колір підписів, розміщених за межами поля.
- Колір всередині етикетки: Встановіть колір для підписів, розміщених усередині поля (корисно для підписів у стилі заповнювачів).
- Відстань між полями: Використовуйте повзунок, щоб встановити вертикальний інтервал (у пікселях) між кожним полем форми.

Вирівнювання
- Керуйте вирівнюванням вмісту форми по горизонталі з Горизонтальне вирівнювання (1).
- Керуйте вирівнюванням вмісту форми по вертикалі з Вертикальне вирівнювання (2).

текст
- Натисніть на Змінити стиль тексту (1), щоб відвідати Дизайн розділ і керуйте розмірами та стилями шрифтів.
- Вкажіть назва (2) стиль шрифту форми.
- Вкажіть Опис (3) стиль шрифту форми.

Відстань
- Вкажіть Зображення ширини (1) зображення у формі у відсотках.
- Вкажіть Відстань між зображенням і текстом (3) у відсотках.
- Вкажіть Пробіл під заголовком (4) у відсотках.

Headline
- Горизонтальне вирівнювання текст заголовка розділу. Ви можете встановити його вліво, по центру та праворуч.
- Увімкнути/вимкнути дільник між заголовком розділу та вмістом розділу.
- Встановіть товщина розділювача (у пікселях).
- Вкажіть Колір розділювача із засобу вибору кольорів.
- Вибрати Стиль роздільника з випадаючого.
- Встановіть Ширина заголовка щоб визначити ширину відображення заголовка розділу, починаючи щонайменше з 50%.
- Вкажіть Простір під заголовком у межах розділу (у пікселях).

зображень
- Обрізання зображення: Виберіть Iмаг Кроп для елементів списку. Ви можете встановити зображення як квадрат, коло, горизонталь, портрет і оригінальне.
- Радіус кута: Виберіть загальний радіус кута або інший радіус кута для кожної сторони елементів списку та встановіть число (у пікселях) для Cкутовий радіус зображень елементів списку. Більше інформації.
- Анімація наведення курсора: Виберіть Анімація зображення розділу при наведенні курсора, увімкнувши перемикач. Перевірте цю функцію на живій сторінці.
- Стиль анімації: Виберіть Стиль анімації для зображення, коли курсор наведено на них.
- Форма маски: Увімкніть цей перемикач, щоб застосувати маску форми до зображень у розділі «Список зображень». Після ввімкнення вибрана фігура візуально закріпить зображення в цій формі.
- Виберіть форму: Вибирайте з різноманітних попередньо визначених форм для застосування до своїх зображень. Це дозволяє творчо стилізувати ваш вміст, відображаючи зображення в унікальних формах, як-от закруглені, ромбові, краплі тощо.

- Якщо ви вибрали розділені кути, ви можете встановити різний радіус кута для кожного кута.

Границя зображення
- Увімкнути/вимкнути рамку навколо зображення, перемикаючи перемикач.
- Виберіть мати a спільний кордон з усіх боків зображення або ви можете вказати межі окремо для кожної сторони.
- Вкажіть ширина кордону. Якщо встановлено значення 0, то межа не з’явиться. У вас також є можливість встановити ширину рамки окремо для кожної сторони зображення.
- Оберіть виділяє колір із засобу вибору кольорів.
- Виберіть потрібний Прикордонний стиль з випадаючого.
- Визначте ширина рамки для мобільних пристроїв пристроїв, вирівнявши його за шириною, вибраною для робочого столу.

Спливаюча кнопка
Ці параметри стилю призначені для спливаючої кнопки, після натискання якої відкриється форма оплати.
- Розмір кнопки – Виберіть розмір кнопки з таких варіантів, як маленький, середній або великий.
- Простір над кнопкою – Налаштуйте вертикальний інтервал над кнопкою (у відсотках).
- Стиль кнопки – Виберіть стиль кнопки, наприклад, стандартний або власний.
- Колір кнопки – Виберіть колірний стиль для кнопки. Доступні варіанти: «За замовчуванням», «Інвертувати» або «Налаштування».
- Текст кнопки – Налаштуйте колір тексту для кнопки.
- Фон кнопки – Виберіть колір фону для кнопки.

Кнопка форми
Ці налаштування дозволяють налаштувати кнопку надсилання форми відповідно до дизайну та макета сторінки.
- Розмір кнопки – Виберіть розмір кнопки (Маленька, Середня або Велика).
- Простір над кнопкою – Налаштуйте вертикальний інтервал над кнопкою (задано у відсотках).
- Стиль кнопки – Виберіть загальний стиль кнопки, наприклад, «За замовчуванням» або «Налаштування».
- Колір кнопки – Встановіть стиль кольору кнопки. Доступні такі варіанти: «За замовчуванням», «Інвертувати» або «Налаштування».
- Текст кнопки – Налаштуйте колір тексту, що відображається на кнопці.
- Фон кнопки – Виберіть колір фону для кнопки.
- Вирівнювання кнопок – Виберіть вирівнювання кнопки (Ліворуч, По центру або Праворуч).
- Ширина кнопки – Налаштуйте ширину відображення кнопки. Доступні такі варіанти: «За замовчуванням», «Великий», «Надзвичайно великий» або «Повна ширина».

Кнопки заголовків
Ці налаштування контролюють зовнішній вигляд та інтервал між кнопками, розміщеними із заголовком розділу.
- Розмір кнопки – Виберіть загальний розмір кнопок (Маленький, Середній або Великий).
- Простір між кнопками – Відрегулюйте відстань між кількома кнопками (вимірюється у vw).
- Простір над кнопками – Встановіть вертикальний інтервал над кнопками (вимірюється у відсотках).
- Ширина кнопки – Виберіть ширину відображення кнопок. Доступні такі варіанти: «За замовчуванням», «Великий», «Надзвичайно великий» та «Повна ширина».
- Розмір текстового посилання – Вкажіть розмір шрифту текстових посилань, пов’язаних із кнопками (вимірюється в пікселях).
- Розмір кнопки зображення – Налаштуйте розмір кнопок на основі зображень (вимірюється в пікселях).

Заголовки соціальних іконок
Відображати та налаштовувати значки соціальних мереж у формі.
- Розмір значка – Налаштуйте розмір значків соціальних мереж (вимірюється в пікселях).
- Тип значка – Виберіть стиль значків, наприклад, «Класичний», «Суцільний» або «Контур».
- Колір значка – Виберіть колір для значків. Доступні такі варіанти: «Текст посилання», «Власний» або «Колір бренду» (оригінальний колір соціальної платформи).
- Колір фону значка – Встановіть власний колір фону для значків, щоб покращити їх видимість та стиль.

Налаштування
- Натисніть на Редагувати вміст (1) кнопка.

- Налаштуйте параметри форми з Налаштування (2) вкладка та Зберегти (3) ваші зміни.

Назва форми
- Введіть ім'я для визначити форму оплати у Pixpa Studio. Це ім'я не видно відвідувачам веб-сайту.

спосіб оплати
- Ви можете оновити способи оплати для форми.
- Ви можете вибрати Paypal і Stripe. Індійські клієнти також можуть додати Razorpay і PayUMoney Детальніше.

Дії після подання
Як дію після подання ви можете вибрати Показати повідомлення про успіх (1) або Перенаправлення на URL-адресу (2).

В випадку Показати повідомлення про успіх (1):
- Вкажіть Повідомлення про успішний платіж (2) який відображається після того, як користувач надсилає форму.
- Ви також можете додати будь-який сценарій у успіх після оплати HTML (3) коробка

- В випадку Redirect на URL, ви можете вказати будь-яку внутрішню/зовнішню сторінку, натиснувши на значок налаштувань (⚙️). Більше інформації.

Синхронізація та експорт даних форми
- Надсилання даних форми до Make.com. Детальніше.
- Надсилання даних форми на Zapier.com. Детальніше.
- Експортувати дані форми у форматі CSV-файлу. Детальніше.

Повідомлення електронною поштою
Тут ви можете налаштувати тему електронного листа для сповіщень, які ви отримуватимете як власник веб-сайту після успішного надсилання форми. Крім того, ви можете персоналізувати електронний лист про успіх, який надсилається користувачам або клієнтам після того, як вони надішлють форму та здійснять платіж.
- Увімкніть Електронний лист власнику веб-сайту можливість отримувати сповіщення електронною поштою щоразу, коли надсилається платіжна форма.
- Перейдіть на вкладку Тематичне поле, вкажіть тему електронного листа для надсилання платіжної форми. Ви також можете скористатися {ВЕБ-САЙТ} змінна, щоб автоматично додавати назву вашого веб-сайту до теми листа. Це особливо корисно, якщо ви керуєте кількома веб-сайтами.
- Перейдіть на вкладку Поле електронної пошти, введіть до 3 адрес електронної пошти, на які ви бажаєте отримувати сповіщення про платіжні форми.

- Увімкнути/вимкнути успіх Електронна пошта клієнту варіант.
- Вкажіть Тема електронного листа успіху.
- Додайте тіло електронної пошти до електронного листа про успіх. Ви можете додати змінні в тіло листа, які будуть записані та надіслані в електронних листах {TRANSACTION_ID}, {AMOUNT} та {NAME}.

Перевірте платежі та додайте спосіб оплати
- Перейдіть до Платежі та пожертви (1) .
- Тут ви можете переглянути всі платежі, які ви отримали.
- Оберіть дата, отримана сума та адреса електронної пошти (2) платежу.
- Натисніть на будь-яку форму (3) щоб переглянути деталі транзакції платежу.
- Перевірте деталі транзакції, наприклад Ідентифікатор транзакції, ім’я, використаний спосіб оплати та ідентифікатор транзакції методу оплати з правої шухляди.
- Експортуйте всі платіжні реквізити в a Формат CSV (4).

Додати спосіб оплати
- Перейдіть до Налаштування розділ (1) і натисніть на Приймати платежі опція (2) з меню ліворуч.
- Тепер перевірте активні та неактивні методи оплати.
- Натисніть Кнопка включення (3) щоб увімкнути спосіб оплати і навпаки.
- Спілкування Смуга or Paypal Business. Індійські клієнти також можуть увімкнути PayUMoney or Razorpay.

Ось форма оплати/пожертви:

Перегляньте демонстраційний сайт
