Хотите добавить калькулятор ИМТ на свой сайт WordPress??
Если вы предлагаете контент, продукты или услуги, связанные со здоровьем и фитнесом, то калькулятор ИМТ может быть очень полезен для вашей аудитории.
В этой статье мы покажем вам, как легко добавить калькулятор BMI в WordPress без необходимости кодирования или математических вычислений.
Как рассчитать ИМТ (и зачем добавлять калькулятор ИМТ в WordPress)?
BMI означает индекс массы тела. Это приблизительная мера содержания жира в организме человека, основанная на его росте и весе с помощью следующего расчета:
кг — это вес человека в килограммах, а m 2 — его рост в метрах в квадрате.
Расчет ИМТ может помочь вашим посетителям, пациентам или клиентам понять, есть ли у них недостаточный вес, избыточный вес или здоровый вес для их роста. Однако просить посетителей самостоятельно выполнять расчеты не очень удобно.
Вот где калькулятор ИМТ может быть полезен.
Если вы завели блог о здоровье или фитнесе, то калькулятор ИМТ может повысить ценность вашего блога для читателей и помочь им спланировать следующие шаги на пути к здоровью. Например, человек, который хочет снизить свой ИМТ, может подписаться на ваш фитнес-трекер.
Калькулятор ИМТ также может побудить людей провести больше времени на вашем сайте. Это может увеличить количество просмотров страниц и снизить показатель отказов.
Чем больше времени человек проведет на вашем сайте, тем больше вероятность того, что он совершит конверсию. Например, они могут решить записаться на пробное занятие в ваш кроссфит-зал или купить тренажеры в вашем интернет-магазине.
Это также хороший способ стимулировать повторный трафик. Если кто-то пытается изменить свой ИМТ, то он будет постоянно возвращаться на ваш сайт, чтобы проверить, находится ли его ИМТ в здоровом диапазоне.
Учитывая это, давайте посмотрим, как вы можете легко добавить калькулятор ИМТ в WordPress.
Создание калькулятора ИМТ в WordPress
В этом руководстве мы будем использовать плагин Formidable Forms. Это один из лучших плагинов WordPress для построения форм на рынке, который позволяет создавать продвинутые формы с помощью простого конструктора перетаскивания.
Он также поставляется с тоннами готовых шаблонов, включая мощный шаблон BMI, который позволяет добавить калькулятор на ваш сайт всего за несколько кликов.
Посетители могут ввести свой вес и рост, а готовый калькулятор ИМТ произведет расчет автоматически. Затем он покажет индекс массы тела, а также то, есть ли у них недостаточный вес, здоровый вес, избыточный вес или ожирение.
Если посетитель хочет получить больше информации, то он может нажать на «Посмотреть мой диапазон.’
Затем калькулятор покажет диапазоны для всех различных весовых категорий. Если у посетителя нет здорового ИМТ, то эта информация может помочь ему решить, какие изменения он должен сделать, чтобы улучшить свое здоровье.
Сначала вам нужно зарегистрироваться в Formidable Forms, затем установить и активировать плагин. Для получения более подробной информации ознакомьтесь с нашими инструкциями по установке плагина WordPress.
После активации вы увидите сообщение с просьбой ввести лицензионный ключ.
Нажав на ссылку, вы попадете в глобальные настройки плагина.
Здесь вы можете нажать на ‘Connect an Account’ и следовать инструкциям, чтобы подключить WordPress к вашему аккаунту Formidable Forms.
Другой вариант — выбрать «Нажмите, чтобы ввести лицензионный ключ вручную», а затем ввести свой лицензионный ключ в поле.
Вы найдете эту информацию, войдя в свой аккаунт на сайте Formidable Forms.
После ввода ключа нажмите на «Сохранить лицензию.’
После успешной настройки Formidable Forms вы можете создать калькулятор ИМТ для вашего сайта WordPress.
Чтобы начать работу, перейдите по ссылке Formidable » Формы а затем нажмите на «Добавить новую.’
Откроется всплывающее окно со всеми готовыми шаблонами, которые вы можете использовать.
Вы найдете шаблон BMI Calculator, нажав на раздел «Калькулятор».
Чтобы просмотреть, как форма будет выглядеть на вашем сайте, просто наведите курсор мыши на шаблон ‘BMI Calculator’.
Затем нажмите на маленькую кнопку, похожую на глаз.
Formidable Forms покажет предварительный просмотр калькулятора BMI, с которым вы можете взаимодействовать.
Чтобы создать калькулятор с помощью этого шаблона, просто нажмите на кнопку «Использовать этот шаблон».
Затем введите название в поле «Название формы». Это просто для справки, поэтому вы можете использовать все, что поможет вам определить калькулятор в вашей приборной панели WordPress.
Затем нажмите на кнопку «Создать».
Это откроет шаблон калькулятора BMI в редакторе перетаскивания.
Форма находится в правой части экрана. Слева находится область, где вы можете добавить или отредактировать поля формы.
Калькулятор BMI будет отлично работать с настройками по умолчанию. Однако вы можете изменить любое поле, выбрав его в редакторе и воспользовавшись настройками в левом меню.
Например, вы можете изменить текст, который отображается над полем, введя ‘Field Label.’
Если вы хотите добавить дополнительные поля в калькулятор ИМТ, выберите вкладку «Добавить поля».
Затем вы можете перетащить любое поле в редактор форм.
Чтобы удалить поле, просто наведите курсор мыши на это поле и нажмите на значок с тремя точками.
Затем вы можете нажать на «Удалить.’
Настройка параметров калькулятора BMI
Когда вы будете довольны тем, как выглядит калькулятор ИМТ, вы можете просмотреть его настройки, перейдя на вкладку «Настройки».
В разделе ‘On Submit’ вы можете увидеть, что происходит, когда посетители отправляют форму. По умолчанию калькулятор BMI будет показывать сообщение каждый раз, когда кто-то нажимает на кнопку «Отправить».’
В разделе ‘Сообщения’ вы можете увидеть текст, который будет показан посетителям.
Сообщение по умолчанию представляет собой смесь обычного текста и кода. Например, первая часть сообщения по умолчанию имеет следующий вид:
Your BMI Result is:
[if 117 less_than=»18.5″]Недостаточный вес[/if 117]
Это означает, что посетитель с индексом массы тела менее 18.5 вы увидите следующее сообщение: Your BMI Result is Underweight.
Вы можете изменить формулировку, добавить больше текста или даже добавить ссылки на полезные ресурсы. Например, вы можете включить ссылки на низкокалорийные рецепты вашего сайта или упражнения для укрепления мышц в зависимости от того, низкий или высокий ИМТ у человека.
Блок «Сообщения» поддерживает HTML-код, поэтому вы можете легко добавлять ссылки и использовать форматирование, например, жирный и курсив.
Если вы вносите какие-либо изменения, будьте осторожны и не меняйте код внутри квадратных скобок, так как это может помешать калькулятору показывать правильные результаты.
Совет: Поле «Сообщения» довольно маленькое, поэтому вам может быть проще вставить текст в редактор кода. Вы можете внести свои изменения и вставить текст обратно в поле «Сообщения», когда закончите.
Изменение текста кнопки калькулятора ИМТ
По умолчанию калькулятор имеет кнопку «Посмотреть мой диапазон».
Вы можете изменить текст, который отображается на этой кнопке, и положение кнопки, перейдя на вкладку «Стилизация и кнопки».
Просто введите текст, который вы хотите использовать, в поле «Текст кнопки отправки». Например, мы собираемся использовать ‘Show My BMI Range’ в качестве ярлыка кнопки.
Вы также можете изменить местоположение кнопки на странице с помощью выпадающего меню ‘Submit Button Alignment’ (Выравнивание кнопки отправки).
Добавление формы калькулятора ИМТ на ваш сайт
Когда вы будете довольны тем, как настроена форма, вы можете добавить ее в свой блог или сайт WordPress.
Сначала нажмите кнопку «Обновить» в правом верхнем углу, чтобы сохранить изменения.
Далее вам нужно будет открыть пост или страницу, куда вы хотите добавить калькулятор, или создать новый пост.
После этого нажмите кнопку ‘+’, чтобы добавить новый блок. Во всплывающем окне введите ‘Formidable Forms’, а затем нажмите на правый блок, когда он появится.
После этого откройте выпадающий список ‘Выбрать форму’ и выберите калькулятор BMI, который вы создали ранее. Теперь WordPress добавит калькулятор на вашу страницу.
Вы можете предварительно просмотреть свою страницу, чтобы увидеть, как калькулятор ИМТ будет выглядеть на вашем сайте. Если вас все устраивает, вы можете обновить или опубликовать страницу.
Теперь, если вы посетите свой сайт, вы увидите калькулятор ИМТ в реальном времени.
БОНУС: Изменение стиля калькулятора BMI
Если вас не устраивает, как выглядит шаблон BMI по умолчанию, то вы можете создать новый стиль для своей формы.
Для этого перейдите по ссылке Formidable » Стили в приборной панели WordPress.
Чтобы создать новый стиль, нажмите на кнопку ‘+Новый стиль’. В качестве альтернативы вы можете отредактировать существующий стиль по умолчанию, хотя это изменение затронет все ваши формы.
Мы создадим новый стиль только для формы BMI Calculator.
Если вы создаете новый стиль, то начните с ввода названия в поле «Название стиля».
Это просто для справки, так что вы можете использовать любое название вы хотите.
Вы можете попробовать множество различных настроек. Однако для начала вы можете захотеть изменить размер, шрифт или цвет меток формы.
Для этого просто перейдите на вкладку ‘Field Labels’, а затем используйте различные настройки в этом разделе. Например, на следующем изображении мы изменим размер текста на 18px.
В правой части экрана вы увидите предварительный просмотр стиля формы. По мере внесения изменений этот предварительный просмотр будет обновляться автоматически.
Вы также можете изменить размер шрифта и высоту самих полей, выбрав вкладку «Настройки полей».
Чтобы изменить размер радиокнопок формы, просто выберите ‘Check Box & Radio Fields.’
Наконец, если вы хотите сделать текст кнопки меньше или больше, перейдите на вкладку «Кнопки». Здесь вы также можете изменить цвет кнопки, чтобы она выделялась на фоне остальной темы WordPress.
Когда вы будете довольны стилем, просто нажмите кнопку «Обновить».
Чтобы применить новый стиль к вашему калькулятору BMI, перейдите по ссылке Formidable » Формы. Затем вы можете навести курсор мыши на форму калькулятора ИМТ и нажать на ссылку «Редактировать».
Затем перейдите на вкладку «Настройки» и выберите «Стилизация и кнопки» в меню слева.
После этого откройте выпадающий список «Шаблон стиля» и выберите стиль, который вы хотите использовать.
Наконец, нажмите на кнопку ‘Update’, чтобы сохранить изменения. Теперь, если вы посетите калькулятор на своем сайте, вы увидите новый стиль формы в действии.
Надеемся, что это руководство помогло вам узнать, как добавить калькулятор ИМТ в WordPress. Вы также можете ознакомиться с нашим руководством о том, как создать контактную форму, и с обязательными плагинами WordPress для бизнес-сайтов.
Источник: www.wpbeginner.com