I’m using Twenty Twenty-Two to build a full-width site. I’ve set up the header as shown here:

I want the header, row, and cover to span full width, but I don’t see the setting for full width on any of these elements. Here are the Group settings:

Here are the Row settings:

Here are the Cover settings:

I’m using this code in my Additional CSS (from @calc20):

.wp-block-group.is-full-width, .wp-block-cover {
margin-left: 0 !important;
margin-right: 0 !important;
width: 100vw !important;
max-width: 100% !important;
}
/* center footer nav */
.footer-nav {
	padding-left: -500 px
}

What am I missing? How do I set these elements to full width?

Thank you in advance for your help.

I’m trying to build a home page template with a full width header, but I can’t make the header and the cover image span the full width.

How do I go about it? My group contains a cover. In the group settings, Inner blocks use content width is toggled to on.

Here’s my site header in Preview mode.

What am I missing? Alternately, is there a prebuilt template that will meet my needs?

Thanks.

This is simply a one-page author landing page. Very simple. Added a flag background and it looks just like he wanted… on the computer. All links work. But when it comes up on a phone, No background image, just a bright red solid background. Not even the black I wanted. We thought it might have been the size of the of the background image so we reduced it but no change in behavior. Any suggestions. Like how to change the red back to black? and why the background image does not show on the phone? Thanks

Hi WP experts,

I’m trying to build a header with a site logo, navigation, and background image, using Twenty-Two.

I don’t understand the instructions in Upload a Header Image. Specifically, I can’t figure out how to transform a group into a cover, as documented in step 5.

I’m working with the Page (Large Header) template. What blocks do I need to include in the header to end up with a header with a site logo, navigation, and background image?

Thanks.

I don’t have a link to share because I am creating my site in Local. Hopefully I can explain this sufficiently.

I have my main navigation placed at the right side of the page. One of my menus has a sub-menu that is opening to the right (which I understand is how it is set up for this theme), but it opens off the side of the page. I’ve tried a few CSS tweaks to the custom class that I created for that sub-menu in order to have it open to the left, but nothing seems to be working quite right. Is there an easy bit of CSS for changing the direction that the sub-menu opens?

Thank you so much for any help!!

Hi,

I have a problem with the navigation bar.
On the desktop in the browser when I use the mobile view, the menu is left-aligned and actually looks good. If I use my iPhone, the navigation bar is on the right (the hamburger menu is also there). Because it has submenu it looks very bad.

My question: I want the text there to be displayed left-aligned.
Is that possible?

I am Using a custom plugin which is Metamask Gateway plugin but this is only working with the twenty-twenty one theme. If i am using the latest theme then this is not working https://prnt.sc/tt_lSuyQqtNN

Hi,

I would like to achieve a few things with the Twenty Twenty-Two theme that I don’t find in the options:

1) I would like the text in the header (site title etc.) to be aligned right when browsed from a mobile phone, as opposed to left which is the case for PCs.

It would be good if I could also limit/fix it in terms of what part of the header it may take – but again, this should also apply to the mobile version only.

Shouldn’t there be two separate editors available in WP themes in general – one for desktop and one for mobile? Or even three – one for tablets as well? It makes very little sense to program everything in one editor, since the devices on which the site will be shown will be very different from each other.

2) I would like to have semi-transparent background for the mobile menu where I myself can define the colour and opacity – are there no such options in the editor, or I don’t find them, and how can I set those parameters?

The next one is not the biggest deal in the world, but it would also be good to know how to:

3) make the mobile-menu background appear only under the hamburger button and for as far down as the menu items require, i.e. to not cover the entire screen when shown, but take just as much space as it needs while the rest of the site remains fully visible – I’ve seen this in some themes, any idea how to achieve it?

4) there is a visible line with the page background under the heading (most likely due to the overall padding defined for the website – is there a better way to set it to 0 for just the space under the heading, rather than setting everything else to zero and then increasing for all elements individually?

5) I have a separate menu in the Footer, and then one line of text under it. If I activate the switch to the hamburger button for smaller resolutions, can I make it so that it goes under the line of text, even though the menu items are above the line of text on desktops?

The theme works quite well for me, but I’d rather have the buttons rounded than with the default sharp edges – why can I not find such an option?

