komplexe Kontaktseite umsetzen

Hallo zusammen,

ich bin noch nicht sehr tief in Typo3 drin, habe also nur relativ triviale Probleme bisher lösen müssen.
Jetz habe ich allerdings eine Anforderung bei der ich mir nicht sicher bin, wie ich das aus technischer Sicht angehen soll. Vielleicht hat ja hier jemand mit viel Erfahrung eine best practice Lösung parat.

Es geht darum, dass eine Kontakt-Unterseite existiert, soweit so gut. Allerdings soll diese quasi den User durch vorangehende Ja-Nein-Fragen zum entsprechenden Formular führen. Konkret gibt es halt unterschiedliche Produkte, was interaktiv abgefragt werden soll a la "Haben Sie ein Problem mit Produkt XY ?" ,"Haben Sie die Anleitung gelesen?" usw., welche dann zu unterschiedlichen Ergebnissen führt.
Letztendlich wird dadurch gesteuert welche Angaben auf dem Kontaktformular zu machen sind bzw. der andere Fall wäre der Hinweis "sich doch bitte die Anleitung durchzulesen" mit einem "Link" zu einem (dem)Kontaktformular für hartnäckige Fälle ^^

Jetzt stellt sich mir die Frage wie ich da rangehen soll. Das ganze soll natürlich möglichst leicht für den Redakteur zu pflegen sein und es gibt selbstredend verschiedene Sprachen.
Ich möchte das ganze natürlich auf einer, nämlich der Kontaktunterseite, Seite durchspielen.

Meine erste, wohl naive, Idee war im Backend ein entsprechendes Backendlayout für die Kontaktunterseite anzulegen mit einem HTML-Element, dann halt die Sprachen dazuschalten, damit man das leicht Übersetzen kann und das JS-File mit einer Funktion "switchDiv(name)", welche mir die Divs hided/visible macht, wenn entsprechend ja/nein geklickt wird, über Typoscript einbinden. Dazu dann noch die send.php...

So der Plan, aber da sich das irgendwie nicht so ganz sauber anfühlt, ich aber keine Alternative Möglichkeit kenne (weil kaum Erfahrung), bitte ich mal hier um Erleuchtung.
Ist soetwas mit extensions zu lösen, sollte man für sowas selber eine bauen (und wenn ja vllt noch ein kleiner Tipp wie das grob aussehen würde 🙂)oder was sind eure Meinungen dazu ?

Ich hoffe meine Schilderungen sind verständlich, wenn nicht, kann ich das gerne nochmal genauer ausführen.

Danke schonmal für Input !

Schade, dass bisher keiner das Thema aufgreifen konnte/wollte.
Ich habe es nun nach einiger Recherche einfacher gelöst. Und zwar durch eine Kombination des t3sbootstrap-Plugins und dem integrierten Forms-Modul.
Damit konnte ich bisher alles abbilden (Buttons, Columns etc) ohne unzählige Typoscript-Objekte anzulegen oder HTML-Elemente einzufügen. Pflegeleicht ist es aus dem Backend heraus auch, da man ganz normal einfach den Content unter "Pages" abändert und somit auch die normale Übersetzungsfunktion greift...

