Upgrading to Genesis 2.4.2 blows up my child theme

[cosmocanuck]

Hi all! I'm hoping someone can suggest something here... I have built a child theme for my client, a local film festival, based on Genesis. They are running Genesis 2.2.7.

When I updated to 2.4.2, the layout went "kablooey". I've yet to understand why after much investigation.

Luckily, I have a staging site where I can test this. I've confirmed that it was only the upgrade to 2.4.2 - not any other plugin or some such - that causes the catastrophe. I've also confirmed that I didn't add any of my CSS to Genesis, only to my child theme.

Here's the URL's in question:

Live site (still on 2.2.7, looking great): http://www.vjff.org
Staging site (updated to 2.4.2, messed up): http://staging.vjff.org

One example: the logo in the header area is now missing in action in the staging site. I see that, in my web inspector, clicking the a tag reveals this style from the parent theme:

.header-image .site-title a {
overflow: hidden;
text-indent: 100%;
white-space: nowrap;
}

When I turn these styles off in the Inspector, the logo appears in its correct place. But when I try to emulate this in my child theme's stylesheet by adding this to the end:

.header-image .site-title a {
overflow: visible;
text-indent: 0px;
}

It has no effect at all! (The Inspector also "fixes" the logo when I change the overflow and text-indent rules to match the above, as well as simply turning them off).

One more example. The three boxes at page bottom include the "one-third" selector. But after the upgrade (on the staging site), when I click on the first of the three boxes, i.e. I select "div.entry-content > a > div .festival one-third first", none of the Genesis "one-third" width rules are being applied any more. (Yes, I've modified the one-third selector in other ways, but those styles are applied identically on both sites).

So, much strangeness and I just have no idea why. And, I'm not having any luck trying to apply CSS fixes to address things.

I hope someone can offer a suggestion or two.

Many thanks!
Adam

http://staging.vjff.org

[Christoph]

Hi Adam,
a few ideas:
1) Column classes were removed from the parent theme in 2.3. You have to add them to your child theme
I see you are importing the parent style.css. Genesis might remove more styling from the parent theme.
I'd suggest you take the sample theme style.css as basis for future child themes and don't rely on css available from the parent stylesheet.

2) 2.4 Moved genesis_create_initial_layouts() to the genesis_setup hook. Possible breaking change, in order to ensure compatibility with WordPress 4.7+.
Depending on how you setup your child theme, you might have to change where you hooked your child themes styles,etc...

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[cosmocanuck]

Thanks, Christoph! Super helpful! I'll have another look based on this info.

Adam

[cosmocanuck]

Whadya know, I just noticed this text in the Genesis parent theme CSS file, right in the intro stuff at the top:

"Copy the contents of this file to the child theme. Do not use @import, as the CSS included with Genesis might change in the future."

I did exactly that, replacing the @import line with a copy of the previous Genesis version's CSS, followed still by my own additions.

Aaaaaand.... instantly the site is fixed!

Guess I should've noticed and followed that advice!

Last question: I assume if I don't use "genesis_setup" or "genesis_create_initial_layouts" (i.e. I don't reference them in my functions.php file, and haven't done anything else at that level with my theme, just the new CSS and graphics), then I don't have anything to worry about?

Anyway, thanks so much for helping me figure this out.

Adam

[Christoph]

Hi Adam,

glad you got it sorted.

It doesn´t sound like you have to worry about the genesis_setup "stuff" 🙂

---

https://www.christophherr.com | Genesis Customizations | Buy me a coffee

[Author]

Posts