pop up form not mobile friendly

Hi @fod85,

Please note that, in your case, you need to replace “mp_form_popup6” with your form’s ID, otherwise, the CSS code won’t be applied properly.

By checking your test website, it seems your ID is “mp_form_popup2”.

Please replace it in the code and let us know if it works!

Also, please notice you’re using an image in your pop-up form, and images are automatically removed from mobile view, leaving your form with one of the columns empty. I’d suggest adding the image to the top of your form instead of using a two-column layout, so it will still display fine on mobile.

Hello
Thanks for the reply. The shortcode does not work, I had already made the change correctly and entered my form number befor writing here.

That would mean that the ready-to-use-templates from Mailpoet are not responsive? But that’s not what I had in mind! I specifically took a ready-made one because I thought that was set up correctly and would display well on mobile.
Nevertheless, the whole form is too low down and half of the text disappeared. I should be able to hide the image for mobile and adjust the font + format automatically.
How can I do that?

Hi @fod85,

That would mean that the ready-to-use-templates from Mailpoet are not responsive?

No, that’s not correct. I just tested our premade templates on mobile and they are all responsive, stacking the columns on top of another – and if one of them has an image, it’s just removed completely.

I was looking further at your form and I saw there’s a class missing for mobile, which is ‘mailpoet_form_columns mailpoet_paragraph mailpoet_stack_on_mobile last’. Did you by any chance removed this class from the form?

I’d suggest recreating a form again, replacing the text and image only and checking if you’re still facing the issues you have on mobile. Looking forward to hearing from you!

Hi @bruberries

where can I insert this class? No, I didn’t delete it, but maybe I can put it where it belongs before recreating a new form?

Hey @fod85,

Ideally, you should try to recreate the form to hopefully make work the expected way, as adding the code somewhere would be more of a workaround. Can you please give it a try?

Hi @guicmazeredo

Ok I made a new form. Still stick at the bottom, still not readable. And now the picture is much smaller. Pleas have a look:

https://www.blank-eg.de/wp-content/uploads/2023/03/Bildschirmfoto-2023-03-17-um-18.13.47.png

[ Please do not bump. ]

• This reply was modified 1 year, 11 months ago by Jan Dembowski.