Docs

[s_gogos]

Hello guys!

I have the following problem:

I’ve built my site based on the “http://demo.theme.co/renew-1”.
My site’s home page appears fine (boxed as it should) but when I go to my blog section (where the posts go / my home is a page) and instead I have chosen the boxed layout (in the “customizing blog” section I chose style: standard, layout: use global content layout) the footer suddenly appears to be full-width.

I tried, but I cannot restore the settings to the original ones.

How can I restore my footer area to boxed layout (on all sections of my site / blog) ?

Could you please help?

Thank you in advance,
Stergios (staging1.worldvespa.net)

[Rue Nel]

Hello There,

Thanks for writing in! I have inspected any possible cause of this issue and I found out that the Jetpack’s Image widget is causing the issue. The rendering of this widget is missing a closing div tag and this is why the layout was a mess. You may use the text widget instead so that the layout issue will be corrected.

I can give you a custom JS to moved back the footer back to its original position. Please add the following JS code in the customizer, Appearance > Customize > Custom > Javascript

(function($){
  $(document).ready(function(){
    $('.x-content-sidebar-active .x-colophon.bottom').appendTo( $('.site') );
  });
})(jQuery);

Please take note that even if this JS fixed the location of your footer inside the boxed layout. This will NOT fixed the issue with the Jetapck’s Image widget issue. The bug in the widget might still pose some issues or other issues will still occur or will cause any issues in the future.

Hope this explains it.

[s_gogos]

Thanks for the reply!
I have deactivated and deleted the jetpack plugin but the issue is still here!
What can i do to resolve the issue once and forever?
Thank you for your time.

[Rad]

Hi there,

It’s working on my view, which page has this issue?

Thanks!

[s_gogos]

Hello,

It’s working properly only on my homepage.
On my blog, and all the other pages i have the issue.

[Christopher]

Hi there,

Please activate parent theme and check your site, this could be caused by your child theme’s modified files.

If it doesn’t helps, you could try testing for a plugin conflict. You can do this by deactivating all third party plugins, and seeing 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.

Hope it helps.

[s_gogos]

01. I just activated the parent theme but this didn’t fix the problem.
02. Also I’ve already checked for conflicts (I deactivated ALL my plugins) but they don’t seem to create the issue.

And to give you some more details:

My site has two (2) languages (English & Greek).
The problem appears in all my posts in English and the “Blog” page in English
but NOT in my English home page, my Greek home page and NOT in my posts and my “Blog” page in Greek (http://staging1.worldvespa.net/%CE%BC%CF%80%CE%BB%CE%BF%CE%B3%CE%BA/).

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> Global CSS :

footer.x-colophon.bottom {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

Hope that helps.

[s_gogos]

Thanks!

[Christopher]

You’re welcome.

[s_gogos]

Thank you, the solution you gave me worked.

But then I added a widget in my footer area and I get the same problem as before but now for the widget.

It doesn’t appear boxed but full-width.
Can you tell me a solution for this?

Thanks in advance,
Stergios

[Joao]

Hi There,

Please add the following code to Appereance | Customizer | Custom | CSS

.x-colophon.top {
    padding: 0px;
}
div#x-section-6 {
    background-color: transparent !important;
}

Hope it helps

Joao

[s_gogos]

I’m afraid it didn’t help…
Nothing changed.
I’ve attached a screenshot.

[Nabeel A]

Hi again,

Please replace the previous code with this:

.x-colophon.top {
    width: 86% !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
}

Let us know how this goes!

[s_gogos]

Hello guys,

I just noticed that my problem is only partially fixed.
What I mean is:

The footer is now boxed and appears OK only on my homepage and my pages (http://worldvespa.net).
In all my posts and my blog page (http://worldvespa.net/the-blog) it appears fine only if the screen is wide enough.
If I squeeze it down (for example in tablets or smartphones) I have the same problem.
The footer doesn’t appear boxed. It appears bigger.
The problem in the footer widget is fixed but the footer itself has problem.

Can you help?
I’ve attached a screenshot.

This is the code I’m using in Customizer / Edit Global CSS:

footer.x-colophon.bottom {
width: 100%;
max-width: 1000px;
margin: 0 auto;
}
.x-colophon.top {
width: 86% !important;
max-width: 1000px !important;
margin: 0 auto !important;
}

[Author]

Posts