Kontaktformular wird auf Seiten für Smartphone und Tablet nicht angezeigt

hallou1 schrieb am 29.07.2014 um 10:01 Uhr

Hallo zusammen,. ich arbeite mit dem Web Designer Pro 10. Ich erstelle eine Internetseite, die automatisch auch auf Smartphone und Tablet skaliert. Bei der Erstellung der Kontaktseite stehe ich vor einer Herausforderung. Für das Kontkatformular verwende ich ein Formular, welches ich auf jotform.com erstellt habe. Auf der Standardseite (Breite 960px) wird das Kontaktformular ordnungsgemäß dargestellt. Allerdings ist hier eine Variantenteilung mit den anderen Seitenformaten (Tabletbreite 640px, Smartphone 480px) nicht möglich. Also habe ich das Formular auf den schmaleren Formaten ebenfalls über die "Platzhalterfunktion" bzw. "Einfügen HTML Platzhalter" eingefügt. Da die Formulare für die Seiten zu breit waren, habe ich sie in WebDesigner schmaler gezogen. Bei der Seitenvorschau bzw. in den Explorern (Firefox&WindowsExplorer) waren die Formulare in den mobilen Versionen nicht zu sehen. Dann habe ich noch versucht, die entsprechenden Formulare auf Jotform.com gleich schaler zu gestalten. Im Ergebnis hat dies keinen Unterschied gemacht. Danke für hilfreiche Tips.

Die folgenden Bilder zeigen meine Ansicht.

480px Ansicht im WebDesigner

640px Ansicht im WebDesigner

480px Vorschau in Firefox

640px Vorschau in Firefox

Kommentare

hallou1 schrieb am 29.07.2014 um 11:40 Uhr

Die Sache mit der Objektbreite habe ich jetzt hinbekommen. Ich habe die Breite des Jotform.com Kontaktformulares auf 430px begrenzt. Allerdings bekomme ich die Kontaktformulare auf den 480px und 640px Webseiten nicht angezeigt. Hat jemand eine Idee, wie dieser Umstand zu beheben ist?

Danke für sachdienliche Hinweise

marboe schrieb am 29.07.2014 um 12:30 Uhr

Hallo hallou1,

beim Lesen dachte ich, dass du offensichtlich alle Größen mit ein und demselben Firefox testest. Stimmt das?
Falls ja, dann gib uns doch mal einen Link zu einer Tablet- oder Smartphoneseite. Dann können wir selbst mal gucken.

Dass in den Ebenen alles richtig ist, hast du ja bestimmt kontrolliert?  Gruß Martina

BilderMacher schrieb am 29.07.2014 um 12:39 Uhr

Ich meine, es wird ein Problem beim Einbinden des Formulars geben, was bei der variante genau auf den Code zurückgreift der in der Standard-Variante im Platzhalter eingegeben ist.

Leider musste ich das auch feststellen, ein Script betrifft auch immer die Variante. Ich habe keine Möglichkeit gefunden, in der Smartphon-Variante andere Werte oder gar einen neuen Platzhalter (nur für die Variante) zu generieren, der dann nicht in der Standardsite auftaucht.

Ohne eine nachträgliche Codebearbeitung der veröffentlichten Variante für das Formular wird es wohl nicht gehen, wenn das überhaut möglich ist.

Zuletzt geändert von BilderMacher am 29.07.2014, 12:39, insgesamt 1-mal geändert.

"Je mehr die Menschen wissen, desto weniger müssen sie glauben!"

+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
Ich kann vieles, darf aber nicht alles.
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

-------------

Hardware / Software:
::::::::::::::::::::::::::::::::::::++++:::::::::::::::::::::::::::::::::::::::::::::::::

Intel(R) Core(TM) i7-10510U CPU @ 1.80GHz (8 CPUs), ~2.3GHz
12288 MB RAM
DirectX 12
 

Intel(R) UHD Graphics (für Import, Verarbeitung, Export)

