> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://support.support-vigbo.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Как добавить калькулятор на сайт?

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

![Screenshot-9.png](https://storage.crisp.chat/users/helpdesk/website/-/b/f/6/a/bf6aec9264307000/1844842b-299d-4741-a139-599baf_1xp3lfa.png)

На сайте вы можете разместить калькулятор из любого стороннего сервиса. На примере нескольких сервисов, мы покажем как это сделать.

---

# Сервис FormDesigner.ru

Позволяет создавать разнообразные формы, квизы и также онлайн-калькуляторы. Можно использовать готовые шаблоны или создать свой калькулятор с нуля. В сервисе доступно много инструментов для настройки внешнего оформления на свой вкус.

Попробовать сервис можно бесплатно. И даже можно оставаться на бесплатном тарифе, но с рядом ограничений.

1. Зарегистрируйтесь на [сайте FormDesigner.ru](https://formdesigner.ru/). И после регистрации [войдите в свой аккаунт](https://ac.formdesigner.ru/).

2. Нажмите создать форму.

![Screenshot-1.png](https://storage.crisp.chat/users/helpdesk/website/-/4/2/0/4/42043afec4eb7800/3754f3a8-d89a-4b03-883e-1c3af5_1l7fu36.png)

3. Далее вы можете выбрать шаблон для вашего калькулятора или создать пустой шаблон (без элементов).

4. Добавьте нужные вам элементы в калькулятор, формулу расчета, выберите оформление и сохраните настройки. При необходимости воспользуйтесь [инструкцией FormDesigner.ru](https://formdesigner.ru/blog/detailed-instructions-for-creating-a-calculator-for-the-site.html) о том, как создавать калькулятор.

5. Переключитесь во вкладку **Сторонний код и** скопируйте код из поля **Код для вставки на сайт. JavaScript (рекомендуем)**.

![Screenshot-2.png](https://storage.crisp.chat/users/helpdesk/website/-/f/2/6/a/f26a2f24c801d00/f4845e76-312e-4dbb-8909-02d9cc_t1xuz6.png)

6. В системе управления сайтом откройте страницу, на которой вы хотите разместить калькулятор, и добавьте Виджет **Встроенный код**, перетянув его в нужную область страницы.

![screen-78.png](https://storage.crisp.chat/users/helpdesk/website/-/c/a/3/8/ca389b56425f4000/ecce421f-3ac2-425f-9881-cdd979_epdxwv.png)

7. Нажмите кнопку **Добавить код** и вставьте код, который был скопирован ранее.

![screen-122.png](https://storage.crisp.chat/users/helpdesk/website/-/4/9/a/5/49a5446c44a7d000/cde26ec2-c0f5-4bad-93dc-e57670_n278oz.png)

8. Сохраните настройки.

---

# Сервис Stepform.io

Конструктор квизов и онлайн-калькуляторов. Позволяет использовать как готовые шаблоны, так и вариант создания калькулятора с нуля. Много виджетов в редакторе с достаточно гибкими настройками. Доступна пробная версия и бесплатный тариф, но также с ограничениями.

1. Пройдите [регистрацию в сервисе](https://stepform.io/)

2. Далее вы можете выбрать создание пустой формы или готовый шаблон. который можно переделать под свою услугу.

![Screenshot-5.png](https://storage.crisp.chat/users/helpdesk/website/-/e/2/3/3/e2333dd037bf6800/3eca0c40-c35d-4f0e-acbd-f4faca_192irqi.png)

3. После создания калькулятора, перейдите в раздел **Публикация** и скопируйте код из поля **Код для вставки (javascript)**.

![Screenshot-6.png](https://storage.crisp.chat/users/helpdesk/website/-/c/1/5/a/c15a39f0b4937800/1f69040d-6b5a-48f5-b9e1-6b5998_brxpol.png)

4. В системе управления сайтом откройте страницу, на которой вы хотите разместить калькулятор, и добавьте Виджет **Встроенный код**, перетянув его в нужную область страницы.

![screen-78.png](https://support.vigbo.tech/hc/article_attachments/10784994446364)

5. Нажмите кнопку **Добавить код** и вставьте код, который скопировали ранее.

![screen-122.png](https://support.vigbo.tech/hc/article_attachments/10797117485980)

6. Сохраните настройки виджета и всей страницы.

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

> **ВАЖНО:** данное руководство не является инструкцией по использованию сервисов FormDesigner.ru и Stepform.io. Мы лишь рассказываем о возможности и способах добавления онлайн-калькулятора на сайт. Вы можете использовать и любые другие сервисы, которые предоставляют код вставки калькулятора и походят вам больше по условиям. О всех возможностях FormDesigner.ru и Stepform.io рекомендуем уточнять в поддержке этих сервисов.