Простой способ собрать калькулятор для сайта на WordPress

Калькулятор — самый очевидный способ наладить сбор полностью готовых индивидуальных заявок на сайте или лендинге. Для WordPress написан не один десяток плагинов, но часть из них стоит денег, а бесплатные - обычно имеют не самый свежий дизайн и грешат ограничениями в настройках. Конечно, всегда есть вариант с «подтянуть навыки Javascript и HTML и сделать самому», но это ваше время, которое тоже стоит денег, - плюс редактирование самописного калькулятора едва ли будет самой удобной задачей на свете.
👍 Научим бесплатно правильно создавать сайты на WordPress. Подробнее →

Есть способ сделать калькулятор без необходимости устанавливать и отсматривать плагины или возиться с кодом и сложными параметрами формул. Речь о бесплатном сервисе uCalc – по сути, это онлайн-конструктор, где вы в визуальном режиме собираете и настраиваете калькулятор с нуля или по шаблону, а затем получаете готовый код, который и встраиваете на свой сайт.

За 15-30 минут здесь можно создать калькулятор для расчета любой услуги, оформить калькулятор доставки для интернет-магазина, а то и вовсе научить калькулятор считать и переводить что угодно во что угодно.

Собранный в uCalc калькулятор умеет выдавать результаты динамически без перезагрузки страницы, подстраиваться под экраны мобильных устройств, отправлять информацию о заказе владельцу сайта и принимать оплату через «Яндекс.Кассу».

Настройка дизайна калькулятора

Для начала, перетаскиваем элементы в конструкторе, расставляя их в рабочем поле, как захочется: нам доступны ползунок, выпадающий список, галочка, флажок, поле ввода данных (телефон, почта и т.д.), поле текстового комментария и кнопка заказа.

Размеры и цвета кнопок и текстовых элементов можно менять, просто кликнув на них. Вскоре добавится возможность менять цвет фона и элементов калькулятора, а также выбирать шрифты.

Еще один приятный момент – возможность добавлять картинки. Изображение можно вставить не только в шапку, но и в любую область внутри калькулятора — например, чтобы сделать иллюстрацию к каждому пункту выбора.

Вы можете добавить до 4 блоков в одной строке. Если сайт, для которого создается калькулятор, адаптивен или имеет отдельную мобильную версию, количество блоков в строке будут меняться в зависимости от размеров экрана устройства, с которого зашел посетитель. Если же ваш сайт вдруг не адаптирован под мобильные устройства, калькулятор просто будет отображаться в уменьшенном виде — без переноса блоков.

Чтобы заранее проверить, как калькулятор будет выглядеть на разных экранах, достаточно переключиться во вкладку «Предпросмотр».

Настройка формулы

В разделе «Формула»в конструкторе ваш калькулятор представлен в виде схемы: у каждого поля есть своя буква-переменная. Подставляя эти переменные, а также математические знаки и цифры в строку слева, вы можете создать одну или несколько формул — последнее удобно, если нужно сделать скидку за выбор конкретных услуг или товаров.

Подключение оповещений и оплаты

Все эти опции доступны в настройках кнопки.

В пункте «Оповещение владельца» можно выбрать, какую именно информацию из заявки отправлять на почту или телефон менеджера и отметить, в каком порядке выводить поля заказа в сообщении. Чтобы добавить поле, достаточно кликнуть по нему.

Аналогичное сообщение можно настроить и для клиента. Причем помимо стандартных полей, можно вписать любую информацию — например, дополнительно отправить человеку ссылку, контактные данные или что-то еще.

Для подключения оплаты достаточно указать данные аккаунта в «Яндекс.Кассе» и выбрать, из какого поля калькулятора будет забираться сумма к оплате.

Установка калькулятора на страницу сайта

Как только калькулятор готов, нажимаем кнопку «Сохранить» – и получаем готовый код калькулятора.

Остается зайти в админку своего сайта и выбрать страницу, на которую нужно установить калькулятор. Переводим поле для ввода контента в режим Text, вставляем код, а затем публикуем страницу.

Калькулятор отобразится на сайте.

Внесение изменений в калькулятор, установленный на сайте

Самый частый случай, когда требуется отредактировать готовый калькулятор – это снижение или повышение цен на услугу или товар. Все, что нужно в этом случае: вернуться в онлайн-конструктор, внести изменения в дизайн или формулу и нажать кнопку «Сохранить» – изменения перенесутся на сайт сами.

Перейти на uCalc.pro

Уже пробовали конструктор uСalc? поделитесь своим опытом в комментариях!

Создай свой первый сайт на WordPress

Юрий
Оцените автора
Добавить комментарий

  1. Юрий

    Очень крутой калькулятор. Спасибо

    Ответить
    1. Игорь

      Из недорогих альтернатив есть еще плагин stepform.

      Ответить
  2. Сергей

    Класс, все понятно и удобно, мне понравился. Для сайтов с услугами просто незаменимая вещь.

    Ответить
  3. Юрий

    Ценник конский, на сайте 5 калькуляторов. Итого 15к только за калькуляторы, в год. Смешно)

    Ответить
    1. Alexey Korneev

      Юрий, мы с осени готовимся к переходу на модель оплаты за аккаунт, а не проект – в зависимости от случая пользователя. А еще с весны делаем спец. скидки тем, кто использует много проектов на сайте/сайтах: эта информация указана открыто в интерфейсе оплат.

      Исходной гиптезой было, что люди будут публиковать меньше проектов – но мы видим, что у части пользователей их много: формы, разные калькуляторы на разных страницах и сайтах.

      P.S. Не очень понял, откуда взялась сумма в вашем примере – при оплате на год вперед дается автоматическая скидка и цена месячной поддержки калькулятора падает. Но не суть

      Ответить
    2. Константин

      Использую сейчас форму на uCalc и приобрел себе тариф “Базовый” где смог создать ТРИ проекта и заплатил за год использования всего 1000р. Сейчас там летние скидки и можно приобрести тариф на 50% дешевле.

      Ответить
  4. Кирилл

    Классные калькуляторы создаются. Уже всем клиентам своим предложил, с радостью поставили.

    Ответить
  5. Vitaliy

    Калькулятор примитивный

    Ответить
  6. Петя

    5 баксов в месяц вы совсем? Это вы называете бесплатно? Проще один раз заказать прогрессистам.

    Ответить
  7. Edyan

    За 5 бачей мне сделают программисты и я им буду пользоваться всегда )))
    Если бы хотя бы за акк 5 долларов и неограниченное количество калькуляторов – ещё по божески, и то, не стоит оно того…

    Уберите хотя бы в бесплатном рекламу.

    Ответить
  8. Антон

    Да вы гоните такую цену ломить!? Удачи))))))

    Ответить
  9. Александр

    Цены то приемлемые, да и скидки у них постоянно, акции на праздники разные делают. Я вот недавно скидос выклянчил у них)) Доволен как слон. Ну и полностью бесплатного и чтобы по качеству было хорошее вы нигде не найдете, сервисы все по подписке работают, иначе бы не работали. А из бесплатных есть еще stepform.io/ru ну а если совсем бесплатно, берем contact form 7 и допиливаем ручками функционал.

    Ответить