Jak utworzyć kalkulator cen dla swojej witryny internetowej

Opublikowany: 2024-01-18

Zastanawiasz się jak stworzyć na swoją stronę kalkulator cen, który pozwoli użytkownikom na błyskawiczne wybieranie produktów i dokonywanie płatności?

Z przyjemnością usłyszysz, że WPForms umożliwia użytkownikom tworzenie formularzy zamówień dla różnych firm i przypadków użycia, które automatycznie obliczają ceny.

Utwórz teraz swój kalkulator cen

Zatem bez zbędnych ceregieli przejdźmy do kroków, które należy wykonać, aby utworzyć kalkulator cen dla Twojej witryny!

Jak utworzyć kalkulator cen dla swojej witryny internetowej

Utworzenie kalkulatora cen dla swojej witryny za pomocą WPForms jest niezwykle proste. Aby rozpocząć, wykonaj poniższe czynności!

W tym artykule

  • 1. Zainstaluj i aktywuj wtyczkę WPForms
  • 2. Połącz WPForms ze Stripe
  • 3. Wybierz szablon formularza zamówienia
  • 4. Użyj niestandardowych formuł dla zaawansowanych sum
  • 5. Opublikuj formularz rozliczeń/zamówień

1. Zainstaluj i aktywuj wtyczkę WPForms

WPForms to świetne narzędzie do tworzenia formularzy, takich jak formularze kontaktowe i formularze zamówień. Zawiera ponad 1300 szablonów formularzy WordPress, których możesz użyć.

Aby skorzystać z dodatku Obliczenia, musisz pobrać WPForms Pro. Daje to więcej funkcji, takich jak formularze zamówień z dostosowywalnymi polami sumy.

the wpforms homepage

Aby rozpocząć, kup licencję Pro. Następnie zainstaluj WPForms na swojej stronie internetowej. Jeśli potrzebujesz pomocy, postępuj zgodnie z tymi instrukcjami, jak dodać wtyczkę do WordPress.

2. Połącz WPForms ze Stripe

Po utworzeniu WPForms musisz dodać dodatek Stripe Pro.

Jeśli chcesz, możesz zainstalować dodatek dla innego procesora płatności, takiego jak PayPal lub Square, ale do tworzenia formularzy kalkulatora cen polecamy Stripe.

To powiedziawszy, przejdź do WPForms w menu WordPress i kliknij Dodatki .

add new addon wpforms

Poszukaj dodatku Stripe Pro i zainstaluj go na swojej stronie internetowej. Aby to zrobić, po prostu kliknij przycisk Instaluj , a następnie przycisk Aktywuj .

activate stripe pro addon

Następnie przejdź do WPForms »Ustawienia i kliknij Płatności . Tutaj możesz wybrać rodzaj waluty, której chcesz używać.

wpforms currency settings

Następnie połącz swoją witrynę ze Stripe, klikając niebieski przycisk i wprowadzając dane Stripe. Jeśli nie masz konta Stripe, możesz je założyć teraz.

connect with stripe

Po połączeniu się ze Stripe wróć do WPForms » Ustawienia » Płatności . Powinieneś zobaczyć zielony znacznik wyboru wskazujący, że jesteś połączony.

stripe connection status

Teraz możesz złożyć zamówienie za pomocą kalkulatora cen i natychmiastowo otrzymywać płatności za pomocą Stripe!

3. Wybierz szablon formularza zamówienia

Utwórzmy teraz formularz zamówienia. Przejdź do WPForms z panelu WordPress i kliknij opcję Dodaj nowy .

wpforms add new

Następnie nadaj formularzowi nazwę i wybierz szablon. W tym przewodniku wybierzemy formularz rozliczeń/zamówień, aby przyspieszyć tworzenie formularza.

select billing form

Ten szablon zawiera pole Wiele elementów i pole Suma . Możesz zmienić formularz, aby dodać różne rodzaje produktów i obliczyć łączną cenę.

Wprowadzanie zmian w polu wielu elementów

W tym przewodniku zaczynamy od normalnego pola Wiele przedmiotów i zmieniamy je, aby uwzględnić różne typy koszul.

Kliknij pole Wiele elementów , aby zmienić jego zawartość. Oto, co możesz zrobić, aby formularz był lepiej dostosowany do Twojej firmy:

  • Etykieta: To jest nazwa opcji.
  • Przedmioty: Są to różne rzeczy, które możesz wybrać i ich koszty.
  • Pokaż cenę po etykietach przedmiotów: zaznacz tę opcję, jeśli chcesz wyświetlać cenę każdego przedmiotu.

multiple item field order form