I edited the 2022 footer under wp-admin/site-editor.php?postType=wp_template_part&postId=twentytwentytwo%2F%2Ffooter&canvas=edit

Updated the site. But no footer displayed.

Any idea why?

My client was running a VERY barebones site with the twentytwentytwo theme, not even using a child theme. As a result of upgrades/changes, i’ve installed Woocommerce and we’re building out a store. So, i’ve created a child theme and everything is working just fine with the one exception of headers and footers being missing on the Woo-specific pages. After putting the site into debug mode, i’m getting these messages at the top/bottom of Woo pages (shop, cart, checkout) only:

“Template part has been deleted or is unavailable: header” and “Template part has been deleted or is unavailable: footer”.

So, i proceeded with switching to various themes to see if i could duplicate the issue. If i switched to the parent theme (twentytwentytwo), the problem was the same. If i switched to a different theme entirely (Astra, for example), the problem went away, though the default headers/footers were for some reason different from the rest of the site. I do understand that the twentytwentytwo theme is a block-based theme, so the paradigm shifted here, but i can’t account for why the Woo pages are behaving differently from the others in this specific theme.

Can someone offer me some advice in how to proceed here? All i’m looking to get to is having the same headers/footers across the site, regardless if it’s a Woo-specific page or not. The change in behavior seems to be related to the theme itself, but i’m not sure and could use guidance.

Hi

I have a problem with my menu – it looks ok on desktop but the mobile view is completely wrong. An image I don’t want there has suddenly plonked itself a the top, the menu is obscured.

Another issue is that the hamburger menu icon doesn’t look like a menu icon. It just looks like a white tile.

Any fixes?

Hello,

The hamburger menu on our site has stopped working. I have tried flushing the cache and rebuilding the menu (checking block settings as well). I have checked that all of the plugins are up to date. I have also tried removing the “Donate” button that sits next to the menu in case it is covering the functionality of the menu for some reason. Nothing has made a difference.

This site uses a very minimal collection of plugins and none of them are used in the header area, so I don’t think that there is a compatibility issue (there certainly was not one when the site was first built in October of 2023).

Please let me know if there are other options that I can try. This is only affecting the mobile site, but that is where many of our people access the site.

Thanks!

Hi,

I created a child theme for twentytwentytwo to tweak it a bit more. But I can’t find file (liked former “header.php”) or somesuch, where the <head> is portrayed, so can’t really overwrite it in the child theme. How do I go about if I want some additional tags in the <head> Element?

Many thanks in advance!

• This topic was modified 4 months, 4 weeks ago by Schroedingers Cat.
• This topic was modified 4 months, 4 weeks ago by Schroedingers Cat.

Hello. There is this error message that displays in my website. Please, could you point me to a solution for this issue?

Hi, I need help with updating the 2022 theme & fixing a broken layout afterwards. I am administering a site for a friend, the site is working OK but I got it in a state when everything needed to be updated. I started updating everything but the theme update broke the layout of the page. No white screen, no maintenance message, just a broken layout of the website. I found out that the website is running on 2022 theme version 1.2 which was released in May 2022, so it looks like the theme hasn’t been updated since then… I reverted the update so the page is working and I can work on fixing the problem. Does anybody have any idea what to do now? How to have the page all up to date but of course working properly? Thanks a lot for your ideas.

• This topic was modified 5 months, 2 weeks ago by sarkatilia.

I am using Twenty Twenty Two and Elementor to assemble my very simple pages. I cannot get the text to wrap around images any further than the first line of text. In the text editor preview box the text wraps as I want it to, but the full preview and actual online page it doesn’t show the wrapping. I have gone through all of the image settings to wrap and it just will not do it. Why is this not working now. I’ve created many pages in the past without any issues.

I am using Twenty Twenty-Two Theme, WooCommerce, and Events Tickets Plus.

When I “Get Tickets” and fill in the attendee info and click on “Checkout Now” the checkout page comes up blank.

See https://share.zight.com/lluOlGK4 for the error messages I am getting.

Event Tickets support and Woo Commerce support both point the finger at the Twenty Twenty-Two Theme.

Please help.

I need help in fixing menu items for the below site so that it will show horizontally instead of vertically: [ link moved to link field ]

Thank you

Hello!
I’m wanting to use a unique logo on this page and the subpages in the menu related to it

https://brewtifuladventures.com/azmidlife/

