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