Jedoch habe ich nun ein äußerst ärgerliches Problem und möchte hier nochmal um Hilfe bitten:
Ich habe in einem Formular (wie gesagt über das integrierte Backendmodul erstellt) einen Datepicker, der allerdings NICHT FUNKTIONIERT ! Die Fehlermeldung "Datepicker sei keine Funktion" und die Warnung "jQuery.Deferred exception: $(...).datepicker is not a function" führten mich nach lach einigen verschiedenen Ansätzen immer wieder zu dem Schluss, dass etwas mit den Jquery und Bootstrap Includes nicht stimmt, sprich die Reihenfolge... ich habe diese mittlerweile vermutlich in allen erdenklichen Reihenfolgen getestet ohne Erfolg.
Ich beziehe die externen Libraries ausschließlich von cdnjs oder google...
Hier das Typoscript dazu:

    includeCSS {
    styles = {$path.public}Stylesheets/styles.css
  } ### includeCSS END

  includeCSSLibs {
    bootstrap = https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css
    bootstrap.external = 1
    bootstrap.disableCompression = 1

    google = https://fonts.googleapis.com/css?family=Playfair+Display:700,900
    google.external = 1
    google.disableCompression = 1
  } ### includeCSSLibs END

  includeJS {
    jQuery.version = latest
    jQuery.noConflict = 1

    jQuery = https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js
    jQuery.async = 1
    jQuery.external = 1
    jQuery.disableCompression = 1


    stickyJS = {$path.public}Javascript/sticky-kit.js

    jQueryUi.version = latest
    jQueryUi.noConflict = 1
    jQueryUi = https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js
    jQueryUi.async = 1
    jQueryUi.external = 1
    jQueryUi.disableCompression = 1

    nvmJS = {$path.public}Javascript/nvm.js

    bootstrapMaxCdn = https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.js
    bootstrapMaxCdn.external = 1
    bootstrapMaxCdn.disableCompression = 1

    bootstrapMaxCdnMap = https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.js.map
    bootstrapMaxCdnMap.external = 1
    bootstrapMaxCdnMap.disableCompression = 1

    bootstrapMinCdnMap = https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.min.js.map
    bootstrapMinCdnMap.external = 1
    bootstrapMinCdnMap.disableCompression = 1
  }

  }

Ich hoffe auf eine Antwort, denn dieser Fehler ist wirklich äußerst nervenaufreibend, danke schonmal !

So...nochmal ein Update, sollte jemand ähnliche Probleme haben und keine Antworten finden:
Ich habe es nach weiterem munteren hin und her tauschen aus Spaß an der Freude einfach mal in die JSFooterLibs geschrieben und siehe da: black magic happens! Läuft zwar immer noch nicht rund, aber besser als vorher.

includeCSS {
    styles = {$path.public}Stylesheets/styles.css
    sfStyles = {$path.public}Stylesheets/superfish.css
  } ### includeCSS END

  includeCSSLibs {
    jqueryUi = https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/base/jquery-ui.css
    jqueryUi.external = 1
    jqueryUi.disableCompression = 1
    jqueryUi.excludeFromConcatenation = 1

    bootstrapCss = https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css
    bootstrapCss.external = 1
    bootstrapCss.disableCompression = 1
    bootstrapCss.excludeFromConcatenation = 1

    bootstrapCssMap = https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css.map
    bootstrapCssMap.external = 1
    bootstrapCssMap.disableCompression = 1


    google = https://fonts.googleapis.com/css?family=Playfair+Display:700,900
    google.external = 1
    google.disableCompression = 1
    google.excludeFromConcatenation = 1


  } ### includeCSSLibs END

  includeJSFooterlibs {
    jQuery.version = latest
    jQuery.noConflict = 1

    jQuery = https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js
    jQuery.async = 1
    jQuery.external = 1
    jQuery.disableCompression = 1
    jQuery.forceOnTop = 1
    jQuery.excludeFromConcatenation = 1

    bootstrap = https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.js
    bootstrap.external = 1
    bootstrap.disableCompression = 1
    bootstrap.excludeFromConcatenation = 1

    bootstrapMap = https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.js.map
    bootstrapMap.external = 1
    bootstrapMap.disableCompression = 1
    bootstrapMap.excludeFromConcatenation = 1

    sfMenu = {$path.public}Javascript/superfish.js
    sfMenu.disableCompression = 1

    jQueryUi.version = latest
    jQueryUi.noConflict = 1
    jQueryUi = https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js
    jQueryUi.async = 1
    jQueryUi.external = 1
    jQueryUi.disableCompression = 1
    jQueryUi.excludeFromConcatenation = 1

    stickyJS = {$path.public}Javascript/sticky-kit.js
    stickyJS.disableCompression = 1

    customJS = {$path.public}Javascript/custom.js
    customJS.disableCompression = 1
  }