[Forminator Pro] Forms Lose Formatting In Popup

Hello, I am not sure if there is a way to work around this, but it sure would be nice.

I have created a rather extensive service request form for a customer and preferable it would be loaded using "Popup Maker" plugin on the site. This avoids the need to load another page and gets the clients to where they need to be faster.

However, when the popup loads, the fields that should be setting next to each other all snuggle in to one column. I have tried setting static width using p width= but this does not seem to help no matter how wide I try to arrange it. I have also tried P width="100%" which also does not seem to correct the problem.

Is there a way to access the form code generated to insert into the popup apposed to using the shortcode? I feel like this may be the direction this needs to go.

Please advise,

Nick

  • Katya Tsihotska
    • Support & QA

    Hi Nick Simpson

    Hope you're having a great day!

    I'm afraid that there is no such option to get the generated code. But I can help you with some CSS that could fix the issue. In order to this, I need to have a closer look at the popup with the issue. So could you please grant us temporary support access to your website so we can have a better look at your setup and settings? You can grant us access via WPMUDEV Dashboard plugin, there's no need to share credentials. Here's our detailed documentation page about it:
    https://premium.wpmudev.org/docs/getting-started/getting-support/#chapter-5

    Don't forget to let us know once you'll do this.

    And could you also describe how can I see find and see the popup on front-end of your site?

    Kind regards,
    Katya

  • Ash
    • WordPress Hacker

    Hello Nick Simpson

    It seems for some reason, the form inside the popup is detected in the smaller screen. I have workaround for you, please try the following code:

    add_action( 'wp_head', function() {
    	?>
    	<script type="text/javascript">
    		jQuery(function($){
    			setInterval(function(){
    				if( $('#forminator-module-44017').hasClass( 'forminator-size--small' ) )
    				{
    					$('#forminator-module-44017').removeClass( 'forminator-size--small' );
    				}
    			}, 500);
    		});
    	</script>
    	<?php
    } );

    You can use this code in your child theme's functions.php if the theme is not changed. Otherwise mu-plugin is the best option. To create a mu-plugin, go to wp-content/mu-plugins folder. If there is no mu-plugins folder then, create one. Now, inside the mu-plugins folder create file with name anything.php (make sure file extension is .php). Now start with a <?php tag and then put the above code.

    Hope it helps! Please feel free to ask more questions if you have any.

    Have a nice day!

    Cheers,
    Ash

  • Nick Simpson
    • The Incredible Code Injector

    Well, all is well on the front end. However, when I try to access the admin side of WP, I am getting this error.

    Warning: Cannot modify header information - headers already sent by (output started at /home/xotwix365/public_html/wp-content/mu-plugins/forminator.php:1) in /home/xotwix365/public_html/wp-includes/pluggable.php on line 1216

    forminator.php is the file I created with the code provided.

    Any ideas on this? Were there any specific file permissions that should have been set maybe?

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.