Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPBカップ
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

WordPressでBMI計算機を追加する方法(ステップバイステップ)

健康とウェルネスに焦点を当てたサイトでは、魅力的なツールをプロバイダーとして提供することで、ユーザー体験を大幅に向上させることができます。ボディマス指数(BMI)計算機はその典型的な例で、訪問者に体重の状態を評価するための貴重なリソースを提供します。

WPBeginnerでは、専門チームがさまざまなプラグインを使用してBMI計算機を作成し、最も初心者に優しく、パーソナライズされた健康インサイトで読者に力を与えることができるものを見つけています。

私たちのステップバイステップのアプローチに従うことで、この機能を追加するための十分な準備が整い、訪問者のためのより包括的な健康とウェルネスリソースに貢献することができます。

この投稿では、WordPressでBMI計算機をコーディングや計算の必須なしで簡単に追加する方法を紹介します。

Add a BMI Calculator in WordPress (Step by Step)

なぜWordPressにBMI計算機を追加するのか?

BMIとはBody Mass Indexの略。身長と体重をもとに、体脂肪率を大まかに示すもので、次のような計算式で算出される:

BMI =kg/m2

kgは体重(キログラム)、m2は身長(メートル平方)である。

また、インペリアル単位を使う場合は、lbがポンド単位の体重、in2がインチの2乗単位の身長に703を掛けた数式を使うこともできる:

BMI =lb/in2* 703

BMIの測定は、あなたの訪問者、患者、またはクライアントが低体重なのか、過体重なのか、または身長に対して健康的な体重なのかを把握するのに役立ちます。しかし、人々に自分で計算するよう求めるのは、良いユーザーエクスペリエンスとは言えません。

そこでBMI計算機の出番だ。

あなたが健康やフィットネスのブログを開始した場合、BMI計算機は、訪問者が彼らの健康の旅で次のステップを計画するのに役立ちます。例えば、自分のBMIを減らすことを決めた人は、あなたのフィットネストラッカーにサインアップするかもしれません。

BMI計算機はまた、人々があなたのサイトに多くの時間を費やすことを奨励することができます。これは、ページビューを増加させ、あなたの直帰率を減少させることができます。

誰かがあなたのサイトで過ごす時間が長ければ長いほど、彼らがコンバージョンする可能性は高くなります。例えば、クロスフィットジムの体験を予約したり、オンラインストアでエクササイズ器具を購入したりするかもしれません。

それを念頭に置いて、WordPressでBMI計算機を簡単に追加する方法を見てみましょう。このチュートリアルでは、2つの方法を取り上げますので、以下のリンクからお好きな方法にジャンプしてください:

方法1: WPFormsでBMI計算機を作成する (簡単)

WPFormsを使えばWordPressで簡単にBMI計算機を作成できます。ドラッグアンドドロップビルダー、1300以上のテンプレート、完全なスパム保護が付属した市場で最高の電卓プラグインです。

プラグインには、BMI計算機、住宅ローン計算機、年齢計算機など、好きな計算機フォームを追加できる計算アドオンもあります。

まず、WPFormsプラグインをインストールして有効化する必要があります。詳しい手順については、WordPressプラグインのインストール方法のステップバイステップガイドをご覧ください。

: WPFormsには無料プランがあります。しかし、計算アドオンのロックを解除するにはプラグインのプロプランが必要です。

有効化した後、WordPressダッシュボードからWPForms ” 設定ページに向かい、ライセンスキーを入力してください。この情報はWPFormsサイトのアカウントで確認できます。

wpforms-license-key

その後、WPForms ” Addonsページにアクセスし、’Calculations Addon’を探します。

その後、「アドオンのインストール」ボタンをクリックするだけで、サイト上で有効化することができます。

Install and activate the Calculations addon

次に、WordPressの管理サイドバーからWPForms ” 新規追加ページにアクセスします。

ここで、これから作成する電卓フォームの名前を入力することから始めることができます。

その後、「BMI Calculator Form」テンプレートを見つけ、その下にある「Use Template」ボタンをクリックする。

Click the Use Template button under the BMI Calculator Form template

WPFormsフォームビルダーが画面に表示され、右側にフォームプレビュー、左側にフォームフィールドが表示されます。