Gdy już skończysz, za każdym razem, gdy ktoś wybierze produkt, łączna cena zmieni się od razu, aby dopasować się do tego, co wybrał.

wpforms total amount display

Wybór więcej niż jednego produktu

Może chcesz, aby ludzie wybierali więcej niż jeden produkt. Możesz to łatwo zrobić za pomocą różnych pól i opcji dostosowywania.

Przykładowo, jeśli ktoś chce kupić T-shirt i bluzę, może wybrać oba w tym samym formularzu.

Przejdź do sekcji Pola płatności i skorzystaj z pola Elementy pola wyboru . Tutaj możesz wyświetlić listę wszystkich produktów.

wpforms choose products

Teraz, gdy ktoś wybierze więcej niż jeden produkt, łączna cena będzie sumować wszystkie jego wybory.

total amount multiple products

Dodanie pola karty kredytowej w paski

Najważniejszą częścią formularza zamówienia jest umożliwienie klientom łatwej płatności online, aby mieć pewność, że otrzymasz płatność i będziesz mógł przystąpić do wysyłki zamówienia.

Wcześniej dodaliśmy Stripe Pro i połączyliśmy go z WPForms, aby umożliwić akceptowanie płatności w Twojej witrynie. Teraz czas dodać Stripe do formularza.

Aby skonfigurować płatności Stripe w formularzu, znajdź pole Karta kredytowa Stripe w obszarze Pola płatności i dodaj je do formularza.

add stripe credit card field

Następnie przejdź do sekcji Płatności i przyjrzyj się ustawieniom Stripe . Włącz opcję płatności jednorazowych.

enable one time payments stripe

Teraz Twoi klienci mogą wybierać różne produkty, sprawdzać cenę całkowitą i dokonywać płatności w jednym formularzu!

4. Użyj niestandardowych formuł dla zaawansowanych sum

Jeśli chcesz zrobić więcej, wyświetlając klientom ceny całkowite w formularzu zamówienia, możesz skorzystać z dodatku Obliczenia.

Przejdź do WPForms »Dodatki i poszukaj dodatku Obliczenia . Następnie kliknij przycisk Zainstaluj dodatek . Następnie kliknij przycisk Aktywuj .

activate calculations addon

Teraz możesz tworzyć złożone formuły na cenę całkowitą. Można na przykład dodać pole ilościowe lub wprowadzić standardowe odliczenie podatku.

Dodawanie pola ilościowego

Chcesz pozwolić ludziom wybierać, ile produktów chcą? Dodaj pole ilości do formularza. Po prostu przenieś pole rozwijane do obszaru formularza po prawej stronie.

select dropdown field

Następnie przejdź do opcji pola dla tego pola rozwijanego . Zmień jego nazwę na „Ilość” i wpisz liczby, spośród których ludzie będą mogli wybierać.

wpforms dropdown quantity field

Teraz dodaj pole Pojedynczy element do swojego formularza. Możesz to zrobić, przeciągając i upuszczając go na podglądzie lub po prostu klikając na niego.

single item field

Zmień etykietę tego pola pojedynczego przedmiotu na „Cena całkowita”. Następnie przejdź do zakładki Zaawansowane i włącz opcję Włącz obliczenia .

enable calculation option

W polu Formuła połącz pole Wiele elementów z polem Lista rozwijana ilości. Można to zrobić za pomocą prostego wzoru na mnożenie.

$FX_amount * $FX

Tutaj $FX to wartość pola o identyfikatorze #X, a $FX_amount to wartość ceny pola płatności o identyfikatorze #X.

Otwórz pole Wiele elementów i zanotuj jego identyfikator pola. Znajdziesz to w Opcjach pola na karcie Ogólne .

multiple items field id

Zrób to samo dla pola rozwijanego o nazwie „Ilość”. Jest to ważne w następnym kroku, ponieważ to na nim tworzymy formułę.

dropdown quantity field id

Teraz wystarczy umieścić te identyfikatory we wzorze (cena produktu razy ilość). Zatem $FX_amount * $FX stanie się $F5_amount * $F10 .

Wpisz formułę $F5_amount * $F10 w polu Formuła w polu „Cena całkowita” pojedynczego przedmiotu . Następnie kliknij Sprawdź formułę, aby upewnić się, że jest poprawna.

validate formula option

Teraz, gdy ktoś wybierze produkt i jego ilość, łączna cena zostanie automatycznie obliczona, dzięki dodanej przez Ciebie niestandardowej formule!

Wprowadzanie standardowego odliczenia podatkowego

Jeśli chcesz obliczyć podatki, zwykle mnożysz sumę częściową (cena towaru pomnożona przez liczbę pozycji) przez stawkę podatku.