NVIDIA GeForce MX250 (wird nicht in Schnitt-SW verwendet)

  • Video deluxe 2016 Premium
  • Video deluxe 2025 Premium
  • Video Pro X 16
  • Photostory Deluxe 2025
  • Samplitude X7 Suite
  • ACID Pro 11
  • Music Maker 2025 Premium
  • MAGIX/XARA Graphic-/Web-Designer

-----------------------------------------------------------------------------------

Edition    Windows 10 Home
Version    22H2
Installiert am    ‎15.‎10.‎2020
Betriebssystembuild    19045.5371
Leistung    Windows Feature Experience Pack 1000.19060.1000.0

------------------------------------------------------------------------------------

Standardbrowser: Mozilla Firefox 134.0.0 (64-Bit)

👶-Boomer

hallou1 schrieb am 29.07.2014 um 13:31 Uhr

@marboe:

Den Link kann ich nocht nicht posten, weil die Page noch nicht online ist. Sie wird meine bestehende Seite ablösen. Getestet habe ich mit allen Größen. Also ich habe die Größen der Explorer verkleinert. Smartphone und Tablet kann ich dazu ja noch nicht nutzen ;o))

hallou1 schrieb am 29.07.2014 um 13:33 Uhr

@BilderMacher:

Hast Du eine Möglichkeit gefunden mit dem WebDesigner ein funktionierendes Kontaktformular zu bauen?

P.S. Meine Programmierkenntnisse sind rudimentär.

hallou1 schrieb am 29.07.2014 um 13:48 Uhr

nochmal @ Bildermacher:

Dein Tip hat mich zu etwas veranlasst. Ein Test hat ergeben, dass ich ein Formular von Jotform.com immer nur 1x verwenden kann. Wenn ich das auf verschiedenen Formaten (960px+640px+480px) verwenden möchte geht das nur auf einer der Seiten. Also habe ich einmal verschiedene Formulare eingefügt. Im Test hat es funktioniert. Wenn es auf der richtigen Page funktioniert, poste ich das hier. Dann ist eine Lösung gefunden. Danke für den Hinweis.

hallou1 schrieb am 29.07.2014 um 14:58 Uhr

So, durch den Hinweis von BilderMacher bin ich einer Lösung auf die Spur gekommen. Auf Jotform.com einfach für jede Seitengröße ein eigenes Formular speicher. Das geht leicht über die Funktion "Formular klonen".

BilderMacher schrieb am 29.07.2014 um 16:38 Uhr

Ich habe mit einem leeren Projekt begonnen und für die Variante einen Formularcode (HTML, selbst getippt) in den Body-Platzhalter kopiert.

Ist in der Standardansicht kein Platzhalter, wird das Formular für Smartphone angezeigt:

Sobald ich auf dem anderen Tab für die Standardseite auch ein Formular einfüge (angepasst, etwas breiter), erscheint in der Variante kein Formular, die Seite bleibt weiß:

Exportiere ich die beiden Seiten auf die Festplatte, habe ich nur eine Index ...

Ich finde aber den Ansatz nicht.

Auch in einer Vorlage mit Variante funktionieren zwei Formulare nur auf der breiten Seitenvariante.

Zuletzt geändert von BilderMacher am 29.07.2014, 16:41, insgesamt 2-mal geändert.

"Je mehr die Menschen wissen, desto weniger müssen sie glauben!"

+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
Ich kann vieles, darf aber nicht alles.
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

-------------

Hardware / Software:
::::::::::::::::::::::::::::::::::::++++:::::::::::::::::::::::::::::::::::::::::::::::::

Intel(R) Core(TM) i7-10510U CPU @ 1.80GHz (8 CPUs), ~2.3GHz
12288 MB RAM
DirectX 12
 

Intel(R) UHD Graphics (für Import, Verarbeitung, Export)

