Compare theme files – Winmerge tutorial

In this section, you will learn how to compare files or folders in order to check the structure/code differences. This operation may be useful in many cases. One would be when you want to check the code modifications between different versions of the theme. The tool we will use is Winmerge, it can be downloaded for free and you can check its documentation here.

Installation:

We won’t cover this area here, it is explained in detail in the Winnmerge software documentation.

Configuration:

The settings area can be accessed from the menu Edit -> Options. The most important settings are located on the Compare tab, from here you can specify how the compare process works. Depending on what you want to compare, you can set it to ignore certain aspects (ex. empty space, blank lines or carriage return differences) if you don’t consider them important and you want to return only the result on which you’re interested. The settings used by us are presented below but you should play with the settings until you obtain the result you’re looking for. The Compare -> Folder settings were not modified.

Winmerge Settings General

Compare:

In the following example, I will compare the Newspaper theme folders for version 6.5 and 6.5.1. To do this I will open Winmerge and I will click on File -> Open.. menu. You can also use the shortcut CTRL+O. This will open a new window, and you have to choose the directories or files you want to compare. In my case I’ve selected the folders for Newspaper version 6.5 and 6.5.1, the other filters were set to compare all files and include subfolders.

winmerge compare folders

Once you’re done, click the OK button and wait for the compare process to be complete. In my case, there were no major modification between these two versions, it was a quick fix and only the Visual Composer’s latest version was added so we shouldn’t have many files changed. Let’s check the results! You can see 3 files: first is the Visual Composer archive and it’s a binary file, and the second and third which are text files.

winmerge compare - newspaper theme

If you double click on a file, you can see the differences between the file on the left and the one on the right, because they are highlighted. In the following image you can see the style.css file on which only the version was changed from 6.5 to 6.5.1 and on the left you can find the Location panel where you can see the position of the lines which are changed from one version to the other.

Winmerge Compare Newspaper Result Stylecss

Merge:

As the title says, this software comes with options to merge the compared files, you can find them in the Merge menu. We will not discuss them in this tutorial but you can read about them in the official documentation – here.