Formatting all screwed up on one page

The problem page is here: https://safersocietypress.org/cart/?ec_page=checkout_payment

Yes, dynamic content generated by a shopping cart plugin - WP Easycart. All of the pages up to this one look great. But once you get here, the footer suddenly takes a spot next to the header - it’s even in the code. Why this happens is what I’m perplexed by. The WP Easycart support folks tell us it’s a theme issue. Can you tell what’s going on?

Hi Stephen,

Thank you for writing in, but sorry, I am not entirely certain of the issue, this is how your cart page looks on my end.

This looks fine to me, please clarify.

If this is really a 3rd party plugin issue, please be reminded that we cannot provide support for third-party plugins or scripts as our support policy in the sidebar states due to the fact that there is simply no way to account for all of the potential variables at play when using another developer’s plugin or script. Because of this, any questions you have regarding setup, integration, or troubleshooting any piece of functionality that is not native to theme will need to be directed to the original developer.

Thank you for your understanding.

You’re not on the page where the issue appears. It’s the payments page. Add some items to the cart then follow the link I sent earlier.

I totally understand you’re not supporting a plugin but they’re telling us it’s a theme issue so …

Hello Stephen,

We cannot check your Checkout page because we need to be logged in. Please provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password

To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Thanks.

Well, it’s a checkout page so you don’t need to be logged in - you just need to put products in the cart. But I went ahead and created an admin user for you. The info is in the secure notes area.

Hi Stephen,

If it’s a theme then it should happen on the very fist stage of the cart. You’ll notice that it’s just the same page, and it only changes the content based on the output of [ec_cart]. And the one that changes the content is you WP Easycart, shouldn’t the culprit is the one that introducing change while the other things remain the same and unchanged?

I went ahead and did some investigation, I pasted the entire code here https://validator.w3.org/ as direct input and validated it. The cause of that issue is extra </div> before closing </form>. It’s not from the theme but from the plugin itself.

It happens within the <form> block where payment is and theme only provide the templates as a layout, not as content.

Thanks!

Thank you for that insight. We’ll pursue it with the plugin author.

You’re welcome, let us know how it goes.

Cheers!

Hello,
Well, the plugin author (WP EasyCart) said it’s not their issue. Here is their response:

As mentioned before, there is something wrong though in this theme as you can easily switch to a twenty nineteen theme for example as see it goes through. I also added one line of CSS to fix some of the issue and it seems to work and have an effect on their style and theme.

settings -> design -> custom CSS is where I added this one line of CSS.

.x-root { display: block; }

Hi Stephen,

What I provided is the result from W3.org tool, and it’s clearly displaying the cause which coming within the code generated by the plugin. If they choose to ignore it and choose CSS fix then it should be okay too. Plus, this is not happening on other plugins, just on their plugins. It works on Twenty ninteteen theme since its container already have display:block styling. With display block, it only masked the real layout issue, since display block styling will make sure the layout is in stacked position, broken or not.

But thanks for sharing for the fix.

Thanks!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.