WebSite X5Help Center

 
X5 Croatia
X5 Croatia
User

Contact form object / responsive issue  en

Autor: X5 Croatia
Besucht 336, Followers 1, Geteilt 0  

According to my knowledge, the Contact script has an error or a problem when creating two tables in a row (display in the same row as the previous field). Unfortunately, in the responsive view, that script is very compressed and there is no possibility to move to the second row automatically at lower resolutions... This creates a problem at lower resolutions, but I guess you already know that... Attached picture.

Gepostet am
7 ANTWORTEN
Daniel W.
Daniel W.
User
Nutzer des Monats DENutzer des Monats EN

As long as Incomedia doesn't offer a solution, you could simply create a copy of the page with the contact form under "3 Sitemap".

The copy could perhaps be marked as "Hidden" so that it is not duplicated in the menu.

Then place the input fields of the contact form one below the other on the copy of the page with the contact form.

Set a link to the copy in the original or an automatic redirection via code (???) if the screen becomes too narrow.

Mehr lesen
Gepostet am von Daniel W.
Incomedia
Eric C.
Incomedia

Hello,
what settings are you using in the Contact Form object, and is there any custom code applied?
Lower breakpoints usually show one field per row even when configuring the form with some fields to be displayed on the same row:

Mehr lesen
Gepostet am von Eric C.
Daniel W.
Daniel W.
User
Nutzer des Monats DENutzer des Monats EN

Demo shop

-----

Mehr lesen
Gepostet am von Daniel W.
Incomedia
Eric C.
Incomedia

Hello Daniel,
in my example the lowest breakpoint was set at the default 480 px, in your website it seems to be 320, it may be the case for X5 Croatia as well.
I will report this behavior so that we can consider managing the trigger to show only one field differently.

Mehr lesen
Gepostet am von Eric C.
Daniel W.
Daniel W.
User
Nutzer des Monats DENutzer des Monats EN

Here is my procedure to place 2 different "contact form" objects on a page, which are displayed alternately depending on the screen width:

  1. I copied the “Contact Form” object on the “Contact” page of my demo shop and pasted the copy into the grid below.
  2. Then I placed the 2 input fields one below the other in the copied object.
  3. I then marked the objects in the grid and clicked on “Code” at the top to insert the corresponding CSS code into the empty second line.

Demo shop contact page >> https://findelinks.de/123shop-hosteurope/kontakt.html

----- CSS code -----

@media (max-width: 480px) { display: none; }

@media (min-width: 480px) { display: none; }

----- Screenshots -----

-----

-----

Mehr lesen
Gepostet am von Daniel W.
X5 Croatia
X5 Croatia
User
Autor

I hope that Incomedia will find a solution... Daniel W. i think that your code is ok...

Mehr lesen
Gepostet am von X5 Croatia