Jak zrobić niestandardowy kalkulator online za pomocą WPForms

Opublikowany: 2023-11-13

Czy zastanawiałeś się kiedyś jak zrobić kalkulator w WordPressie pod kątem unikalnych potrzeb Twojej witryny?

Przechwytując adresy e-mail odwiedzających, kalkulatory są doskonałym sposobem na wygenerowanie dodatkowych potencjalnych klientów dla Twojej firmy.

Utwórz teraz swój kalkulator

Kalkulatory mogą również zwiększyć zaangażowanie, ponieważ pozwalają przyciągnąć użytkowników, aby pozostali na Twojej stronie dłużej i odpowiadali na wszelkie ich pytania.

W tym artykule przeprowadzimy Cię przez kolejne etapy tworzenia niestandardowego kalkulatora w WordPress przy użyciu WPForms!

Po co dodawać niestandardowy kalkulator w WordPress?

Niestandardowy kalkulator umożliwia użytkownikom łatwe obliczanie bez konieczności opuszczania witryny, co zwiększa współczynnik zaangażowania.

Na przykład, jeśli prowadzisz witrynę internetową o samochodach, możesz dodać kalkulator płatności za samochód, aby pomóc odwiedzającym łatwo ocenić miesięczne płatności za nowy pojazd i pomóc im w podejmowaniu decyzji o zakupie.

Podobnie witryna poświęcona fitnessowi lub zdrowiu nie jest kompletna bez kalkulatora wskaźnika masy ciała BMI, który pomaga użytkownikom określić, na jakim etapie są pod względem zdrowotnym, zapewniając podejmowanie świadomych i bardziej pozytywnych wyborów.

Możesz także zwiększyć przejrzystość i zaufanie klientów, oferując potencjalnym klientom Kalkulator kosztów wysyłki, aby uzyskać natychmiastowe oszacowanie kosztów wysyłki w Twojej witrynie eCommerce.

Możesz też dodać do witryny lekarza weterynarii kalkulator wieku psa, który pozwoli właścicielom zwierząt poznać wiek psa wyrażony w latach ludzkich. Biorąc to pod uwagę, przyjrzyjmy się teraz, jak łatwo utworzyć dowolny typ kalkulatora za pomocą WPForms.

Jak zrobić niestandardowy kalkulator w WordPress

Tworzenie niestandardowego kalkulatora w WordPress za pomocą WPForms jest bardzo łatwe. Wszystko, co musisz zrobić, to wykonać poniższe proste kroki:

W tym artykule

  • 1. Zainstaluj i aktywuj WPForms Pro
  • 2. Pobierz dodatek Obliczenia
  • 3. Wybierz profesjonalnie zaprojektowany szablon kalkulatora
  • 4. Dostosuj szablon formularza kalkulatora
  • 5. Opublikuj formularz kalkulatora

1. Zainstaluj i aktywuj WPForms Pro

WPForms to najlepsza wtyczka do tworzenia formularzy i kalkulatora, która pozwala tworzyć wszelkiego rodzaju formularze. Oferuje ogromną listę gotowych szablonów formularzy kalkulatorów, których wiele firm internetowych może używać jako narzędzi do generowania leadów.

Ponieważ w tym samouczku będziemy używać dodatku Calculations, musisz subskrybować WPForms Pro, który zapewnia również dostęp do integracji premium, dodatków i mnóstwa cennych funkcji, takich jak logika warunkowa, raporty formularzy itp.

The WPForms homepage

Po zakupie licencji Pro przystąp do instalacji i aktywacji wtyczki WPForms na swojej stronie internetowej. Na początek przeczytaj te proste instrukcje dotyczące instalacji wtyczki WordPress.

2. Pobierz dodatek Obliczenia

Instalacja dodatku Obliczenia na Twojej stronie WordPress jest bardzo prosta. W panelu WordPress kliknij WPForms , a następnie wybierz Addons .

WPForms addons

