Embedded form not appearing where shortcode placed

The form is switching back and forth between where I have placed it, and at the bottom of everything when I reload the page, and is very inconsistent.

Hi @leecollings,

Thanks for taking the time to reach out.

We’ve reached out to the other user to see if they have any further details to share, which might help in your case as well.

We shall wait to hear back and pending on the information, will treat this as a separate case if need be.

Appreciate the patience and we’ll be in touch again soon!

Hi again @leecollings,

In the case of the other user, they found that a CloudFlare plugin was the cause.

Could we ask if you might have a similar plugin or any other plugins that you could temporarily disable and let us know if you still experience the issues?

Can you please share which form you have used and on which page? Does the issue also occur when in incognito mode?

Thanks and hear from you soon!

Hi there,

Thanks for your reply.

The site currently is locally hosted and not using CloudFlare (neither the plugin or the DNS service itself).

There are no caching related plugins involved, however I am still experiencing the issue.

I could share the pages, however as I stated these are locally hosted so you would not have access to them.

However, like I previously thought, are you using ob_start() in your plugin to use output buffering? It feels like this is the issue here.

When I view the source, I can see the line ‘<!– Instagram Feed JS –>’ added to the bottom of the page, and then it seems all of your markup is placed underneath this (including the form HTML).

And additionally, aside from the form not showing in the correct place, if I click the submit button without filling in the email address (which is set as required), I get a fatal PHP error:

Warning: count(): Parameter must be an array or an object that implements Countable in …\wp-content\plugins\forms-for-campaign-monitor\forms\core\Ajax.php on line 132

The page itself outputs Code: 108. (Note this seems to happen when the form is displayed incorrectly… On the very few occasions where the form is in the correct place, the AJAX seems to work okay).

This really needs to get fixed… I even disabled all of my third party assets (Bootstrap and FontAwesome) and moved jQuery to load at the header, and still the issue is here.

Judging by the low reviews on the plugin, I strongly consider this to be a fault with the plugin itself, and desperately need this looking into today ASAP.

Hi @leecollings ,

Thank you for your patience with this. We do not use ob_start, however, looking at https://codex.www.ads-software.com/Shortcode_API in the Output section:

The return value of a shortcode handler function is inserted into the post content output in place of the shortcode macro. Remember to use return and not echo – anything that is echoed will be output to the browser, but it won’t appear in the correct place on the page.

We have followed this process, in which our shortcode uses “return” rather than “echo.” ob_start is another option and is not mandatory.

We are unable to look at how you used our code, but a few things come to mind:
1. Are you using our shortcode nested within a different shortcode by any chance?
2. Given the rendering of the shortcode below the Instagram feed, can that Instagram code be removed temporarily to verify that it wasn’t the one that caused the issue?

The 108 error you’re seeing when the form isn’t rendering properly may be a side effect of the main issue (i.e., some scripts may not load properly due to interference from another plugin, impacting both rendering and functionality).

Hi,

Thanks for your response but you probably need to use output buffering in your plugin.. from personal experience, that is what this sounds like.

I am not nesting the shortcode within another shortcode, I’m using echo do_shortcode(); to output your shortcode in my template files.

There is no instagram code, it’s a comment for me to know where to place it in future.

Output buffering may help the plugin place the code where it is intended to be placed. You should read up on this, and always include it in your output procedures: https://wordpress.stackexchange.com/questions/89234/why-is-output-buffering-used-here

You should also know that because of this issue (like many other people), I’ve chosen to not use the WordPress plugin because I don’t see it as fit for purpose until this issue is fixed.

Hi @leecollings ,

Thanks for following up! In this situation, output buffering within our plugin would not help you. If we did output buffering, we would close it as the function exits. This is essentially the same with the current implementation.

We believe the issue is due to the way you echo the shortcode. As your article suggested, have you tried to do output buffering for the code that calls the shortcode?

Also, if you have access to the development environment within WordPress, then you should be able to access our plugin code (it’s in the plugin folder within WordPress). You could try modifying the plugin code if you believe that ob_start within the plugin would resolve your issue. Feel free to give that a try and let us know how that goes.

Hello,

Is there a concrete solution to this issue? My form is displaying at the bottom of the website footer instead of in the row that the shortcode has been placed in. The issue only happens in Firefox

Hi @treasureseason ,

The issue you’re encountering is likely separate from the one brought up in this thread. I’ve gone ahead and replied to your thread here so we can troubleshoot this further with you.

Thanks!