Multi Step Forms in Webflow (with Inputflow)

Поделиться
HTML-код
  • Опубликовано: 27 ноя 2024

Комментарии • 113

  • @mikepecha
    @mikepecha  Год назад +5

    ▶Check out the updated tutorial for the new version of Inputflow:
    ruclips.net/video/TLxTJE5ii_w/видео.html

  • @jonasarleth
    @jonasarleth Год назад +10

    Mike, das ist Next-Level was du hier baust! Toller Mehrwert für die Community!

    • @mikepecha
      @mikepecha  Год назад +1

      Danke Jonas, über deinen Kommentar freue ich mich natürlich besonders 😉

  • @arafatifatine1554
    @arafatifatine1554 29 дней назад +1

    I think you don’t understand how much i love you and how you have been useful to me

    • @mikepecha
      @mikepecha  28 дней назад

      @@arafatifatine1554 Thank you :) happy to hear, that you enjoy the videos

  • @ThaisZochi
    @ThaisZochi Год назад +2

    Your content is just awesome, Mike. Thanks for sharing all these with us!

  • @oyegokeamina5864
    @oyegokeamina5864 7 месяцев назад +1

    mike making life easier for developers thank you

    • @mikepecha
      @mikepecha  7 месяцев назад

      Thanks mate :)

  • @jeroendonker
    @jeroendonker Год назад +1

    Sehr gut! Danke schön. Heute wird's live benutzt…

    • @mikepecha
      @mikepecha  Год назад +1

      Cool. Freut mich zu hören :) Ich arbeite gerade an Version 2 die wird dann in wenigen Wochen live gehen. Da sind dann noch mal deutlich mehr Funktionen dabei. Wenn du irgendwelche Fragen zum Setup hast schreib' mir gerne per Mail/Twitter .
      Gruß, Mike :)

    • @jeroendonker
      @jeroendonker Год назад

      @@mikepecha It works fine. Only thing I find is that the script ignores the fact that some fields are requiered.

  • @ValiantLinesTeam
    @ValiantLinesTeam Год назад +1

    Incredibly useful content and tool! I'll definitely be using it on my designs! Thank you for your work!

    • @mikepecha
      @mikepecha  Год назад

      Thanks :) Happy to hear that

  • @settledhomeloans
    @settledhomeloans Год назад +3

    Great work @mikepecha this is a really help video and awesome tool 👏👏👏

    • @mikepecha
      @mikepecha  Год назад

      Happy to hear that settledhomeloans :)

  • @DavidPeyrouty
    @DavidPeyrouty Год назад +1

    You are just amazing! Thank you so much to share your knowledge with us...

    • @mikepecha
      @mikepecha  Год назад

      Thanks for you nice comment David :)

  • @22-Zar
    @22-Zar 9 месяцев назад +1

    You're a legend brother

    • @mikepecha
      @mikepecha  9 месяцев назад

      Thank you, Lazar :)

  • @dimitrisqq
    @dimitrisqq Год назад +1

    Taking things to the next level! Awesome job!

    • @mikepecha
      @mikepecha  Год назад

      Thanks Dimitris 😎. Not as advanced as some of your deltaclan solutions, but working on it 😉

  • @eddiewhatson1800
    @eddiewhatson1800 Год назад +1

    Very clear and great UX, nice work

  • @webtotheflow
    @webtotheflow Год назад +1

    Ziemlich cool @Mike! Trifft nicht ganz meine Preisvorstellung, weil ich das aktuell mit custom code löse.. Aber ich bin mir sicher, das wird vielen hier mega weiterhelfen!

    • @mikepecha
      @mikepecha  Год назад +1

      Danke für dein Feedback, Marvin :)

  • @avisargoldman
    @avisargoldman Год назад +1

    This is great, thanks! Is there a way to refresh the builder if I made a change on my form page on Webflow (added an option to a radio button field, added an additional step etc), and dont want to rebuild the full logic flow from scratch?

  • @mystralpath
    @mystralpath Год назад +2

    Hey Mike, great video, congratulations!
    I am just starting out with Webflow, there is one thing I couldn't understand,
    when the user submits the form, how do I know which service they chose from the beginning?
    Do you suggest to insert tags on every form with which the user interacts, in order to profile the user from the beginning?
    Thank's

    • @mikepecha
      @mikepecha  Год назад

      You can see it in the Webflow form submission. Alll of the steps and input fields are inside a single form => If this form gets submitted, all the answers of all steps are submitted as well.

  • @ProNoobDev
    @ProNoobDev Год назад +1

    Amazing stuff as usual !

  • @QasimHayat-w1e
    @QasimHayat-w1e Год назад +2

    Really helpful so far. Just wondering how can we add button to go to previous page ?

    • @mikepecha
      @mikepecha  Год назад

      Yes, will be possible in 1-2 weeks

  • @davidprioul
    @davidprioul Год назад +1

    Very smart ! Very useful ! Very easy to use ! Thanks @mikepecha !

    • @mikepecha
      @mikepecha  Год назад

      Happy to hear that, David :)

  • @kunlearegbesola1510
    @kunlearegbesola1510 Год назад +1

    That’s a great job mike , awesome … pls help implement a back and forward button … and if possible make a video of how to work around using the back and forward button

    • @mikepecha
      @mikepecha  Год назад

      Thanks mate. The back and forth button can be configured with the if-element=button-next and if-element=button-back attributes

  • @ALSNSignageContractor
    @ALSNSignageContractor Год назад +1

    Hey Mike! Really enjoy the videos and learn a lot! How about the CMS? Can we integtate it with maybe google sheet?

    • @mikepecha
      @mikepecha  Год назад

      Happy to hear that :)
      How do you want to connect Google sheets with the CMS?

  • @habilosauditoredafirenze3564
    @habilosauditoredafirenze3564 2 месяца назад +1

    This is great! Is it also possible to create the form in a way that it automatically goes to the next step after I click on a list element?

    • @mikepecha
      @mikepecha  2 месяца назад

      Yes, there is an option in the form settings to achieve that

  • @the10er_com
    @the10er_com Год назад +1

    Hey Mike! Really enjoy the videos and learnt a few things I didn’t know from your other ones. Is it possible with your product to create a section just before submission when the user can review the information they have given as an overview? Thanks! James

    • @mikepecha
      @mikepecha  Год назад

      Hi James, yes that is possible to a certain extend. With the pro version of Inputflow there is the possibility to display the user input somewhere else inside the form.
      Check out this documentation video: ruclips.net/video/Ofjk1JT_uaM/видео.html

  • @peoz_7195
    @peoz_7195 Год назад +1

    great video! i am getting into designing with webflow and i would to know how you made the form itself. i am struggling to figure out how to make bigger elements clickable and to act as input for the form, like you did for example with the "Custom Javascript" card, the radio_content element to be exact, thx😁

    • @mikepecha
      @mikepecha  Год назад

      I will record a video about this soon

  • @designbasestudio
    @designbasestudio Год назад +1

    Hi Mike, cooles Tool. Gibt es auch die Möglichkeit, dass der next button erst funktioniert, wenn alle Pflichtfelder ausgefüllt sind? Aktuell werden die glaube ich ignoriert und man kann gänzlich ohne das Formular abschicken.

    • @mikepecha
      @mikepecha  Год назад +1

      Servus, es gibt seit ein paar Tagen eine Pro Version, wo die Input Validation & Custom Fehlermeldungen dabei sind.
      In der Basis-Version werden die required Attribute fields entfernt, damit am Ende das Formular nicht ohne Fehlermeldung blockiert. Das mit dem deaktivierten Button ist eine gute Idee. Ich schaue mal, wie ich das geschickt einbauen kann👍

    • @designbasestudio
      @designbasestudio Год назад +1

      @@mikepecha funktioniert gut in der Pro Version! In der light wäre es cool, wenn die native checkbox "required" beachtet werden würde

  • @michyarry
    @michyarry 9 месяцев назад

    Very nice! Is there any way to get a "summary so far"-feature? What I mean is, if there are many steps for a service, can I somehow show which selections the user has selected so far, as well as a complete overview before they send it in?

    • @mikepecha
      @mikepecha  8 месяцев назад

      Yes, in the new Inputflow App you can display all Input values with an intuitive syntax

  • @Ehsan580
    @Ehsan580 9 месяцев назад +1

    hi mike pecha thanks for the video
    does it have a way for back button (how to add it)

    • @mikepecha
      @mikepecha  9 месяцев назад

      instead of if-element=button-next, you can also set if-element=button-back

    • @Ehsan580
      @Ehsan580 9 месяцев назад

      @@mikepecha thanks Mike I really appreciate it

  • @VenomousDesign
    @VenomousDesign Год назад +2

    Pls use steps on RUclips. But thx for the useful video!

  • @DJPECET9
    @DJPECET9 Год назад +1

    Thanks for tutorial. How to sent answers to extrernal API?

    • @mikepecha
      @mikepecha  Год назад

      What API do you want to send it to?

  • @andrew-pro85
    @andrew-pro85 Год назад +1

    Mike, thank you, very useful! Very easy to use your service! I just have a few questions:
    1) For some reason there is no check for required fields, even if the fields in webflow are marked as required, is it something to do with your script?
    2) It would also be nice to make a "Back" button (or link) to go back to the previous step. Is this possible?

    • @mikepecha
      @mikepecha  Год назад +2

      Hi Andrew, Thanks for your feedback!
      1) right now there is no validation functionality, but I will build this in the coming weeks. Until then, that's why the reuqired attribute is removed before submission, b/c otherwise it would silently fail. (As some input fields are required, but no longer visible b/c they are in a different step)
      2) This will be implemented within the next few days.
      Cheers, Mike

    • @tinadee8488
      @tinadee8488 Год назад

      @@mikepechahas the required field functionality been enabled now? It's not working in your clonable.

    • @mikepecha
      @mikepecha  Год назад

      @@tinadee8488 Yes, in in the premium version

    • @tinadee8488
      @tinadee8488 Год назад

      Where is the pricing for that? I need to quote a client. @@mikepecha

  • @marcelolopes4943
    @marcelolopes4943 Год назад +1

    Amazing!

  • @tana_dior
    @tana_dior Год назад +1

    Hey I saw where you had a project with pizza and you incremented the price based on select. How can I contact you to ask about that?

    • @mikepecha
      @mikepecha  Год назад

      Send an email to hey@inputflow.io

  • @dennisrivers3918
    @dennisrivers3918 Год назад +1

    Hey Mike. I'm trying to use this in Cms, but it only seems to work for one of the cms items. Is there a way around this?

    • @mikepecha
      @mikepecha  Год назад

      Hi Dennis, I replied to your form submission via email :)

  • @Norell88
    @Norell88 Год назад +1

    Great!

  • @danielcech7839
    @danielcech7839 Год назад

    Hey Mike, this is just perfect! Is this going to be free forever?

    • @mikepecha
      @mikepecha  Год назад +1

      Happy to hear that, Daniel :) I am working on a Pro version right now, with additional features, but there will always be a useful free version as well.

  • @tana_dior
    @tana_dior Год назад +1

    Can you also creat a progress bar?

    • @mikepecha
      @mikepecha  Год назад

      Not yet, but will be possible in the near future!

  • @arielmoisesmaradiagarodrig9707
    @arielmoisesmaradiagarodrig9707 8 месяцев назад +1

    I have a question, after my form collected this info from my clients, how do i collect this data the user selected after?

    • @mikepecha
      @mikepecha  8 месяцев назад

      I am not 100% sure what you mean. Could you elaborate?

  • @niLmagikero
    @niLmagikero Год назад +1

    Can we use hubspot to collect the data from the form?

    • @mikepecha
      @mikepecha  Год назад

      Sure. You can connect the form to Hubspot just like a normal Webflow form.

  • @jeroendonker
    @jeroendonker Год назад +1

    Gibt's auch die möglichkeit ein zurück-button ein zu bauen?

    • @mikepecha
      @mikepecha  Год назад +1

      Ja, mit dem Attributed if-element=button-back

    • @jeroendonker
      @jeroendonker Год назад

      Das war schnell, danke schön!@@mikepecha

  • @해피뉴이어-j8i
    @해피뉴이어-j8i Год назад +1

    Can I make pricing calculator with this tool??

    • @mikepecha
      @mikepecha  Год назад +1

      Yes, you can. Check out this: solar-investment-calculator.webflow.io/

  • @sam-45632
    @sam-45632 Год назад +1

    Hey is there an option to make to next step appear after choosing one Input?

    • @mikepecha
      @mikepecha  Год назад

      Yes, the feature will be released next week

    • @sam-45632
      @sam-45632 Год назад

      @@mikepecha Danke genau richtig mir ist gerade aufgefallen du bist ja deutscher. Dein Tool ist echt geil dadurch braucht man nicht merh die ganzen überteuerten 3rd party tools zu benutzen

  • @inspirefunding
    @inspirefunding Год назад +1

    Hi mike, how do i add hte submit form button

    • @mikepecha
      @mikepecha  Год назад

      Hi, you can use the standard Webflow "Form button" element

  • @LionelWassilowsky
    @LionelWassilowsky Год назад +1

    kann ich den attribute für next button auch einfach in radio button packen damit man drauf clickt und direkt weiter kommt. Ansonsten geiles tool weiter so!

    • @mikepecha
      @mikepecha  Год назад

      Coole Idee. Habe ich selber gar nicht dran gedacht. Sollte eigentlich funktionieren. Ich arbeite gerade an Version 2, welche in wenigen Wochen fertig sein wird, da wird das dann nochmal ein separatesFeature sein :)

  • @anshkid
    @anshkid 11 месяцев назад +1

    Is it possible to have multiple forms on one page?

    • @mikepecha
      @mikepecha  11 месяцев назад

      Not yet, but will be available soob

  • @eddiewhatson1800
    @eddiewhatson1800 Год назад +1

    Did you manage to implement a 'Back' button into this, I think that's the only thing stopping me from using this

    • @mikepecha
      @mikepecha  Год назад +1

      Is implemented now :)

    • @eddiewhatson1800
      @eddiewhatson1800 Год назад

      That's great! How might I implement a 'Back' button into my project? @@mikepecha

  • @unitee.international
    @unitee.international Год назад

    In der Theorie sehr genial, in der Praxis vielleicht auch, aber leider funktioniert es bei mir irgendwie nicht. Wahrscheinlich liegt der Fehler bei mir, aber sobald ich das Code Snippet in den Header Bereich einfüge, werden meine Formularseiten weiß und es passiert nichts mehr, egal ob ich auf "weiter" klicke, oder auf "zurück". Sobald ich das Snippet wieder entferne funktioniert alles wieder. Das ist jetzt wahrscheinlich eine Frage, die man so nicht einfach beantworten kann, aber was könnte ich falsch gemacht haben? Die Divs sind alle passend benannt, die einzelnen Seiten miteinander verknüpft und die Wenn-Dann-Funktionen passend ausgewählt. Das ich es als Popup in meine Seite integriert habe, welches sich durch das klicken eines Button öffnet, dürfte das Ganze ja eigentlich nicht beeinflussen oder?

    • @mikepecha
      @mikepecha  Год назад +1

      Schick mir mal deinen read-only link + Link zur live Webseite an mike@inputflow.io, dann schaue ich es mir an

  • @SeanBohan-z9v
    @SeanBohan-z9v Год назад +1

    Is there a way to do this on wordpress?

    • @mikepecha
      @mikepecha  Год назад

      No, Inputflow is made specifically for Webflow

  • @nylemanzar565
    @nylemanzar565 Год назад +1

    Could You Make a video of imbedding chat feature into webflow like fiverr?

  • @norbertpeto3035
    @norbertpeto3035 Год назад +1

    Hi Mike, that's great, but the multi-step form is not cloneable.

    • @mikepecha
      @mikepecha  Год назад +1

      Just fixed, you should be able to clone it now! Thanks for pointingthis out, Norbert!

  • @dzenandervic1066
    @dzenandervic1066 Год назад +1

    Can you make a back button?

    • @mikepecha
      @mikepecha  Год назад +1

      Working on it right now ;) Will be available in 1-2 weeks

  • @Bob-qf5ue
    @Bob-qf5ue Год назад

    Hi, ist das DSGVO Konform?

    • @mikepecha
      @mikepecha  Год назад

      Du kannst es mit einem DSGVO konformen Forular Anbieter verknüpfen. Schaue dir dazu am besten mal dieses Video hier an:
      ruclips.net/video/C80hhcwPX3o/видео.html

    • @Bob-qf5ue
      @Bob-qf5ue Год назад +1

      @@mikepecha super, danke dir

    • @mikepecha
      @mikepecha  Год назад

      Gerne :)

  • @jorims8537
    @jorims8537 Год назад

    Great stuff! Is this free?

    • @mikepecha
      @mikepecha  Год назад +1

      There is a free and a paid version

    • @mikepecha
      @mikepecha  Год назад

      @@jorims8537 Ja, gibt es in der Pro Version wenn du auf das settings Icon oben rechts im Form Editor klickst