Wpisz „Obliczenia” w polu Wyszukaj dodatki . Następnie kliknij przycisk Zainstaluj dodatek , a następnie kliknij przycisk Aktywuj .

Activate Calculations Addon

Dobra robota! Pokażemy Ci teraz, jak utworzyć formularz kalkulatora za pomocą szablonu i zmodyfikować go, aby generować leady.

3. Wybierz profesjonalnie zaprojektowany szablon kalkulatora

Nadszedł czas na zbudowanie nowej formy. Z pulpitu nawigacyjnego WordPress wybierz WPForms , a następnie kliknij przycisk Dodaj nowy .

Add new form

Spowoduje to przejście do następnego ekranu. Na początek nazwij swój formularz . Nazwiemy nasz na przykład „Kalkulatorem kredytu hipotecznego”.

Name your form

Następnie przewiń w dół i wybierz kategorię Kalkulator , aby znaleźć odpowiedni formularz w oparciu o wymagania Twojej firmy.

Calculator template category

Po znalezieniu odpowiedniego szablonu kliknij przycisk Użyj szablonu . W tym samouczku wybierzemy formularz kalkulatora kredytu hipotecznego.

Click Use Template

Zostaniesz teraz przekierowany do ekranu Pola . Na tym ekranie zobaczysz listę dostępnych pól w lewym panelu.

WPForms fields menu

W prawym panelu zobaczysz edytowalny podgląd formularza. Ponieważ wybraliśmy szablon kalkulatora, pola zostaną dodane automatycznie.

Calculator form preview

Możesz teraz używać intuicyjnego kreatora WPForms typu „przeciągnij i upuść”, aby łatwo modyfikować, porządkować lub dodawać pola, aby dostosować formularz do własnych upodobań.

4. Dostosuj szablon formularza kalkulatora

Jeśli używasz formularza kalkulatora do generowania potencjalnych klientów, możesz dostosować pola formularza, aby działały jak formularz kontaktowy. W kreatorze formularzy przejdź do Ustawienia » Formularze kontaktowe .

Spowoduje to wyświetlenie wyskakującego okienka z informacją: „Dodatek Lead Forms nie jest zainstalowany. Czy chcesz go zainstalować i aktywować?”. Kliknij przycisk Tak, zainstaluj i aktywuj .

Install Lead Forms

Następnie kliknij przycisk Tak, zapisz i odśwież, aby zakończyć instalację, a następnie włącz opcję Włącz tryb formularza kontaktowego .

Enable Lead Form Mode

Spowoduje to wyświetlenie kolejnego wyskakującego okienka z informacją, że dodatek Lead Forms Addon zrestrukturyzuje Twój formularz. Kliknij przycisk Włącz formularze kontaktowe .

Enable Lead Forms

Wtyczka formularzy będzie teraz automatycznie konwertować pola obliczeniowe na formularz kontaktowy. Zwykle zajmuje to kilka sekund, chyba że masz dużo pól.

Converting to Lead Form

Możesz teraz przystąpić do dodawania, modyfikowania i porządkowania pól według własnych upodobań. Na przykład dodaliśmy pole Imię i adres e-mail na górze formularza.

Add Name and Email Fields

Możesz także zaznaczyć pola Imię i E-mail zgodnie z wymaganiami na karcie Ogólne dla każdej z Opcji pól .

Mark field as required

Aby zachęcić użytkownika do przesłania formularza, możesz także zmienić tekst przycisku przesyłania, aby usprawnić proces generowania leadów.

Aby to zrobić, przewiń w dół od prawego podglądu formularza, aż dojdziesz do dołu. Stamtąd kliknij przycisk Prześlij .

Click Submit button

Spowoduje to przekierowanie do karty Ustawienia »Ogólne . W tym miejscu zmień tekst przycisku przesyłania na coś w rodzaju „Wyślij moje wyniki”.

Change Submit Button Text