Jak dowiedziałeś się w ostatnim kroku, wzór na sumę naszego przypadku użycia (cena przedmiotu razy liczba przedmiotów) wygląda następująco:

$F5_amount * $F10

Załóżmy, że kwota podatku jest obliczana jako 10% sumy częściowej. Standardowy wzór naliczania podatku wygląda następująco:

0.10 * ($F5_amount * $F10)

Sumę całkowitą obejmującą podatek ustala się poprzez dodanie sumy częściowej i podatku. Poniższe równanie będzie reprezentować:

($F5_amount * $F10) + (0.10 * ($F5_amount * $F10))

Można to dodać w dowolnym miejscu, w którym chcesz pokazać ostateczną kwotę. Wykorzystamy pole pojedynczego przedmiotu , które nazwaliśmy „Cena całkowita + podatek”.

standard tax formula

Pamiętaj, że tworząc formułę, musisz użyć odpowiedniego identyfikatora pola, aby obliczenia działały prawidłowo. Aby uzyskać dodatkowe informacje i pomoc w tworzeniu formuł, zapoznaj się z tym arkuszem obliczeń

5. Opublikuj formularz rozliczeń/zamówień

WPForms ułatwia publikację formularza i umieszczenie go na swojej stronie internetowej. Po zakończeniu tworzenia formularza kliknij przyciskZapisz .

save form

Następnie kliknij opcję Osadź obok przycisku Zapisz . Możesz opublikować formularz na nowej lub istniejącej stronie.

create new page

WPForms przeniesie Cię do edytora WordPress bez konieczności wykonywania jakichkolwiek czynności. Twój formularz będzie już dostępny na nowej stronie.

Aby aktywować formularz zamówienia i kalkulator online z obliczeniami WPForms, wystarczy kliknąć przycisk Publikuj .

publish form

Po opublikowaniu, jako środek zapobiegawczy, przetestuj osadzony formularz, aby upewnić się, że działa zgodnie z oczekiwaniami i wyklucz wszelkie wątpliwości.

form preview

Często zadawane pytania dotyczące tworzenia kalkulatora cen dla Twojej witryny internetowej

Obliczenia są popularnym tematem wśród naszych czytelników. Oto odpowiedzi na kilka najczęściej zadawanych pytań na ten temat.

Jak utworzyć niestandardowy kalkulator dla mojej witryny internetowej?

Aby utworzyć niestandardowy kalkulator dla swojej witryny, możesz użyć WPForms Pro z dodatkiem Obliczenia. Najpierw zainstaluj WPForms Pro na swojej witrynie WordPress.

Następnie użyj kreatora „przeciągnij i upuść”, aby dodać pola do wprowadzania danych, takich jak ilości i wybór produktów, w celu wypełnienia formularza zamówienia.

Po zakończeniu włącz dodatek Obliczenia, aby wykonywać operacje takie jak dodawanie i mnożenie na podstawie danych wejściowych użytkownika.

Jak dodać obliczenia do strony internetowej?

Aby dodać obliczenia do witryny internetowej, rozważ użycie narzędzia do tworzenia formularzy, takiego jak WPForms Pro, które oferuje dodatek do obliczeń.

Po zainstalowaniu WPForms utwórz nowy formularz i użyj funkcji Obliczenia, aby dodać operacje matematyczne do swoich pól.

Można tworzyć różne formuły przy użyciu podstawowych wyrażeń arytmetycznych lub złożonych w celu dynamicznego obliczania wartości na podstawie danych wprowadzonych przez użytkownika, co jest idealne w przypadku formularzy zamówień, formularzy rezerwacji i nie tylko.

Jak utworzyć formułę cenową?

Aby utworzyć formułę cenową na swojej stronie internetowej, możesz skorzystać z WPForms Pro wraz z dodatkiem Obliczenia.

Zacznij od skonfigurowania formularza z polami dla oferowanych produktów lub usług. Przypisz ceny do tych pozycji.

Następnie użyj dodatku Obliczenia, aby utworzyć formułę, która mnoży ceny towarów przez ilości i dodaje wszelkie dodatkowe opłaty lub rabaty.

Następnie dowiedz się, jak utworzyć niestandardowy kalkulator kredytu hipotecznego

Chcesz stworzyć niestandardowy kalkulator kredytu hipotecznego dla swojej witryny internetowej? Korzystając z internetowego kalkulatora kredytu hipotecznego, urzędnicy ds. kredytów mogą szybciej sprawdzać wnioskodawców i ograniczać ilość bałaganu w dokumentach. Sprawdź ten przewodnik na temat tworzenia niestandardowego kalkulatora kredytu hipotecznego przy użyciu szablonu WordPress.

Utwórz teraz swój kalkulator cen

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.