content width, footer space, feature image

Hello,

I’m afraid that the WordPress forum guidelines prevent us from talking about contacting you directly, sorry!

With regards to your requests, it is going to be impossible for us to diagnose your issue with full width content without being able to inspect your website.

We have an option in “Customizer – Header Options – Featured Image Header” which injects the featured image into the header background on pages which probably isn’t what you want because the sticky nav will probably not be placed over the top of the header. This is more like something you would see in Twenty Seventeen theme. Having said that, using the Cover Template, you could make the cover overlay transparent which should allow. the sticky nav to show the featured image below.

There are several components to the footer image but to remove the padding / margin on them here is some CSS …

Footer nav margin:

.footer-nav-widgets-wrapper {
margin-top: 0;
}

Footer widgets padding:

.footer-widgets-outer-wrapper {
padding: 0;
}

Site footer padding:

#site-footer {
padding: 0;
}

Hope that helps?

Oliver

Thanks!, the CSS for #site-footer worked to reduce padding; I need to play w adjustment sizes.

I disabled both Options and Options premium plugins, and the content width resolved to the standard 20/20 theme narrow default (which is what we want) and the Featured Image reappeared on the pages.

To test, I then activated basic plugn Options (not premium) and the page content width went bonkers– some pages narrow per default selection and some pages’ content jumped to full width (which we don’t want). And the pages Featured Image disapeared again unfortunately. Looks like there’s a bug in there somewhere? We do like the visual options editing very much!

Yes the Cover Template’s Featured Image is working fine w Nav Menu showing thru the Transparent Heading. I changed Nav options to non-sticky menu for desktop, mobile. Do not have a site background image. https://dev.castlerock.coloradodar.org/ Thanks!

Please can you confirm that the issues you are experiencing with the content width and featured images happen when you use the twentytwenty theme rather than twentytwenty-child.

Please also provide exact details of which pages and which elements (blocks) in the pages are effected by the content width issue.

Please also confirm if any of these options have been enabled …

1) Customizer – Content Options – Hide all Featured Images
2) Customizer – Header Options – Featured Image Header
3) Customizer – Header Options – Hide Post / Page Headers

Thank you,

Oliver

Thx for prompt reply. Yes, I can confirm they do not happen in TwentyTwenty theme (and they do happen in the TwentyTwenty child we’re using).

The content width issue better! & resolved. Found that blocks must be inside a Group block. Then the text blocks & other blocks inside the group do follow the narrow width default in the child. Only pages where width is still wide is Members, which is password protected and JoinUs page, which uses a plugin for forms templates.

Re Feature Image issue, and which Customizer Options are enabled in ThentyTwenty-child:
1) not enabled,
2: yes enabled (also yes transparent header is enabled),
3) not enabled

We’re reqd to use a child theme… Is there a compatible plugin to use to create child theme that’s aligned w theme and Options plugin?

Thank you, SJ

Your featured images aren’t showing because you have “Customizer – Header Options – Featured Image Header” enabled and you have hidden the header title (“Customizer – Header Options – Hide All Header Titles”) and made the header font tiny.

If you move the featured image into the background of the headers they will not show if you hide the header titles and they will be very small if you have a small header title font.

You have also put this in your “Customizer – Additional CSS” which is hiding the headers …

    h1.entry-title {
        display: none;
    }

With regards to the use of a child theme. Child themes are supported and compatible until they are modified. I know this sounds a bit silly because the whole purpose of having a child theme is to be able to modify the theme whilst still being able to update the parent theme … BUT … we cannot possibly be expected to be able to support an unknown amount of changes to the parent theme through a child theme.

Furthermore, we built this plugin specifically so that changes could be made to the theme without the requirement for a parent theme. It does this by applying changes to the theme through filters, hooks and JavaScript.

Perhaps instead of using a child theme you should give us a list of things you are trying to achieve and we might be able to support these requests though additional options and features? ??

Oliver

This helps immensely, thank you! So header title & feature image are necessarily connected. I’ve updated those settings and Featured Image now appears on pages below the Nav Menu (& so does title I used to hide). resolved

Is there a setting to have the Featured Image go on up to top of page? ie so that the featured image is the background to the Logo & Nav Menu area??

(I have the Nav Menu transparent background choice enabled– Nav Menu shows thru well on Cover Template and if site is set w a site background image [and not featured images].)

Thank you for explaining the child theme & how Options plugin works w that- appreciate.

Yes, they are connected when you use the featured image as a background to the header. So you’ll want to turn this feature off.

What you have described about what you require with the featured image being at the top of the page below the nav bar may be possible by hiding the headers and making the nav bar sticky.

You will then need to remove some margin above the featured image and you force the featured image to be full width as I would imagine that’s what you would want. Try this CSS in “Customizer – Additional CSS” once you have hidden headers and made the nav bar sticky …

body.has-post-thumbnail {
margin-top: 0 !important;
}
.featured-media img {
width: 100%;
}
.singular .featured-media-inner {
max-width: 100%;
}

The margin above the featured image may be a problem as this is dealt with through JavaScript so we may need to update the plugin in order for this to work for you.

Let us know.

Oliver

It worked! wooohoo, thank you

Customization: I disabled the headers/ titles & made Nav Menu sticky again (must be Menu Bar, other 2 choices don’t work). Pages: the Featured Image now appears on each Page as background to / under the Nav Menu! No margin issues at all; the featured image continues smoothly with no gaps to very top of viewable page– looks great. (I do have this CSS in:)
.site-header {
padding-bottom: 0.1em;
}

Have another ?; will start new thread. Many thanks!

Great news, we will look to create an option to cover these modifications.

Oliver

Update … we have pushed a new version of the plugin today which adds options to change the various areas of the footer as mentioned at the beginning of this thread.

Oliver

outstanding! This footer padding/margin adjustability makes a massive, significant visual difference to the site. *many thanks*

Update … we have pushed a new version of the plugin today which adds options to move the featured images to the top of the page and make them full width.

Oliver

great news. Oddly enough, the featured image did not move to the top of page (and be background to the Nav Menu).

After updating plugin, under Content Options, I enabled both new options: “Featured Image to top” and “Full Width Featured Image.” (and removed the additional CSS script which had worked beautifully). No other changes to settings

Yes, sorry, I should have made this clear, we need to update the other plugin to be compatible with this option. In the meantime you will still need to use the following CSS for the featured image to appear underneath the sticky nav …

body.has-post-thumbnail {
margin-top: 0 !important;
}

Will let you know as soon as this has been done.

Apologies.

Oliver

np! Many thanks for responsiveness and creating excellent options for the Twenty Twenty theme.