Added a bar to my Footer, messed up my Header

Support
#1

Hi,

I added a contact form to my footer and now it’s affected my header on my home page

www.diveintoambon.com

The page loads fine, and you can see the transparent header that shrinks and becomes solid as you scroll down. But when you scroll up again to the top the header remains solid. When you scroll down again the header does not shrink.

Other pages are fine.

I have another website using the same theme, I added the contact form on the footer too, and it’s doing the same thing.

www.diveintolembeh.com

Any idea?

#2

Hello There,

Please follow up the steps below:

  1. Ensure everything is up to date according to our version compatibility list here. Please follow the best practices when updating your theme and plugins. Click here for more information.
  2. Go to X > Settings and click on the Clear Style Cache button.
  3. If you’re using a CDN(ex: CloudFlare), please clear the CDN’s cache and disable optimization services. For the CloudFlare you also need to follow the steps below besides the developer mode: https://xthemetips.com/using-cloudflare-rocket-loader-with-x-pro-and-x5/928/1
  4. Test for a plugin conflict. You can do this by deactivating all third-party plugins, and see if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.
  5. Remove custom CSS and Javascript from the options or Child Theme and test the case.
  6. Switch to the parent theme to check if the issues persist.

If you still have problems kindly get back to us with the result of the steps above and URL/User/Pass of your WordPress dashboard using the Secure Note functionality of the post to follow up the case.

Thank you.

#3

@thai

Everything is up to date, everything was working normally until I added the footer bar. That’s all I did. i didn’t change anything in the Header. Login details included in Secure note

#4

And if I delete the Footer Bar I added, then the Header works correctly again

you will find a copy of the default footer that has the contact form bar removed. I will leave it unassigned, but if you assign it to the Home Page, you will see the Header works correctly.

#5

Hi @liquidguru,

In that case, we’ll have to check it first. But the login credentials are wrong, please provide the correct one :slight_smile:

Thanks!

#6

Sorry about that. Secure Note updated

#7

Hi There,

Upon checking your website, I could see that it has 34 active plugins.

I would recommend that you create a staging site. This is very useful because you can test drive any theme updates in the staging area, do the customizations and troubleshooting without disrupting your live site. Once everything is perfect, you can easily and flawlessly proceed the update in the live site. To know how to create a staging area, please check out these articles:

In your staging area, we can disable all the 3rd party plugins and we can test your website.

Thank you.

#8

@thai

Thanks for the reply, however I really don’t think this is the problem, my plugins…

However, I have created a Staging Site, disabled all the plugins…and guess what? Still the same problem. Still just on the Home Page, still doing the same thing.

Staging login info attached.

#9

Hello There,

There is a known issue with the header that when scrolling, the fixed bar class will not be removed. To temporarily resoleve this, I added this custom JS code:

jQuery(function($) {
	$(window).scroll(function(){ 
		if($(window).scrollTop() >100) {
			$('.x-bar-is-sticky').addClass("x-bar-fixed");
		}else {
			$('.x-bar-is-sticky').removeClass("x-bar-fixed");
		}
	});
});

Please check your staging site now.

#10

@RueNel

Thanks for the reply.

Now the bar does not shrink and the secondary header bar does not appear when scrolling down (contains Rates, Booking Form and Contact)

Why did adding the extra bar to the footer cause this problem in the first place? Any idea. And only on the Home Page? My menu on the other pages works fine.

#11

Hey @liquidguru,

To clarify, the issue is coming from your FormCraft plugin and not the built-in elements of Pro. Regretfully, we could not troubleshoot third party plugin conflicts moreover that FormCraft is a paid plugin. You will need to contact FormCraft plugin support for this.

Also, please remove the code @RueNel gave as it introduces a new issue. The bug @RueNel referred is not applicable for your case and it has been fixed already in a past version of Pro.

Thank you for understanding.

#13

Thanks @christian_y

Ok. But I find it very strange the the same code for the same form in the same footer works perfectly on every page except the Home Page…The only thing that is different on the Home Page is the Header, therefore would seem to be a problem on your side of things…

I’m not going to contact Formcraft, I have just removed the extra bar from the home Page footer.

#14

I created a test page in your staging site https://staging5.diveintoambon.com/x-support-test/ and yes, I the issue does not happen when your “normal” bar is used.

If you can use that bar for your home page, that would be great since it’s already working.

If the “sHeader” is used, the issue happens only if the FormCraft shortcode is present in the footer.

That is why I said it’s a conflict. Maybe there’s a difference in your sHeader and sNormal headers that I haven’t discovered. The thing is though, it involves the FormCraft plugin and we are not familiar with it so it’s best that you contact the plugin’s support.

Thanks.

#15

Thanks @christian_y

I appreciate your help. Unfortunately the form you made is nothing like the one I wish to use.

I can easily live with not having the contact form on the Home Page, so I’m happy with how things are now.

Cheers.

#16

Yes, I tested other forms to see if it’s just an issue with one form but it looks like it’s really coming from something in FormCraft that is causing the issue.

Thanks.

#17

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