Tekniska bloggspel, Android-app-apk, tips och tricks

Hur man lägger till en IMC-kalkylator i WordPress (steg för steg)

Obs: I nästa ämne du kommer att läsa kommer du att lära dig om: Hur man lägger till en IMC-kalkylator i WordPress (steg för steg)

Vill du lägga till en IMC-kalkylator på din WordPress-webbplats?

Om du tillhandahåller innehåll, produkter eller tjänster relaterade till hälsa och fitness kan BMI-kalkylatorn vara till stor hjälp för din publik.

I den här artikeln kommer vi att visa dig hur du enkelt lägger till en BMI-kalkylator i WordPress. Ingen matematik eller kod krävs!

Lägg till en BMI-kalkylator på din WordPress-webbplats

Vad är BMI och varför är det viktigt?

BMI står för body mass index. Det är ett grovt mått på kroppsfett baserat på längd och vikt. BMI-beräkningen ger dig en snabb indikation på om du är underviktig, överviktig eller rätt vikt för din längd.

Om du har startat en tränings- eller hälsoblogg är det vettigt att erbjuda en BMI-kalkylator till dina besökare.

Att lägga till en BMI-kalkylator på din webbplats kan få människor att spendera mer tid på din webbplats. De kan till och med köpa något till dig eller något av dina affiliateerbjudanden.

Förhandsgranska BMI-kalkylatorformuläret på webbplatsen

Det är också ett bra sätt att uppmuntra till återkommande trafik. Om någon försöker gå ner i vikt kan du gå tillbaka till deras hemsida för att se om deras BMI har förbättrats.

Hur räknar man ut BMI?

Du kan beräkna BMI med följande beräkning:

BMI = kg/m2

Kg är en persons vikt i kilogram och m2 är hans längd i kvadratmeter.

Om du vill beräkna BMI i imperialistiska enheter kan du använda följande formel:

BMI = (vikt/höjd tum2) x 703

Ett hälsosamt BMI är mellan 18,5 och 25. Ett BMI under 18,5 indikerar att personen är underviktig och ett BMI större än 25 indikerar att personen är överviktig.

Att be dina läsare att ta fram sina miniräknare är uppenbarligen inte till hjälp.

Du kan lägga till en enkel kalkylator på din webbplats där användare kan ange sin längd och vikt, så att kalkylatorn visar dem deras BMI. På så sätt kommer användare att engagera sig i din webbplats och är mer benägna att bli kunder.

Skapa en BMI-kalkylator i WordPress

För den här handledningen kommer vi att använda plugin-programmet Formidable Forms. Det är ett av de bästa WordPress-formulärbyggarens plugins på marknaden och låter dig skapa avancerade formulär med enkla dra och släpp-verktyg.

Den levereras med massor av avancerade formulärmallar, miniräknare, repeterande fält och andra verktyg. Detta gör att du kan skapa mycket interaktiva förbättrade formulär för din webbplats.

Du måste först registrera dig för ett Formidable Forms-konto och sedan installera och aktivera plugin-programmet. För mer information, se vår guide om hur du installerar ett WordPress-plugin.

Efter aktivering måste du komma åt Hemskt »Utseende och klicka sedan på knappen “Lägg till ny” högst upp för att skapa din BMI-kalkylator.

Skapa ett nytt BMI-kalkylatorformulär

När du har gjort det kommer du att se ett gäng mallar som du kan använda för att skapa ett formulär.

Rulla ned för att hitta en BMI-kalkylator, eller skriv helt enkelt “BMI” i sökfältet för att hitta den.

Ladda ner blankettmall för BMI-kalkylator

Nu när du har mallen för BMI-kalkylatorn på skärmen, håll muspekaren över den och klicka på knappen Skapa formulär.

Därefter kommer du att bli ombedd att ange ett namn på ditt formulär och en beskrivning. Du kan använda standardnamnet och utelämna beskrivningen om du vill. När du är klar klickar du på knappen “Skapa”.

Skriv ett namn för din BMI-kalkylatormodell

När du har gjort det kommer Formidable Forms automatiskt att skapa ett BMI-kalkylatorformulär åt dig.

Du kommer direkt till vyn “Bygg” i ditt formulär. Som du kan se har du formuläret till höger på skärmen. Till vänster finns det ett område där du kan lägga till eller redigera fälten i ditt formulär.

Standard kompileringsvy på formidabla former

BMI-kalkylatorn fungerar perfekt med standardinställningar. Om du vill lägga till ytterligare fält kan du göra det genom att klicka på fältet till vänster så läggs det automatiskt till i ditt formulär.

Du kanske vill ta bort IMC Prime-rutan om du vill hålla formuläret enkelt. Blanketter behöver inte fungera.

För att ta bort ett fält klickar du bara på det och sedan på papperskorgsikonen.

Ta bort BMI Prime-fältet från formuläret

Om du vill att användare ska skicka ett formulär för att se deras BMI-resultat kan du också ta bort fälten undervikt, frisk, övervikt och fetma.

Justera dina BMI-kalkylatorinställningar

När du är nöjd med din BMI-kalkylator klickar du på fliken “Inställningar” längst upp på skärmen.

Fliken Inställningar för BMI-kalkylatorformulär

Du kanske vill göra ändringar här. Du kan till exempel ändra standardmeddelandena som visas för användare efter att de har skickat ett formulär. Om du bläddrar till botten av sidan kan du se dem i rutan Vid inlämning.

Hemska meddelandemönster

När någon använder kalkylatorn kommer deras resultat att visas enligt följande:

Standardresultat av BMI-kalkylator

Du kanske vill skräddarsy din formulering till din publik.

