Installing a child theme over a parent theme

Hi, I want to make a few visual customisations to my site so I've been told I need to edit the child theme of my site. Trouble is I haven't installed a child version of the Studio theme I'm using and have never used Child themes before.

I've read https://premium.wpmudev.org/the-buddypress-manual/what-are-parent-and-child-themes/ and have a conceptual understanding of how they work. But does this mean if I'm currently using the parent theme, I won't be able to now use the child theme and continue to use the site as normal?

Tips and advice would be much appreciated.

Ben

  • aecnu

    Greetings Ben,

    Thank you for writing in and asking about this concept.

    I can relate to you 110%, the first time I heard about Parent and child themes I thought what?

    This is how to deal with it and hopefully the advantages of this concept will become clear before the end of my letter to you here.

    What one should do is download the theme, unzip it on their computer and then upload the entire theme to the wp-content --> themes folder. Basically one would have just uploaded the entire theme parent and child.

    Next is to upload the child theme separately to the same wp-content --> themes folder

    So look into the folders of the themes unzipped files on your computer and find the themes folder and inside there you will find the child theme. Upload the child theme to the themes folder on your host.

    Now activate the child theme for your network or site by site as you desire.

    The child theme will have in its own folders a folder titled _inc and within it is a css file - this is where you want to make changes to the theme directly customizing the css as desired but not touching, changing, activating, nor modifying the files in the parent theme that you uploaded earlier.

    This concept is such that when you now update your theme the files in the parent theme may be totally deleted and replaced while not affecting your customizations in the child theme portion since during the updating process it is not touched.

    However, as you mentioned above you may have already made changes to the parent theme as I had previously done myself or you may find the need on rare occasion to want to still modify the parent theme.

    What I do in this case is to all files I modified in the parent theme I permission those files via FTP 444 read only so that in the event of an update they cannot be overwritten.

    On some occasions this causes the automated updating to fail, but I simply theme download the new version of the theme and then upload it via FTP which still does not over write my customizations as long as they were permission-ed 444 read only.

    Note: I do compare the customized files versus the new files to make sure that they themselves do not require updating, in which in this event I manually update my customized files so as to benefit from the update but not lose my customizations.

    I hope this clarifies the way this all works regarding parent and child themes.

    Thank you for being a WPMU Dev member!

    Cheers, Joe :slight_smile:

  • themarketingcompass

    Great response Joe, very detailed!

    Could I go into the Studio theme folder, find the child theme folder, zip it to the desktop and then updload via the theme uploader in wordpress.

    By then installing the child theme, would the theme customisations from the parent theme stay the same (I'm not talking custom css edits here, I do this sometimes, but mostly I prefer using plugins!). I'm just talking about the settings I've selected in theme customisation, sliders, logo etc...

    I don't want to bring the site down to it's knees and have to start again!

    Ben

  • aecnu

    Greetings Ben,

    Personally I choose to not use the theme uploader nor the plugin uploader of WordPress finding that this feature is not as reliable as one would think and corrupt file uploads it totally ignores while my FTP client will tell my if there was a problem uploading any file, even a single file.

    Could I go into the Studio theme folder, find the child theme folder, zip it to the desktop and then updload via the theme uploader in wordpress.

    Why certainly you can do this to the best of my knowledge, but it would be much safer to FTP it up for the reasons given above.

    By then installing the child theme, would the theme customisations from the parent theme stay the same (I'm not talking custom css edits here, I do this sometimes, but mostly I prefer using plugins!). I'm just talking about the settings I've selected in theme customisation, sliders, logo etc...

    Yes they should stay the same. Mostly the child theme is for hard coding theme changes and not relative to the option changes within the theme menu's itself.

    I don't want to bring the site down to it's knees and have to start again!

    I hear ya there!

    Cheers, Joe :slight_smile:

  • themarketingcompass

    Hi Joe, I managed to remove the last grey strip by commenting 'false' on the sliding login panel in the CSS.

    Having removed the sliding login panel, I've allowed the admin bar to be seen to visitors not logged into the site, with 'login' and 'signup' buttons. The 'login' button goes here: http://www.marketingcompass.co.uk/wp-login.php?redirect_to=http%3A%2F%2Fwww.marketingcompass.co.uk

    ...which come's up with an error message saying that the user has entered incorrect login information....which isn't true!

    Instead of going to the wp-login.php page is there a way of redirecting the login button's URL to go to: http://www.marketingcompass.co.uk/login ?

    My other concern is the 'register' button on the header strip, which I can't get to line up with anything. I don't mind removing it or spacing it a line below so it looks neat, just need some advice on how to do this?

    Many thanks in advance

    Ben

  • aecnu

    Greetings themarketingcompass,

    Hi Joe, I managed to remove the last grey strip by commenting 'false' on the sliding login panel in the CSS.

    Happy to hear that you got that sorted. I am just now getting back to your ticket to find you have accomplished this - great going! Glad that issue got sorted.

    I could use the Custom Admin bar plugin, but it doesn't seem to override the standard buddypress admin bar?

    The Custom Admin Bar plugin is not relative to the Buddy Press admin bar. It is directly related to the admin bar located in the admin dashboard --> it allows modification of that particular bar i.e. removing WordPress links embedded within etc.

    The 'login' button goes here: http://www.marketingcompass.co.uk/wp-login.php?redirect_to=http%3A%2F%2Fwww.marketingcompass.co.uk

    I get the same error, but that is because the URL definitely looks funky and I think it is trying to call up the cookie from the site to see who you are (or rather the person clicking the Login)

    This should be hard coded into the bar so that it does not have all those extra characters in there. Since this will probably be adjusted in the main theme portion it would be wise to mark the file permissioned 444 read only so that the customization is not overwritten.

    My other concern is the 'register' button on the header strip, which I can't get to line up with anything. I don't mind removing it or spacing it a line below so it looks neat, just need some advice on how to do this?

    I see it and agree that it is somewhat unsightly and would look better with some kind of alignment made to it. now how to straighten it out is the hard part.

    Should we move the Home bar up or down by possibly inserting a line break <br /> before or after the home bar? This seems like the next thing to attempt to straighten this out.

    Please advise.

    Cheers, Joe :slight_smile:

  • themarketingcompass

    Hi Joe, I think I'd rather remove the 'register' button as you can now just press 'signup' in the admin bar when not logged in. Even if you are logged in, the unsightly 'login' button remains...so it's pretty confusing really!

    Any ideas how to remove it? Within the Studio theme options 'header options', you have to put a title and link in for the button or the button just says 'enter text here'. Can we figure out how to remove it completely?

    Also, where would I be able to edit the bar to make the above change?

    Kind regards

    Ben

  • themarketingcompass

    OK that's fine, could you tell me which version of IE you are using. It's definately doing something funny in some versions - IE having the market share in browser use is a bit worrying for the site!

    As for the images, they definately work in Safari. I think they may be .png images. I've noticed that Chrome and IE don't like .png images. Is that your experience Joe?

    Kind regards

    Ben

  • aecnu

    Greetings Ben,

    Concerning the graphics I would have made them jpgs or pngs, and I am sorry that I did not answer this portion earlier, I missed it somehow.

    However, old versions of IE had problems with png's but that has been overcome for quite awhile now.

    However, the first thing I would do is dump the cache's of IE, I use a great free piece of software every evening before shutting my computer down to keep it running great originally called Crap Cleaner, but now more politically correct name of CCleaner which personally I preferred the original :slight_smile:

    You can get your free copy here and run this cleaning up those cache but check the options carefully because it is possible to clean out more then you think or possibly want.

    Let me know how it cleans up your computer and how many GB's of garbage it gets rid of :slight_smile:

    Once things have been cleaned up, please visit your page and see if we still have an alignment problem?

    We will go after the graphics after we get this one problem fixed. Oh, and related to the graphics, if this a MultiSite install?

    Cheers, Joe :slight_smile:

  • themarketingcompass

    Looks like the images have come back for some reason! Don't know what I did, but overnight, they've just sorted themselves out...power of positive thought maybe?!

    Still getting the alignment issues, including in the footer. One of our machines has IE9 on it and is getting alignment issues too - have cleared the cache with no change. Could you check again?

    Could this be a theme issue (studio)?

    Ben

  • themarketingcompass

    Could it be something to do with this error that I see in the events+ plugin?

    Warning: Cannot modify header information - headers already sent by (output started at /var/sites/m/marketingcompass.co.uk/public_html/wp-admin/includes/template.php:1657) in /var/sites/m/marketingcompass.co.uk/public_html/wp-content/plugins/invite-anyone/by-email/by-email.php on line 391

    ..I just deactivated the plugin 'invite anyone' and it's still having alignment issues! :slight_frown:

  • aecnu

    Greetings Ben,

    Regarding the graphics magically appearing once again, something freaky is going on there, but i do not think it has to do with your website due to the fact it has always looked great from here (Bulgaria) as demonstrated in my screen shots.

    I do see a problem today with that floating footer you now have in IE (I did not notice it before) and I have provided screen shots below. the first from Firefox - absolutely beautiful - and the second from IE what a mess it has made of the floating footer!

    Regarding the errors above (as indicated caused by invite anyone), I could not see the error in any event and alignment is flawless - the only problem I see in the page is the floating footer and in IE9 only. By the way, it is absolutely beautiful in Opera too. I would give a screenshot but it is the same a Firefox --> Flawless!

    Are you using caching on the site?

    You know why there is an IE 9 and not just IE, because the buffoons at Microshaft cannot seem to get it together time after time .... lol

    So Ben I do not know what to tell you but the truth and it seems that IE9 is definitely causing havoc and of course it is important to have this working for IE since it remains the dominant browser though I have no clue as to why.

    Sincerely, Joe

  • themarketingcompass

    Thanks for the nice comments about the site Joe :slight_smile:

    I agree IE sucks, but they still have a large market share...apparently Chrome now has 32.7% and IE has 32.48% as of today! So it's on the demise, but still hanging in there.

    Could it be anything to do with the button to the right of the sidebar that say's 'Navigator - find out more'
    ..infact there's no button at all, it's a clickable image. I wonder if that's an alt tag picked up by you hovering your mouse over the image in the screenshot?

    How do I use caching on the site itself?

  • aecnu

    Greetings Ben,

    There are many ways to use caching on the site, but caching could cause other problems and it is the best procedure to not use caching on development sites. They themselves can cause issues like the dis-appearing re-appearing graphics you had experienced in the past.

    So for now it is certainly the best thing to not have any caching in use.

    I personally have no idea why we are having this alignment anomalies with this site, but of course we could try disabling all the plugins and see what we get and then enable them one at a time to see what is interfering with the site.

    Please advise.

    Cheers, Joe

  • aecnu

    Greetings Ben,

    Just checking if this issue was eventually resolved in another thread? Or by yourself separately to us? Or by us over email with you? Or using our live support?

    If so, no need to reply, that's great news.

    If not, or you have any more questions related to this thread, please feel free to post them below including any new symptoms or errors and tick the 'Mark as Not Resolved (re-open)' box below the post area (or else we'll miss it!)

    Otherwise, happy days, glad you got it sorted :slight_smile:

    Thank you for being a WPMU Dev member!

    Cheers, Joe

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.