Статті на: Контактні форми
Ця стаття також доступна на:

Створення калькулятора у контактній формі

Калькулятор у контактних формах дає змогу автоматично розраховувати значення на основі заповнених відвідувачем сайту полів форми.


Ви можете відмітити необхідні для розрахунку поля форми та написати формулу, за якою здійснюватиметься розрахунок, — після чого ваш клієнт зможе бачити результат розрахунку одразу після заповнення усіх обов’язкових полів форми. Це значення також передаватиметься разом з усією інформацією після відправлення контактної форми.


Або ж ви можете приховати кнопку відправки форми і тоді калькулятор слугуватиме суто як інструмент розрахунку для відвідувачів сайту.


У цій статті ми розглянемо приклад того, як ви можете створити та використовувати калькулятор на вашому сайті.


Зміст:



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


Налаштування полів калькулятора


Наведіть курсором на контактну форму та натисніть на неї, щоб відкрити її налаштування. У вкладці Пункти ви можете керувати присутніми полями та додавати нові:

Підказка: ви можете детальніше ознайомитися з налаштуваннями полів форми у нашій статті.


Примітка: поля, які ми розглядаємо далі, використовуються саме для розрахунків — при цьому, у вашій контактній формі також можуть бути присутні інші поля, як-от для введення клієнта імені, номеру телефона тощо.


Для створення власного калькулятора вам будуть доступні наступні поля:



Випадний список, Радіокнопка, Чекбокс


  1. Додайте відповідне поле та налаштуйте його потрібним вам чином: задайте йому назву, опції для вибору, зробіть обовʼязковим за потреби тощо.


  1. Після створення поля активуйте опцію Використовувати для розрахунків та вкажіть довільну назву змінної для цього поля, яку ви пізніше будете використовувати у формулі розрахунку:

  1. Далі ви зможете для кожної доданої опції вказати потрібну цінність (числове значення), яка буде використовуватися у розрахунках у разі вибору цієї опції:

Число


Це поле, яке підтримує виключно числові значення: цифри, кому та крапку.


Аналогічно до описаних вище полів, додайте його до вашої форми, та у налаштуваннях активуйте опцію Використовувати для розрахунків і встановіть назву змінної:

Створення формули розрахунку


  1. Для створення формули та відображення результатів розрахунків вам необхідно додати поле Формула для розрахунку та перейти до його налаштувань.


  1. У налаштуваннях цього поля вам необхідно прописати формулу для розрахунків, яка буде використовувати створені раніше змінні та символи + (додавання) , - (віднімання), * (множення), / (ділення) та () для виконання потрібних арифметичних дій:

Примітка: якщо у калькуляторі використані необов'язкові поля, і відвідувач не вибирає або не вписує певне значення, то у формулі цінність відповідної змінної буде 0. Важливо це враховувати, якщо ви використовуєте дію множення у вашій формулі.


Підказка: порядок арифметичних дій визначає послідовність обчислень: спочатку виконуються дії в дужках, далі — множення та ділення, і останніми — додавання та віднімання.


  1. Після створення формули ви також можете кастомізувати відображення результатів розрахунків:

  • вписати стандартне значення, яке буде додаватися до того, як буде здійснено розрахунок — наприклад, число 0 або ж це може бути базова вартість ваших послуг, до яких буде додаватися вартість обраних додаткових послуг абощо;
  • додати певний текст чи символ, який буде відображатися до та/чи після результатів розрахунку.


  1. Для поля також доступні стандартні налаштування полів – ви можете додати певний опис та приховати поле за потреби:

Важливо: якщо ви приховуєте поле Формула для розрахунку, результати розрахунків теж будуть надіслані в разі відправки форми клієнтом і ви зможете їх побачити у налаштуваннях сайту в розділі Керування формами та у сповіщеннях про нові відповіді на пошту/месенджери тощо.


Підказка: скористайтеся нашою інструкцією для редагування вигляду контактної форми у разі необхідності змінити її дизайн.


Приклади використання


Для першого прикладу ми додамо калькулятор розрахунку вартості друку рекламного банера залежно від його розмірів з наступними полями:

При створенні формули ми враховуємо, що вартість друку банера розраховується на основі його площі. Щоб визначити площу, необхідно помножити ширину на висоту — у результаті ми отримуємо значення в квадратних метрах (м²).


Оскільки ціна вказана за 1 м², отриману площу потрібно помножити на вартість друку одного квадратного метра (у нашому прикладі це 1200 грн). У результаті ми отримуємо наступну формулу, використовуючи наші змінні:


висота*ширина*1200


Для другого прикладу ми додамо калькулятор розрахунку вартості створення сайту з наступними полями:

На прикладі нашого калькулятора вартості сайту нам необхідно, щоб усі вибрані відвідувачем опції сумувалися, тому перша частина формули буде виглядати наступним чином, використовуючи змінні:


site_type+design_type+addons


У нашому прикладі у поле “Кількість сторінок” клієнт вводитиме число, тому необхідно одразу в формулі прописати на яке значення це число множити (тобто, вартість 1 сторінки). Наприклад, нехай вартість однієї сторінки буде 100:


pages*100


У результаті ми отримуємо наступну формулу, завдяки якій користувач зможе розрахувати вартість створення сайту:


site_type+design_type+addons+pages*100




Оновлено: 06/02/2026

Чи була ця стаття корисною?

Поділіться своїм відгуком

Скасувати

Дякуємо!