Footer position - PRO

[Jeff10]

Hi
I’m trying build a footer however the position of the footer is the top right in the footer builder.

Ive added this JS to global settings to make the mobile menu close after user clicks menu item.

jQuery(function($) {
  $('.x-menu a').on('touchend click', function(){
    $('.x-off-canvas-close').click();
  });
});

I think and don’t know if the JS has interfered with the footer position?

I’m trying to position the footer at the bottom where a traditional footer

Your assistance is appreciated.
Regards
Jeff

[christopher]

Hi there,

I don’t think that the JS code was the problem cause. I am not sure but I think there is a caching problem that is causing the misalignment of the footer and showing it instead of the sidebar.

I checked your website and found out you are using the WP Rocket plugin. I suggest that you purge the cache and deactivate that plugin. And if you are using the CloudFlare you need to follow this:

https://xthemetips.com/using-cloudflare-rocket-loader-with-x-pro-and-x5/928/

Finally, I suggest that you follow the general troubleshooting guides 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. If you’re using a CDN, please clear the CDN’s cache and disable optimization services.
3. 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.
4. Remove custom CSS and Javascript from the options or Child Theme and test the case.

Thank you.

[Jeff10]

Hi Chris

Thank you for your suggestions.

I have worked through the suggestions and the behaviour hasn’t changed the footer is still in the top right corner.
I found some posts that suggested

1. Add this CSS.

   .x-colophon.bottom { width:100%;}
   .x-root { flex-wrap: wrap;}
   The result was footer is moved to the bottom however the bar element is not able to be configured.

2. Other posts that suggested it could be missing HTML tags - so I have gone through all the html and corrected a few tags however this has not made a difference.

I have cleared the caches and left WP rocket and other 3rd party plugins deactivated for now…

When the footer is inspected it highlights the side bar

I cant seem to move forward beyond this issue - your assistance would be appreciated.

Regards
Jeff

[christian]

Hey Jeff,

The issue could either come from your header or your content or both. First, I created a test page and the footer displayed at the bottom. But, the header didn’t load.

Next, I created a test header from the Default header template and it everything displayed fine.

Please duplicate your header and content and remove elements one by one to see what element is causing the issue. Please also try creating a different header and content.

Thanks.

[Jeff10]

Hi Christian

Found the issue.

Thank you for suggesting your approach and showing that the test pages work. I practically deleted the whole website in a test environment, however the approach was effective.

The issue was I left " off in a div tag.

Thanks again for your assistance.

Regards
Jeff

[Joao]

Glad to hear it!

Cheers!