Jump to content
Sign in to follow this  
yetiboy

Child theme css

Recommended Posts

yetiboy

I am trying to create a child theme for EcoPro. I have changed the header and footer without any problem - their content shows up when I load the page. However, the css I have altered does not. When I check the source code for my main page, the link is to the main EcoPro style.css, not my child theme style.css. Am I missing something? If you need to see what I'm talking about, the website is http://rmss.ca. I'm wondering if the problem is because this is a multisite install.

Share this post


Link to post
Share on other sites
yetiboy

After playing with Custom Code and folders to have my images show up, I've finally managed to get the look I want in my header. However, I don't like having all of the css show up at the top of my page as opposed to having it within my style.css. I'd still like a solution to this if anyone is up to it.

Share this post


Link to post
Share on other sites
yetiboy

I have Template: EcoPro in the top section of my child style.css. EcoPro is the name of the parent folder. I also had @import url("../EcoPro/style.css"); in the child style.css, but tested it out without having that in there and still ended up with the same results (ie. the site showed EcoPro parent css) so I know the child style.css was never used. If it had been, there would have been no formatting except for a limited part of the header and footer.

Share this post


Link to post
Share on other sites
Andrew

@Brad, there are issues with child theming and multisite. Have you activated and added 'parent theme: ecopro' to the child? (ecopro needs to exactly match the folder name of the parent theme)

Share this post


Link to post
Share on other sites
yetiboy

I've actually decided to pitch the multisite at this point. It looks like it's working better without having to deal with that added complication. As far as your suggestions go Andrew, I have absolutely no idea what you're trying to say. Activated what? Do you mean have I activated both the EcoPro theme AND my child theme? If so, yes. And where exactly would I put 'parent theme: ecopro'? Or is that part of the activation question? As far as matching folders, the EcoPro folder I mentioned in my above post is the exact name. I'm going to close this thread now. Despite the fact that I wasn't able to solve my problem, I have no interest in pursuing it further. Thanks for your help, everyone.

Share this post


Link to post
Share on other sites
yetiboy

I had to reopen this, because it's frustrating me beyond all belief. I'm getting pretty fed up with having to add style changes to Custom Code instead of style.css in my EcoPro child theme. Am I missing something stupidly simple here? I know the child folder is being used because I've altered some files (eg. header.php) and put the files into the child folder and those changes show up. I copy and paste changes I've attempted to make in the style.css into Custom Code and it works perfectly. But nothing I do to style.css shows up. Obviously my code works, but style.css doesn't.

Share this post


Link to post
Share on other sites
bryan-hadaway

The reason is because the Custom CSS is inserted lower in pages, therefore loading last and takes precedence. There's nothing wrong with using Custom CSS, this won't be overwritten on upgrade. To use style.css just make sure to be more specific than the CSS you're overriding like if in the main theme CSS was: `#feature a{whatever}` you need to be more specific like so: `body #feature a{whatever}` Thanks, Bryan

Share this post


Link to post
Share on other sites
yetiboy

Thanks for the attempt, Bryan. Unfortunately, your suggestion didn't work. Even the most basic css isn't working, such as: #header { background: url('/wp-content/themes/eco-child/images/header-background.jpg') repeat-x center center; } #header .content { background: url('/wp-content/themes/eco-child/images/header-background.jpg') repeat-x center center; } Like I said above, it appears that style.css isn't even being accessed. When I check my source code, the link isn't to the child style.css, it's to the parent: `` (this is the parent style.css) instead of what it SHOULD be: ``

Share this post


Link to post
Share on other sites
kastelic

When Brian mentions being more specific, he means by adding more elements to the rule that are parents of the elements your targeting (like the body element in his example). That will help in overriding other rules.

Share this post


Link to post
Share on other sites
yetiboy

I appreciate the help guys, but I really don't think you get what I'm saying. The issue isn't the content of the child style.css. The issue is that the child style.css is NOT being used. The source code for my pages clearly shows that the style.css that is being used is from the parent folder (EcoPro), not the child (eco-child). Just to make sure, I've tried being more specific with the elements - eg. instead of #header I used body #header in the child style.css and then removed the Custom Code. Unfortunately, it didn't help.

Share this post


Link to post
Share on other sites
catrina

Even if you set the stylesheet link to your child theme CSS it just switches back to the parent.css stylesheet?


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
Andrew

Hey Brad, Sorry, I know what you're trying to say. Inside your child style.css document, there needs to be a line that says: `Template: ecopro` Then you're ONLY going to activate the child theme. (Then you may need to add additional functions to the `functions.php` of the child theme; but we'll cross that bridge when we come to it)

Share this post


Link to post
Share on other sites
yetiboy

Catrina: The code to call style.css is the following (in header.php): `` THEME_ROOT should be pointing to the eco-child folder (since that is the active theme), but instead it seems to be pointing to EcoPro folder. I guess I could always hard code in the link to the proper style.css, but that's just a bandaid solution for the underlying problem - for whatever reason, THEME_ROOT seems to be pointing to the wrong folder. If need be, I will try that route though. Andrew: I already have the Template: EcoPro line in my child style.css, and the child theme is the only active theme at the moment. What do you think I need to add in terms of functions?

Share this post


Link to post
Share on other sites
Andrew

Hey Brad, Are you on the most recent version of Eco? this was fixed a couple releases ago. From EcoPro 1.3.5: ``

Share this post


Link to post
Share on other sites
yetiboy

Wow, what an absolute mess. That's exactly what the problem is, I'm sure. Somehow, I ended up with an old version installed. Which means a HUGE amount of the work I've done is now completely useless. I'll get back to you if any new issues arise (as I'm sure they will). Thanks so much for the help Andrew.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×