NVIDIA GeForce MX250 (wird nicht in Schnitt-SW verwendet)

  • Video deluxe 2016 Premium
  • Video deluxe 2025 Premium
  • Video Pro X 16
  • Photostory Deluxe 2025
  • Samplitude X7 Suite
  • ACID Pro 11
  • Music Maker 2025 Premium
  • MAGIX/XARA Graphic-/Web-Designer

-----------------------------------------------------------------------------------

Edition    Windows 10 Home
Version    22H2
Installiert am    ‎15.‎10.‎2020
Betriebssystembuild    19045.5371
Leistung    Windows Feature Experience Pack 1000.19060.1000.0

------------------------------------------------------------------------------------

Standardbrowser: Mozilla Firefox 134.0.0 (64-Bit)

👶-Boomer

marboe schrieb am 29.07.2014 um 17:20 Uhr

Hallo an alle, wenn das so ist (nicht getestet) ,dann bleibt nur per Link eine spezifische absolute URL aufzurufen. Wenn es dumm läuft, angelegt immer als eigenständiges Projekt. Ziemlich umständlich. Aber so ohne Grund werden die Programmierer das nicht gemacht haben. Denke ich so... :-)

hallou1 schrieb am 29.07.2014 um 17:48 Uhr

Hallo nochmals, meine Lösung ist recht simpel und funktioniert. Man muss das Formular auf Jotform.com nur einmal entwerfen. Anschließend einfach abspeichern und so oft man es braucht klonen. Meinen Klonen habe ich dann Namen für meine Pixelbreiten gegeben. Also Kontaktformular 960px, 640px und 480px. Anschließend kann man die Codesnippets mit Verlinkung auf den Jotform-Server nutzen oder die Dateien auf dem eigenen Server ablegen. Die Codesnippets zur Verlinkung haben jeweils unterschiedliche Nummern. Siehe hier:

-----------------------------------------------------------------------

480PX:
<script type="text/javascript" src="http://form.jotformeu.com/jsform/42053702107341"></script>


640px:
<script type="text/javascript" src="http://form.jotformeu.com/jsform/42093202986355"></script>

960px:
<script type="text/javascript" src="http://form.jotformeu.com/jsform/42093396530354"></script>

-----------------------------------------------------------------------

Nachdem mich BilderMacher auf diesen Umstand hingewiesen hat, hat es keine 20 Minuten gedauert, bis ich meine 3 Kontaktseiten funktionstüchtig fertig hatte.

ralf-best schrieb am 01.08.2014 um 23:57 Uhr

Hallo,

ich habe Deine Lösung mit Interesse gelesen, da ich ebenfalls das Problem mit dem Kontaktformular hatte. Allerdings bin ich mittlerweile zum Ergebnis gekommen, dass die Website als Smartphonevariante doch eine etwas andere Funktion bekommt und solche Features wie Scrollbalken und auch Kontaktformular, bzw. Popups eigentlich nicht sehr bedienerfreundlich auf diesen kleinen Bildschirmen sind.

Aus diesem Grund habe ich mich entschlossen das Kontaktformular einfach weg zu lassen und die üblichen Kontaktdaten genommen. Ist zumindest eine Überlegung wert.

Gruß

Ralf

Eugen200 schrieb am 28.08.2015 um 00:21 Uhr

Hallo!

Ich habe das gleiche Problem, aber keine Lösung dazu. Ich habe für beide Varianten der Webseite (Standart und Mobil) jeweils ein Jot-Form-Kontaktformular erstellt. (Kopiert und etwas angepasst). Für die Standart-Seite ist das Formular etwas breiter und für die mobile Seite etwas schmaler. Sonst ist alles gleicht. Die mobile Variante funktioniert einwandfrei, die standarte Webseite dagegen nicht. Wie schon vorher beschrieben bleibt der Formular-Text nur kurz sichtbar und dann verschwindet. Wenn ich das Browser-Fenster verkleinere, bis die mobile Varinate kommt und dann vergrößere es wieder, kommt der Text zurück. Lade ich die Seite erneut, kommt der gleiche Fehler wieder. Kann mir jemand helfen???