Child Themes to Make Your WordPress Customizations Permanent

By | January 25, 2016

So you’ve made some awesome tweaks to your WordPress theme, but then you go ahead and update it with the latest version from the author and… All your brilliant customizations have been lost!

If you have made customizations directly to a WordPress theme, they will be wiped out whenever you install an update from the author.

You can manually make changes to the new files whenever the developer releases an update, but the best way to retain your customizations is to create a child theme.

Create a Child Theme

The first thing you need to do is create a new folder in the WordPress /theme directory. The folder name should be the theme’s name followed by a hyphen and then “child” (e.g: themename-child)

Copy and paste the following into a text editor and save it as style.css in the new folder (customizing it for your own site)

Create a functions.php file in the child folder and copy and paste this into it:

Go into WordPress admin and activate the new child theme

Reload the page. Open the page’s source. Verify that the child theme is loaded last. For example:

The child stylesheet is the last in the list, meaning that its contents will take priority over the other stylesheets.

Any changes you make to style.css in the child theme’s directory will override style.css in the parent directory.

If you need to customize any of the parent’s PHP template files, make a copy of them in the child directory (following the same directory structure as the parent) and make your changes there. The template files in the child directory will override those in the parent’s directory. The only exception to this is the functions.php file.

Manually Copy Changes

  1. Download current theme folder (including customizations) using an FTP client
  2. Download the new theme version from the web
  3. If you know where the customizations are, copy and paste the old theme’s code snippets to new theme
  4. If you don’t know where they are, use a utility (e.g: WinMerge) to compare the files.
  5. Copy and paste the custom code snippets into the new theme.
  6. Upload new theme directory to WordPress theme folder.

Comparing the files

Now, in the event that you’ve inherited a WordPress site, in which the theme was customized by someone else, we need to find out exactly what customizations were made to the theme’s files.

Unfortunately, sometimes only the latest version is available for download on the theme’s website. To get an older version, you can use SVN or Subversion.

Look at the bottom-right corner of the theme’s page for “Browse the Code” -> “Subversion Repository

From the WordPress dashboard, go to appearances -> themes and find out what version of the theme is installed.

Click on “Theme Details”. A window should pop up that includes the version of the theme. For example:

Theme_Version_Brawny

Create a new directory under themes (brawny_original). Open a terminal from that window.

Using SVN, download the version of the theme which is currently installed.

This will create a directory called 0.0.7 (depending on the version number you found), with the theme’s original files inside.

We need to compare this directory to the existing theme’s directory, to find out which files have been modified. For this, we’ll use a Linux application called Meld.

Open Meld and click on “Directory comparison” button.

References

http://www.wpbeginner.com/wp-themes/how-to-update-a-wordpress-theme-without-losing-customization/

http://www.wpbeginner.com/wp-themes/how-to-create-a-wordpress-child-theme-video/

https://codex.wordpress.org/Child_Themes

http://mor10.com/challenges-new-method-inheriting-parent-styles-wordpress-child-themes/

http://www.childthemeconfigurator.com/how-child-themes-work/

https://wordpress.org/support/topic/woocommercecss-overriding-child-theme-stylecss

https://wordpress.org/support/topic/child-theme-exactly-how-to-import-multiple-css-files-without-import

0 thoughts on “Child Themes to Make Your WordPress Customizations Permanent

  1. Pingback: Move Some WordPress Sidebar Widgets Above Content in Responsive Mode |

Leave a Reply

Your email address will not be published.

*