Ett annat alternativ här är att lägga till en länk för fler instruktioner. Du kan till exempel ha innehåll som ger råd om kost eller träning.

Du kan ange HTML-koden i rutan. För att ändra teckenstorleken och bakgrundsfärgen på rutan kan du använda funktionen Stilar i Formidable Form. Vi kommer att se senare i den här guiden.

Här är ett exempel på det resulterande meddelandet med en relevant länk inkluderad:

Anpassat resultatmeddelande i formidabel form

Dricks: Rutan där du kan redigera det resulterande meddelandet är ganska liten. Du kan kopiera meddelandet från rutan och klistra in det i kodredigeraren för enklare redigering. Kopiera tillbaka det till meddelanderutan när du är klar.

Ändra texten på BMI-kalkylatorknappen

Om du vill ändra knapptexten i ditt formulär kan du göra det i Inställningar » Stilar och knappar.

Skriv bara in texten du vill använda. Vi använder texten “Visa mitt BMI-intervall” istället för “Visa mitt intervall!” för knapptext

Vi har också ändrat “Uppdatera resultat” istället för “Uppdatera” för knapptexten som visas efter att formuläret skickats in första gången.

Ändra meddelandet på knappen Skicka och uppdatera i formidabel form

Ändra din BMI-kalkylatormodell

Som standard ser BMI-kalkylatorn ganska enkel ut. Texten är också ganska liten, så här:

Standardstil för IMC-formulär

Du kan ändra stilen på formuläret med olika färger, teckenstorlekar och mer. För att göra detta måste du först gå till Hemskt »Stil i din WordPress-instrumentpanel.

Fruktansvärda modeller Tab

Du kan sedan klicka på knappen “+ Ny stil” för att börja skapa en ny stil. Alternativt kan du redigera den befintliga standardstilen om du vill använda samma stil för alla dina formulär.

Vi kommer att skapa en ny stil bara för vår mall för BMI-kalkylator.

Lägg till en ny stil i formidabla former

Genom att klicka på rullgardinsmenyn bredvid fliken Fältetiketter kan du ändra etikettstorleken i fälten i ditt formulär. Vi kommer att öka detta från 14px till de ursprungliga 18px.

Ändra fältetikettstorlek

På höger sida av skärmen ser du en förhandsvisning av formulärets stil. När du gör ändringar uppdateras detta automatiskt.

Du kanske också vill öka teckenstorleken och fälthöjden på själva fälten, under “Fältinställningar”. Du kan ändra storleken på alternativknapparna (Imperial vs Metric) på fliken “Checkboxes and radie fields”.

Du kan också öka teckenstorleken på knappen på fliken Knappar. Du kan också välja en färg för knappen.

Om du vill utöka det resulterande meddelandet eller ändra bakgrundsfärgen kan du göra det på fliken Exempelmeddelanden.

När du har gjort alla ändringar du vill klicka på “Uppdatera” i det övre högra hörnet för att spara ändringarna i stilen.

Uppdatera den nya stilen du har skapat

Du kan sedan tillämpa stilen på ditt formulär. Gå först Hemskt »Utseende navigera sedan Klicka på formulärets titel för att redigera eller för muspekaren över formuläret och klicka på länken “Redigera” direkt under formuläret.

Redigera BMI-kalkylatorformuläret du skapade

Du kan sedan gå till fliken Inställningar och klicka Stilar och knappar för att konfigurera stilarna för ditt formulär.

Här kan du använda rullgardinsmenyn Stilmall för att välja en ny stilmall. Klicka bara på rullgardinsmenyn och klicka sedan på den stil du vill använda.

Välj en modell för din BMI-kalkylator från rullgardinsmenyn

Nu kommer din mall att utformas i mallen. Så här ser vi ut:

BMI-kalkylatorformulär med nya stilar tillämpade

Lägg till en BMI-kalkylatormall på din webbplats

När du är redo kan du placera ditt liveformulär på din webbplats. Först vill du klicka på knappen “Uppdatera” i det övre högra hörnet för att spara ändringarna:

Uppdatera din BMI-kalkylator

Du måste sedan redigera ett befintligt inlägg eller sida eller skapa ett nytt.

När du har gjort det kan du klicka på (+)-knappen för att lägga till ett nytt block. Gå till sektionen Widgets och klicka på blocket Formidable Form. Eller, om du föredrar det, kan du använda sökfältet för att hitta det.

Välj formulärblocket för att lägga till ditt inlägg eller sida

Nu kan du helt enkelt välja din BMI-form. Klicka på rullgardinsmenyn “Välj formulär” och välj din BMI-kalkylator, så här:

Välj rätt formulär från rullgardinsmenyn Formulär

Du kanske vill förhandsgranska din sida för att se hur din färdiga BMI-kalkylator ser ut på din webbplats. Här är våra:

Se BMI-kalkylatorn på hemsidan

Om det är något du vill ändra eller modifiera, återvänd helt enkelt till ditt formulär i WordPress-instrumentpanelen. Du hittar den nedan Hemskt »Utseende.

Varje gång du ändrar ditt formulär uppdateras det automatiskt överallt på din webbplats. Du behöver inte ändra kortkoden eller göra något ytterligare.

Vi hoppas att den här guiden hjälpte dig att lära dig hur du lägger till en BMI-kalkylator i WordPress med formaterbara formulär. Du kanske också gillar våra artiklar om de mest användbara WordPress-widgetarna och måste ha WordPress-plugins för företagswebbplatser.

Om du gillade den här artikeln, prenumerera på vår YouTube-kanal för WordPress-videohandledning. Du kan även hitta oss på Twitter och Facebook.

Table of Contents