ここから好きなフィールドを追加し、ドラッグ&ドロップで並び替えることができる。

次に、左側の列の設定を開くには、’測定単位’フィールドをクリックします。ここでは、BMI電卓がユーザーに帝国測定システムとメートル法の間の選択肢を与えることがわかります。

ただし、電卓で個別測定システムだけを使用したい場合は、システムの横にある(-)アイコンをクリックして、そのシステムを削除することができます。

BMI計算機で両方の測定システムを使用すると、より多くの人に対応することができますことを覚えておいてください。

Choose units of measurement for the form

その後、ユーザーがドロップダウンメニューから測定単位を選択すると、2つの異なる単位フィールドが表示されることがわかります。

ただし、個別測定システムを使用している場合は、単位フィールドのひとつは必要ないので、削除しても構わない。

例えば、BMIを帝国単位でのみ提供する場合、身長(cm)と体重(kg)の単位フィールドはメートル単位であるため、削除する必要があります。

Delete a layout field according to the measurement system you chose

次に、「BMI」と「評点」フィールドまでスクロールダウンします。これらのフィールドは自動的にユーザーの身長と体重を計算し、BMIの結果を表示します。

これらのフィールドのいずれかを削除すると、BMI計算フォームがあなたのために計算を実行することはできません。

フォームに問題がなければ、上部の「保存」ボタンをクリックして変更を保存してください。

Save your BMI calculator form

次の投稿では、ブロックエディターでBMI計算機を追加したいページ/投稿を開きます。

ここから、ブロックの追加「+」ボタンをクリックしてブロックメニューを開き、WPFormsブロックを見つけます。

そうしたら、ブロック内のドロップダウンメニューからBMI計算フォームを追加する。

Add BMI calculator form to the page with the WPForms block

最後に、「更新」または「公開」ボタンをクリックして、設定を保存します。これで、WordPressサイトにアクセスして、BMI計算機を表示できるようになります。

ここでは、体重と身長を入力するだけで、BMIが表示され、低体重、健康、過体重、肥満のいずれであるかを知ることができる。

WPForms BMI calculator preview

方法2: Formidable FormsでBMI計算機を作成する (上級者向け)

電卓の中にBMIの範囲を表示したい場合は、Formidable Formsを使ってWordPressでBMI電卓を作ることをお勧めします。

条件付き計算を含む、より多くの計算機能を持つ高度なフォームプラグインです。ChatGPT フィールド、ダイナミックフィールド、テンプレート、ドラッグアンドドロップビルダーなどの機能もあります。

まず、Formidable Formsプラグインをインストールして有効化する必要があります。詳しい手順はWordPress プラグインのインストール方法についての初心者ガイドをご覧ください。

注意: ‘Calculator’ テンプレートはプラグインのプロプランでのみ利用可能です。ただし、Formidable Forms Liteはプレミアムプラグインのより高度な機能のコアとなる土台を提供するので、インストーラは必要です。

有効化した後、WordPressダッシュボードからFormidable ” Global Settingsページにアクセスし、’Click to enter a license key manually’オプションを選択します。

キーは Formidable Forms サイトのアカウントにあります。情報を入力したら、「ライセンスを保存」ボタンをクリックするだけで、設定が保存されます。

Enter the Formidable Forms license key

次に、WordPress ダッシュボードからFormidable ” Forms ページにアクセスします。

ここで「+新規追加」ボタンをクリックし、電卓の作成を開始します。

Adding a new calculator form

これは、’フォームテンプレート’ページに移動します。ここでは、高度な住宅ローン電卓、パーセンテージ電卓、複利計算機などを含む55以上の電卓フォームテンプレートを表示するには、左側の列から ‘電卓’タブをクリックすることができます。

BMI計算機」テンプレートの下にある「テンプレートを使用する」ボタンをクリックしてください。

Choose the BMI calculator template

するとフォームビルダーが開き、右側にフォームプレビュー、左側にフォームフィールドが表示されます。フォームにフィールドを追加したり、フィールドをドラッグ&ドロップして順番を並べ替えることができます。

例えば、BMI計算フォームテンプレートには初期設定として名前フィールドがありません。しかし、ユーザーに関するより多くの情報を収集するために、左側のパネルからフォームに追加することができます。

Add form fields of your choice in the BMI calculator from the left column

