Trying out child theme, need some help please

  • etherealmist

    #1947

    In my last support thread it was suggested I start using a child theme. I’m having a couple issues as is stands getting some code to work

    First off, my site

    http://www.forserialmist.com

    I copied over a lot of the CSS I changed, but a few of them don’t seem to be taking effect. Now granted, I’m basically a newbie at anything that isn’t simple HTML, however I’ve been able to find my way around and edit things here and there.

    This is ONE example of a CSS style I’m trying to change, but it wont take hold.

    .entry-content img,

    .child-page img {

    border: 4px solid #e3e3e3;

    margin: 5px;

    }

    I want to get rid of the border attribute, but it doesn’t seem to take hold in the child theme

    .entry-content img,

    .child-page img {

    margin: 5px;

    }

    Also, I was wondering if there was a way to keep the same sprites and images that I’ve edited, to match my color scheme, without having to reupload? I mean if reuploading is going to be the easiest way, then so be it, but I was just wondering if there was a way by using the child theme.

    I, for the most part, got my site working with the child theme, just those couple issues that I cant seem to figure out.

    The colors of the image slider at the top also wont take hold in the CSS, or the boarder color of the image inside it, I’ve tried to change it to as well to no avail.

    If I’m not explaining things well, please ask, I’ll try my best to explain differently.

    THANKS IN ADVANCE <3

    Anonymous

    #17984

    Well, for your first issue, the child css only writes over properties as you add them in the child. So by doing it the way you did,

    .entry-content img,
    .child-page img {
    margin: 5px;
    }

    You’re basically telling the script to overwrite the original margin: 5px; with your child margin: 5px;… so basically, you accomplished nothing. You’re thinking about it the wrong way. Removing it from your child css doesn’t mean it won’t show in the parent. You need to duplicate the element and the property in your child, and then tell it to display none… or whatever your adjustment might be.

    Instead, try…

    .entry-content img,
    .child-page img {
    border: none;
    }

    This is telling the script to replace the parent border: 4px solid #e3e3e3; with the child border: none;.

    The properties you add to your child css will do one of two things:

    1. If the same property exists in the parent theme, it will over-right the parent theme css property.

    2. If the property does NOT exist in the parent theme, it simply adds it to the parent css element list of properties.

    Hope this makes sense 🙂

    etherealmist

    #17985

    OMG yes >.< I even knew that too, because I do remember reading that, god I feel stupid.

    etherealmist

    #17986

    What about for the spite images? Any suggestions?

    Anonymous

    #17987

    Yes, keep a list of the images you change in a notepad document and re-upload them as necessary 🙂

    I’ve changed the sprites also. I have no idea what would be a better way. I keep a notepad document in my folder with my website backups. It’s a “log” of changes I make to core files… although I try to avoid it at all costs.

    Jon Lynch

    #17988

    my suggestion is to create a separate sprite (stored in the child theme folder) for all your changed images and reference it from your child theme stylesheet. This does not get overwritten by an update.

    Jon

    Anonymous

    #17989

    Hi Jon, thanks for the perfect advice.

    Seen your comments around here. Definitely my kind of acquaintance!

    Nice to meet you.

    Admin

    Syahir Hakim

    #17990
    Quote:
    my suggestion is to create a separate sprite (stored in the child theme folder) for all your changed images and reference it from your child theme stylesheet. This does not get overwritten by an update.

    Agreed. And if you’re just changing one image, you don’t even need a new sprite image. Instead, just overwrite the CSS so that that elements point to the new image instead of the theme’s sprite image. Just because the theme uses sprites, doesn’t mean you must to, particularly if you’re just changing one image.

Viewing 8 posts - 1 through 8 (of 8 total)

  • You must be logged in to reply to this topic.