I tried to create a custom header with a different logo but it just assigned the same logo to all the pages.

Thank you for any help!

Chris

How do I tighten the spaces between paragraphs on this page: https://brewtifuladventures.com/deep-thoughts-while-drinking-beer/

Also, I’m not getting consistent spacing between all paragraphs here: https://brewtifuladventures.com/deep-thoughts/. It appears that the first two paragraphs have a larger space than the other paragraph.

Thank you so much for any help.

Chris

Hi, when I see this page on a small screen, like my phone or my scaled down window… the background header image gets blurry as hell… and gets sharper on the fly, when making the window bigger again.

What can I do against it. Its not a css Blur, at least I haven’t found anything like that in the code.

Hi, I am building a site with Theme 2022. I encounter the following in the image blocks: Image > settings > advanced > block name What should I enter in the block name and what happens then? I have already filled in something, photo 123, and see if it is reflected in the script. And it wasn’t. The name of the image block, on the left, also does not change. In short, what does that Block name do and what is it for?

• This topic was modified 9 months, 1 week ago by Loek.

Hey everyone,

for a while I have been trying to fix the display issues with my menu.
I have set up new templates and made sure every new page uses them. In the “Edit Template” or “Edit Site” view, all elements are displayed correctly (centered and on one line) but on the actual sites, when I create a new page it displays as seen on https://wearethedogs.org/landing/chats/ (with the first item suddenly higher than the rest) but as soon as I add any content, it automatically switches to display as seen here: https://wearethedogs.org/landing/register/ (which is a completely different setup).

I building a very simple site that runs BBpress as a forum.

I couldn’t yet figure out why that it and am hoping someone here can point me in the right direction.

Thanks in advance,
René

• This topic was modified 9 months, 1 week ago by reneseidel.
• This topic was modified 9 months, 1 week ago by reneseidel.

Hi there,

I am using WP block video to add multiple self-hosted videos to a page. Each video has a poster image and each preload is set to none. If preload is set to metadata the load time is slow. Hence the reason for using none. The problem is that clicking on the poster image does not play the video. The only way to play the video is to click the control play button. How can I keep the preload to none and click on the poster image to play each video? Is the some jquary to resolve this?

Hello can somebody help me to put solution on the space that appears between the top screen and the first container. Thanks

Hello I have all eight of my pages in the main menu under theme, editor , navigation

but only four pages appear in the navigation menu on my front page.

Hi, I’m using the Twenty Twenty-Two theme for our website.

I’m trying to troubleshoot two issues:

• Our posts are not appearing on our Posts page called ‘Forum’.
• Our Homepage keeps appearing when I go to our Posts page (https://www.southsouthmovement.org/forum/).

I have done all the tweaks suggested in the forums, but without success:

Under Reading settings, I have the default option selected because the ‘Front Page’ that comes with the theme does not appear in the drop-down list of possible static pages to choose from. The Posts page is set to ‘Forum’. The same thing goes for our Homepage settings under Appearance > Customise.

Under Appearance > Editor > Templates, the Front Page is set to our site’s Homepage (https://www.southsouthmovement.org/). I understand that Front Page “displays your site’s homepage, whether it is set to display latest posts or a static page. The Front Page template takes precedence over all templates.”

However, I still cannot resolve the two issues above.

Any help appreciated!

I am trying to deploy a Constant Contact form that I made in Constant Contact on our Twenty Twenty Two based site (because the Constant Contact Form plugin is pretty poor when it comes to out of the box utility). I am struggling to understand where I need to add the universal code (the CC guide says that it goes in a widget (Appearance > Widgets)) so that I can then add the inline code on the page where I want it to display. Any help would be greatly appreciated.

This is my first new website in two years and everything is sooooo different and complex in the backend.

Starting with the header. I am trying to use “Pattern: Header with image background”

1. the image I want to use is too big, but I can not find a way of making it smaller – or even what the required dimensions are for this “pattern.”
2. I can not get the default pattern with the bird (white background) to show up on my website.
3. I can not follow the video “Customizing a header with patterns” because it is different from what I see and not helpful at all.

Can I clear out the header and start from scratch? It used to be so simple to add a header image when it was Appearance:Customizer:Header Image.

Thank you for any assistance.

• This topic was modified 11 months, 3 weeks ago by clemrickbbb.