その後、「測定単位」フィールドをクリックして、左カラムの設定を開く必要がある。

ここから、システムの横にある(-)アイコンをクリックして、2つの測定システム(メートル法またはインペリアル法)のいずれかを削除することができます。

しかし、あなたがBMI計算機でそれらの両方を維持したい場合は、デフォルトの測定システムとして選択することができます。

Choose the default measurement system for the BMI calculator

一方、電卓に1つの測定システムだけを使用することに決めた場合は、他のシステムの単位値フィールドを削除する必要があります。

例えば、メートル法だけを使いたい場合は、フォームから身長(フィートとインチ)と体重(ポンド)のフィールドを削除しなければなりません。

これを行うには、フィールドの上部にある3つの点のアイコンをクリックし、「削除」オプションを選択するだけです。

Delete unit fields for the measurement system that you have removed

次に、「BMI」フィールドまでスクロールダウンする必要があります。このフィールドは自動的にユーザーのBMIを計算し、判定を行います。

このフィールドを削除すると、BMI計算機が機能しなくなります。そのままにしておくことをお勧めします。

BMI field in the Formidable Forms

その後、上部にある「保存」ボタンをクリックして設定を保存します。

画面上にプロンプトが表示されますので、フォームの名前を追加して「保存」ボタンをクリックしてください。

Add a name for the BMI calculator form

次のステップでは、フォームエディターを閉じて、BMI計算機を追加したいページ/投稿をブロックエディターで開きます。

ブロックメニューが開いたら、ブロックの追加 ‘+’ ボタンをクリックして Formidable Forms ブロックを追加してください。

その後、ブロック内のドロップダウンメニューから、先ほど作成したフォームを選択します。

Add BMI calculator with the Formidable Forms block

最後に、「更新」または「公開」ボタンをクリックして、設定を保存します。

今、あなたはBMI計算機を表示するには、WordPressのブログやサイトにアクセスすることができます。ここで、訪問者は自分のBMIを表示するには、自分の身長と体重を入力することができます。彼らはより多くの情報が必要な場合は、’私の範囲を参照してください’ボタンをクリックすることができます。

計算機は、すべての異なる体重カテゴリーの範囲を表示します。

Formidable Forms BMI calculator preview

ボーナス:WordPressでフィットネストラッカーを作成する

BMI計算機を追加する以外に、WordPressサイトにフィットネストラッカーを追加することもできます。このトラッカーは、ユーザーが自分の減量の旅を追跡するために毎月記入する簡単なフォームにすることができます。

フィットネスブログを運営しているのであれば、このトラッカーを追加することで、サイトのエンゲージメントを高め、より多くのユーザーにメールリストに登録してもらうことができます。

Formidable Formsを使えば、コードを覚えなくても簡単にフィットネストラッカーを作成できます。そして、ユーザーは時間の経過とともに減量の進捗を追跡できるようになります。

Live fitness tracker

詳しくは、WordPressでフィットネストラッカーを作成する方法のチュートリアルをご覧ください。

このチュートリアルで、WordPressでBMI計算機を追加する方法を学んでいただけたら幸いです。お問い合わせフォームの作り方やビジネスサイトに必須のWordPressプラグインもぜひご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

情報開示 私たちのコンテンツは読者支援型です。これは、あなたが私たちのリンクの一部をクリックした場合、私たちはコミッションを得ることができることを意味します。 WPBeginnerの資金源 をご覧ください。3$編集プロセスをご覧ください。

アバター

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

究極のWordPressツールキット

ツールキットへの無料アクセス - すべてのプロフェッショナルが持つべきWordPress関連製品とリソースのコレクション!

Reader Interactions

4件のコメント返信を残す

  1. Basit

    Is it possible to insert BMI calculator form into wp site manually without using any plugin? If so can you refer a step by step guide? Actually I avoid installing too much plugins on my site and want to implement stuff manually.

  2. Ohue honesty

    Nice and lovely.

    • WPBeginner Support

      Glad you liked our article :)

      管理者

返信を残す

コメントありがとうございます。すべてのコメントは私たちのコメントポリシーに従ってモデレートされ、あなたのメールアドレスが公開されることはありませんのでご留意ください。名前欄にキーワードを使用しないでください。個人的で有意義な会話をしましょう。