Page layout changes after form submission

Support
#1

I’m using WP Forms Lite to accept form submissions. When a form has been submitted, the page layout changes to a columned version. I don’t know why (perhaps a CSS error?) and I would please like to know how to fix it.

https://nomadicamedia.com/instagram-for-influencers/

#2

Hello There,

Thanks for writing in! I have inspected the page and it seems that the issue is because of the LayerSlider. Please temporarily removed the slider and test the page and the form again.

Please let us know how it goes.

#3

I’ve removed the Layerslider from the page but I’m having the same issue as before.

#4

Hello There,

I have inspected it again and it seems that the page is redirected using a default page template. To prevent it from happening, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.page-id-544 .x-container.max.width.offset {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
}

.page-id-544 .entry-wrap {
    padding: 0;
}

We would loved to know if this has work for you. Thank you.

#5

That’s a step in the right direction! The columned response has stopped but the “Instagram Growth Coaching” header is still displaced after form submission. Is there any easy CSS fix for this?

#6

Hi,

Please add this code as well.

.page-id-544  .entry-header .entry-title { display:none; }

Thanks

#7

That did not seem to fix the problem. I actually described the wrong issue so it’s my fault. What’s actually happening is that, after I submit a form, the page name “Become an Instagram Influencer” is appearing above the top banner image.

Also, I am experiencing the same column after submission issues on these pages as well:



https://nomadicamedia.com/instagram-for-businesses/

Essentially, all pages with WP forms lite integrated are affected by the issue.

Thanks for your help!

#8

Hi,

Kindly change the css code I provided with this.

.page-template-template-blank-4 .x-container.max.width.offset {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
}

.page-template-template-blank-4 .entry-wrap {
    padding: 0;
}
.page-id-544 .entry-header .entry-title {
    display: none;
}

Make sure there is a space between .page-id-544 and .entry-header and .entry-title

Hope that helps.

#9

Almost there! The column effect has stopped but the page name still appears above the banner image after form submission on the photography, business instagram and contact pages.

#10

Hi,

Please change this

.page-id-544 .entry-header .entry-title {
    display: none;
}

to this

.page-template-template-blank-4  .entry-header .entry-title {
    display: none;
}

Thanks

#11

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