Хотите добавить IMC калькулятор на свой сайт WordPress?
Если вы предлагаете контент, продукты или услуги, связанные со здоровьем и фитнесом, калькулятор ИМТ может быть очень полезен для вашей аудитории.
В этой статье мы покажем вам, как легко добавить калькулятор BMI в WordPress. Никакой математики или кода не требуется!
Что такое ИМТ и почему это важно?
ИМТ обозначает индекс массы тела. Это грубая мера жира в организме на основе роста и веса. Вычисление вашего ИМТ дает вам быстрое представление о том, что у вас недостаточный вес, избыточный вес или правильный вес для вашего роста.
Если вы начали вести блог о фитнесе или здоровье, то, возможно, имеет смысл предложить калькулятор ИМТ для ваших посетителей.
Добавление калькулятора ИМТ на ваш сайт может заставить людей проводить больше времени на вашем сайте. Они могут даже купить вам что-нибудь или одно из ваших партнерских предложений.
Это также хороший способ стимулировать повторное движение. Если кто-то пытается похудеть, вы можете вернуться на сайт и посмотреть, улучшился ли его ИМТ.
Как рассчитать ИМТ?
Вы можете рассчитать ИМТ, используя следующий расчет:
ИМТ = кг / м2
Вес – это вес человека в килограммах, а м2 – его рост в квадратных метрах.
Если вы предпочитаете рассчитывать ИМТ с использованием имперских единиц, вы можете использовать следующую формулу:
ИМТ = (вес фунтов / рост дюймов2) х 703
Здоровый ИМТ находится в диапазоне 18,5-25. ИМТ менее 18,5 указывает на то, что человек имеет недостаточный вес, а ИМТ более 25 указывает на то, что он имеет избыточный вес.
Очевидно, просить ваших читателей вытащить их калькулятор не очень полезно.
Вы можете добавить простой калькулятор на свой веб-сайт, где пользователи могут вводить свой рост и вес, чтобы калькулятор показывал им свой ИМТ. Таким образом, пользователи остаются вовлеченными на вашем сайте и чаще становятся клиентами.
Создать калькулятор ИМТ в WordPress
Для этого урока мы будем использовать плагин Formidable Forms. Это один из лучших на рынке плагинов для создания форм WordPress, который позволяет создавать расширенные формы с помощью простых инструментов перетаскивания.
Он поставляется с множеством шаблонов форм, калькуляторов, расширенных полей повторителей и других инструментов. Это позволяет создавать интерактивные расширенные формы для вашего сайта.
Сначала вам нужно зарегистрировать аккаунт в Formidable Forms, затем установить и активировать плагин. Для получения более подробной информации, смотрите наши инструкции по установке плагина WordPress.
После активации необходимо посетить Грозный »Формы страницы, а затем нажмите кнопку «Добавить новый» вверху, чтобы создать калькулятор ИМТ.
Как только вы это сделаете, вы увидите множество шаблонов, которые вы можете использовать для создания формы.
Прокрутите вниз, чтобы найти калькулятор ИМТ, или просто введите «ИМТ» в строке поиска, чтобы найти его.
Теперь, когда у вас есть шаблон BMI Calculator на экране, наведите на него курсор мыши и нажмите кнопку «Создать форму».
Далее вам будет предложено указать имя для вашей формы и описание. Вы можете использовать имя по умолчанию и опустить описание, если хотите. Когда вы будете готовы, нажмите кнопку «Создать».
Как только вы это сделаете, Formidable Forms автоматически создаст для вас форму калькулятора BMI.
Вы будете перенаправлены прямо в вид «Построить» вашей формы. Как видите, у вас есть форма в правой части экрана. Слева есть область, где вы можете добавлять или редактировать поля вашей формы.
Калькулятор ИМТ будет отлично работать с настройками по умолчанию. Если вы хотите добавить дополнительные поля, вы можете сделать это, нажав на поле слева, и оно будет автоматически добавлено в вашу форму.
Вы можете удалить поле IMC Prime, если хотите сохранить простоту формы. Форма не должна работать.
Чтобы удалить поле, просто нажмите на него, затем нажмите на значок корзины.
Если вы хотите, чтобы пользователь отправил форму для просмотра результатов своего ИМТ, вы также можете удалить поля недостаточного веса, здорового веса, избыточного веса и ожирения.
Настройка параметров вашего калькулятора ИМТ
Если вы удовлетворены своим калькулятором ИМТ, нажмите на вкладку «Настройки» в верхней части экрана.
Вы можете внести изменения здесь. Например, вы можете изменить сообщения по умолчанию, которые отображаются для пользователей после отправки формы. Если вы прокрутите страницу вниз, вы увидите их в поле «При отправке».
Когда кто-то использует калькулятор, его результат будет показан так:
Вы можете изменить формулировку, чтобы она соответствовала вашей аудитории.
Другой вариант – добавить ссылки на дополнительные инструкции. Например, у вас может быть контент, который предлагает советы по диете или физическим упражнениям.
Вы можете ввести HTML-код в поле. Чтобы изменить размер шрифта и цвет фона поля, вы можете использовать функцию «Стили» в формуемых формах. Мы увидим позже в этом уроке.
Вот пример сообщения с соответствующей ссылкой:
Подсказка: Поле, в котором вы можете редактировать сообщение с результатами, довольно маленькое. Вы можете скопировать сообщение из коробки и вставить его в редактор кода, чтобы его было легче редактировать. Скопируйте его обратно в окно сообщения, когда вы закончите.
Изменить текст кнопки калькулятора ИМТ
Если вы хотите изменить текст кнопки вашей формы, вы можете сделать это в Настройки »Стиль и кнопки,
Просто введите текст, который вы хотите использовать. Мы будем использовать текст «Показать мой диапазон ИМТ» вместо «Посмотреть мой диапазон!» для текста кнопки
Мы также изменили «Обновить результаты» вместо «Обновить» для текста на кнопке, которая появляется после первой отправки формы.
Измените стиль вашего калькулятора ИМТ
По умолчанию калькулятор ИМТ выглядит довольно просто. Текст тоже довольно маленький, вот так:
Вы можете изменить стиль вашей формы, используя разные цвета, размеры шрифта и многое другое. Чтобы сделать это, вы должны сначала перейти к Грозный »Стили в вашей панели управления WordPress.
Затем вы можете нажать кнопку «+ Новый стиль», чтобы начать создание нового стиля. Кроме того, вы можете редактировать существующий стиль по умолчанию, если вы хотите использовать один и тот же стиль для всех ваших форм.
Мы собираемся создать новый стиль только для нашей формы BMI Calculator.
Щелкнув раскрывающееся меню рядом с вкладкой «Метки полей», вы можете изменить размеры меток в полях формы. Мы собираемся увеличить это с 14px до 18px.
В правой части экрана вы увидите предварительный просмотр стиля вашей формы. При внесении изменений это будет автоматически обновляться.
Вы также можете увеличить размер шрифта и высоту полей самих полей в разделе «Настройки поля». Вы можете изменить размер переключателей (Imperial vs Metric) на вкладке «Флажок и радиусные поля».
Вы также можете увеличить размер шрифта кнопки на вкладке «Кнопки». Вы также можете выбрать цвет для кнопки.
Если вы хотите развернуть сообщение с результатами или изменить цвет фона, вы можете сделать это на вкладке Сообщения формы.
После внесения всех необходимых изменений нажмите «Обновить» в правом верхнем углу, чтобы сохранить изменения в стиле.
Затем вы можете применить стиль к вашей форме. Иди первый Грозный »Формы тогда найди свой путь. Нажмите на заголовок формы, чтобы отредактировать ее, или наведите курсор мыши на форму и нажмите ссылку «Изменить», расположенную прямо под ней.
Затем вы можете перейти на вкладку Настройки и нажать Стиль и кнопки настроить стили вашей формы.
Здесь вы можете использовать раскрывающееся меню Шаблон стиля, чтобы выбрать новый шаблон стиля. Просто нажмите на выпадающее меню и затем выберите стиль, который вы хотите использовать.
Теперь ваша форма будет стилизована в шаблоне. Вот как выглядит наш:
Добавьте форму калькулятора ИМТ на свой сайт
Когда вы будете готовы, вы можете разместить свою живую форму на своем сайте. Сначала вам нужно нажать кнопку «Обновить» в правом верхнем углу, чтобы сохранить изменения:
Затем вам нужно будет отредактировать существующий пост или страницу или создать новый.
После этого вы можете нажать кнопку (+), чтобы добавить новый блок. Перейдите в раздел «Виджеты» и щелкните блок «Формируемые формы». Или, если вы предпочитаете, вы можете использовать панель поиска, чтобы найти его.
Теперь вы можете просто выбрать форму ИМТ. Нажмите на раскрывающееся меню «Выберите форму» и выберите калькулятор ИМТ, например:
Возможно, вы захотите просмотреть свою страницу, чтобы увидеть, как ваш законченный калькулятор ИМТ выглядит на вашем сайте. Вот наш:
Если есть что-то, что вы хотите изменить или изменить, просто вернитесь к своей форме в панели управления WordPress. Вы можете найти это ниже Грозный »Формы,
Каждый раз, когда вы вносите изменения в форму, она будет автоматически обновляться везде на вашем сайте. Вам не нужно менять шорткод или делать что-то дополнительное.
Мы надеемся, что это руководство помогло вам узнать, как добавить калькулятор BMI в WordPress с помощью Formidable Forms. Вам также могут понравиться наши статьи о самых полезных виджетах WordPress, и у вас должны быть плагины WordPress для бизнес-сайтов.
Если вам понравилась эта статья, подпишитесь на наш канал YouTube, чтобы посмотреть обучающие видеоролики WordPress. Вы также можете найти нас на Twitter а также Facebook,