Po dostosowaniu kalkulatora i formularza kontaktowego tak, aby zawierał wszystkie potrzebne funkcje, nie zapomnij nacisnąć przycisku Zapisz .

Save the form

I masz to! Możesz teraz opublikować formularz kalkulatora w WordPress, aby zwiększyć generowanie potencjalnych klientów i liczbę konwersji e-mailowych.

5. Opublikuj formularz kalkulatora

Po utworzeniu formularza kalkulatora przy użyciu szablonu możesz dodać go do swojej witryny WordPress i nadać mu dalszy styl za pomocą edytora bloków.

Utwórz nową stronę lub post albo zaktualizuj istniejący. Następnie musisz kliknąć przycisk Dodaj blok , a następnie wybrać ikonę WPForms .

Add form widget WPForms

Następnie wybierz niestandardowy formularz kalkulatora online z menu rozwijanego w widżecie WPForms, aby dołączyć go do swojej strony/postu.

Select Calculator Form

Gdy będziesz zadowolony z wyglądu formularza, po prostu kliknij przycisk Aktualizuj lub Publikuj , aby ożywić formularz.

Publish Calculator Form

Aby mieć pewność, że nie wystąpią żadne problemy, ważne jest przetestowanie osadzonego formularza po opublikowaniu i sprawdzenie, czy działa on zgodnie z oczekiwaniami w interfejsie użytkownika.

Testing Calculator Form

Więcej pytań dotyczących tworzenia kalkulatora

Nauka tworzenia kalkulatora w WordPressie jest popularnym tematem zainteresowań naszych czytelników. Oto odpowiedzi na niektóre często zadawane pytania na ten temat.

Jak trudno jest stworzyć własny kalkulator?

Utworzenie kalkulatora dla witryny WordPress może być proste. Dzięki narzędziom takim jak WPForms możesz łatwo tworzyć niestandardowe kalkulatory bez konieczności posiadania wiedzy na temat kodowania. Interfejs jest przyjazny dla użytkownika i intuicyjny.

Jak dodać kalkulator na swoją stronę internetową?

Aby dodać kalkulator do swojej witryny, rozważ użycie WPForms. To zaufana wtyczka kalkulatora WordPress, która umożliwia bezproblemową integrację kalkulatora. Dzięki dodatkowi Obliczenia możesz zaprojektować dowolny kalkulator dostosowany do Twoich potrzeb.

Jak stworzyć kalkulator kredytu hipotecznego w WordPress?

Tworzenie kalkulatora kredytu hipotecznego jest bardzo łatwe dzięki WPForms. Po zainstalowaniu wtyczki włącz dodatek Obliczenia. Ten dodatek pozwoli Ci skonfigurować pola i formuły, zapewniając odwiedzającym dokładne szacunki kredytu hipotecznego.

Jak zrobić darmowy kalkulator w WordPress?

Chociaż dostępne są bezpłatne narzędzia do tworzenia kalkulatorów, zawsze lepiej jest skorzystać z płatnego narzędzia, takiego jak WPForms. Dzięki temu możesz tworzyć różne kalkulatory z zaawansowanymi funkcjami za pośrednictwem dodatku Obliczenia.

Następnie dowiedz się, jak zmienić obliczenia ceny całkowitej za pomocą WPForms

Czy chcesz użyć obliczeń WPForms, aby odzwierciedlić całkowitą kwotę zamówienia na podstawie wyboru produktów przez użytkownika? Sprawdź jak dodać opcje produktu zmieniające obliczoną cenę produktu za pomocą WPForms.

Utwórz teraz swój kalkulator

Gotowy do zbudowania formularza? Zacznij już dziś od najłatwiejszej wtyczki do tworzenia formularzy WordPress. WPForms Pro zawiera wiele bezpłatnych szablonów i oferuje 14-dniową gwarancję zwrotu pieniędzy.

Jeśli ten artykuł Ci pomógł, śledź nas na Facebooku i Twitterze, aby uzyskać więcej bezpłatnych samouczków i przewodników WordPress.