В обзоре калькуляторов для платформы WordPress ранее рассказывалось о плагине WPcalc, однако с 09.12.2021 он больше не доступен для загрузки.
Поскольку другие бесплатные решения часто предлагают ограниченные функции, возникла необходимость поиска альтернативных вариантов.
Calculator Builder выделяется среди аналогов благодаря интуитивно понятному интерфейсу и множеству настраиваемых функций. С его помощью вы сможете легко создать калькулятор для расчета цен, кредитов, налогов и многого другого, не обладая специальными знаниями в программировании.
Плагин поддерживает мобильную версию, что позволяет пользователям без проблем работать с калькуляторами на любых устройствах. Также доступна возможность интеграции с популярными сервисами оплаты, что делает его идеальным для интернет-магазинов.
Дополнительно, Calculator Builder предлагает множество шаблонов, что позволяет быстро стартовать без необходимости создания калькулятора с нуля. Вы можете персонализировать дизайн под стиль вашего сайта, изменяя цвета, шрифты и элементы интерфейса.
Также смотрите: Возможно ли воспользоваться бесплатным хостингом для WordPress.
Плагин Calculator Builder: описание
Бесплатный плагин Calculator Builder был разработан той же командой (Wow-Company), которая раньше работала над WPcalc.
Хотя интерфейс и процесс создания калькуляторов претерпели изменения, данный плагин совместим с самыми последними версиями WordPress (6.0) и PHP (8.2). Проверено на практике!
Этот инструмент прост в использовании и предоставляет множество настроек для создания индивидуальных онлайн-калькуляторов, которые можно интегрировать на страницы вашего сайта.
Как утверждают разработчики, Calculator Builder поддерживает все виды вычислений. Примеры работающих калькуляторов можно найти на сайте CalcHub, где представлены различные модули по темам «Финансы» и «Здоровье». Но данный плагин можно применять также в строительных, кулинарных и многих других сферах.
Установка происходит стандартным способом прямо из репозитория WordPress через административную панель.
Из-за отсутствия русскоязычного интерфейса пользователям может быть сложно быстро разобраться в настройках. Давайте поэтапно рассмотрим, как создать функциональный калькулятор с помощью этого бесплатного плагина.
- Полностью бесплатный функционал.
- Возможность создания неограниченного количества калькуляторов и элементов в рамках одного калькулятора.
- Встроенный инструмент Live builder для составления формул прямо во время создания калькулятора.
- Работает на базе Vanilla JS без зависимости от библиотеки jQuery.
Такой калькулятор будет незаменимым инструментом для интернет-магазинов или лендингов на WordPress.
Делаем калькулятор с помощью Calculator Builder
После установки в админке украдется новая вкладка «Calculator Builder». При нажатии на нее откроется окно с несколькими вкладками:
- List – список всех созданных калькуляторов;
- Add new – на этой вкладке можно добавить новый калькулятор;
- Import/Export – возможность импортировать и экспортировать настройки (файл .json) для использования одинаковых калькуляторов на разных сайтах;
- Support – форма для связи с технической поддержкой;
- Documentation – рекомендую ознакомиться с этим разделом, чтобы увидеть примеры использования Live builder и обучающие видео, хотя и на английском;
- Changelog – список изменений при обновлении плагина.
Теперь перейдем к созданию калькулятора для расчета стоимости заливки полов.
Нажмем на вкладку «Add new» для добавления нового калькулятора.
Дадим ему уникальное имя и нажмем «Save». В нашем случае это будет «Расчет работ по заливке полов».
Кликните на «+» в нижней части раздела «Builder».
Откроется окно «Add Field» для добавления нового поля.
Рассмотрим это окно подробнее. Оно содержит следующие элементы:
- Field type – выпадающий список для выбора типа поля;
- Title – название поля;
- Required – обязательное поле (можно указать «Да/Нет»);
- Addon – дополнительное поле, например, для единиц измерения с настройками вывода справа или слева от поля ввода;
- Value – стартовое значение;
- Step – шаг;
- Min – минимальное значение;
- Max – максимальное значение.
В плагине доступны следующие типы полей (Field type):
- Number — поле для ввода чисел, включая счетчик, шаг и проверку на соответствие диапазону. На некоторых устройствах будет отображаться панель клавиатуры.
- Select — выпадающий список с вариантами, заданными пользователем.
- Radio — переключатель для выбора одного значения из предложенных.
- Checkbox — флажок для выбора или отмены значения.
- Number & Select — добавляет одновременно числовое поле и список значений.
- Buttons — отображает кнопки Calculate и Reset для вычисления и сброса данных калькулятора.
- Result — поле для отображения результатов, доступное только для чтения.
- Title — заголовок.
- Separator и Spacer — разделители для улучшения визуального оформления.
Для нашего калькулятора понадобятся 4 типа полей: Number для указания ширины и высоты, Checkbox для добавления в расчет стоимости снятия старого покрытия, Buttons для вывода результатов и Result для отображения результатов.
Также полезен каждому веб-мастеру будет плагин для онлайн-тестов для WordPress. Выбирайте лучшее!
Настройки каждого поля представлены на скриншотах.
В результате окно Builder будет выглядеть так:
Справа от каждого поля можно увидеть его уникальный ID. Для нас это x[1], x[2], x[3] и результирующее поле y[1].
Теперь нужно составить формулу в разделе Formula, которая будет вычислять результат (например, при цене работы 2000 рублей за квадратный метр), опираясь на эти ID.
Формула будет следующей:
let result = x[1]*x[2]*2000+x[1]*x[2]*x[3];
y[1] = roundVal(result, 2);
Первое выражение выполняет расчет, а второе – округляет результат до двух знаков после запятой и присваивает его результирующему полю.
Сохраним изменения и перейдем к разделу List. Здесь мы увидим наш калькулятор, которому был назначен уникальный шорткод (в колонке Shortcode): [Calculator ].
Теперь у вас есть возможность скопировать этот шорткод и вставить его на любую страницу или запись:
Визуализация калькулятора на веб-странице:
Как видно, калькулятор функционирует должным образом и предлагает пользователю выбор между расчетом стоимости только заливки полов или же выполнением этого действия с учетом снятия старого покрытия.
К недостаткам стоит отнести отсутствие русскоязычной версии, а также ограниченные возможности по выбору дизайна – стили кнопок, полей и шрифтов берутся из используемой темы.