How to build a child theme from a modified theme/stylesheet
If, like me, you didnâ€™t start working on grapheneâ€™s modifications using the child theme, and youâ€™re now wondering how to update the theme without loosing all your hard job, then this article is for you. First of all, we are about to back trace the modifications made to the theme. To achieve this task, you will need:
– Sadly, a Windows PC (i didnâ€™t find the right tools for Linux or Mac)
– Original graphene package of your installed version: i obtained mine by copying the actual graphene download link from wordpress.org themes directory: http://wordpress.org/extend/themes/download/graphene.1.5.6.zip then i changed the version numbers to 1.4.1, put the link back in the browser, and i got the needed graphene.1.4.1.zip
– An actual copy of the online graphene folder where you made the modifications
– The shareware tool Total Commander
Download and install Total Commander, choose your language and open it up:
In the left pane, select the folder where you unzipped the original graphene package
In the right pane, select the folder where you put the copy of the online modified graphene installation
In the top menu of Total Commander, select Commands and then Synchronize Dirs.; Select all options but â€œAsymmetricâ€.; in the â€œShowâ€ section Select the two symbols unequal and unique on the right. Now click Compare; DONâ€™T CLICK SYNCRONIZE. As you can see in the screenshot, the program shows the different files (the ones that you modified in your graphene installation) and the files unique on the right; here you may find original files that you may have backed up before making modifications (like my footer.php.orig) or even new images you may have uploaded and referenced in your custom php/css (like my sprite_personal.png).
Right now, we are gonna focus on plain text files, like php and css.
On every â€œdifferentâ€ text file, you are gonna right click and select â€œCompare left and Rightâ€.
Such a window will popup, with different lines and differences in the line shown in red.
You are gonna evaluate every modification made in plain text php files. In my case there was just some translation relative modifications, and it was easy for me to take a note for every file, like â€œarchive.php lines 25, 27, 31, 33, 35 translationâ€. I did this for every php file. Then i had to face the case of the modification i asked Syahir in this post. Such modifications should be manually restored every time you will update the theme, because, as far as i know, theyâ€™re not supported in the child-theme.
The modifications made to the css and eventually added functions in the functions.php file should be copied and pasted in the child-theme files, read this post for full details. To build this files, i suggest you to use Notepad++. After building your child themeâ€™s directory of you current graphene version, you are now safe to upload the original functions.php and style.css to the online graphene folder. Then you should go in the wordpress panel and switch from graphene to the configured child theme, and your site, if you did everything fine, will look exactly as before! You are now â€œsafeâ€ to update graphene. I mean that you should always bring modifications made to the archive, loop, header, footer, and other themes files not supported by the child theme back to the new original graphene installation.
In my case, after upgrade the notes taken from the file comparison described above became useful to bring my modifications back to the new 1.5.6 installation.
AnonymousDecember 30, 2011 at 10:07 pm #21920
HUGE +1 !!
This will come in very handy to a lot of people. Great explanation, nice screenshots, and detailed instructions.
Thanks for the contribution!!
AnonymousDecember 31, 2011 at 4:37 am #21921
Wow! Great post! This can certainly help the newbies to theme modifications.
However, a small doubt. Why did you mark this thread as not resolved?? 🙂ModMod
then i changed the version numbers to 1.4.1, put the link back in the browser, and i got the needed graphene.1.4.1.zip
Check the version number in your stylesheet — this will only work if you are using 1.4.1. If you are using a different version, you will want to change to the appropriate version number here.
AnonymousDecember 31, 2011 at 5:04 am #21925
Should this be stickied? Opinions?
I think so..
AnonymousDecember 31, 2011 at 5:09 am #21926
Absolutely. (Has anyone been following along on my suggestions for a “Hall of Fame” for graphene sites?)
Edit: Can we make a sticky thread in the showcase forum?Mod
Has anyone been following along on my suggestions for a “Hall of Fame” for graphene sites?
Might need some sort of polling software–not sure if bbPress could handle this. But definitely a cool idea. Kind of like the Oscars for Graphene.
Can we make a sticky thread in the showcase forum?
Technically possible — or do you mean, is it okay with Syahir?
AnonymousDecember 31, 2011 at 5:55 am #21928
Haha.. both, I suppose. I do love the poll idea.
- You must be logged in to reply to this topic.