George McKenzie
George McKenzie

Reputation: 115

When working with an already made website, how do you know which file to edit to change something?

Let's say I'm building a website and using an already made Wordpress theme. Say it's a pretty complex theme and there's a lot of folders and files. If I wanted to change something specific, like text, or an image, or something that happens in Javascript/jQuery, and the change that I want is not an option in the themes control panel, what do I do? I know I have to go into the files but how do I know which file to go to? Lately, I've just download the theme to my desktop and use the windows search companion and type in the field that says "a word or phrase in the file." Sometimes it comes up and sometimes it doesn't. For CSS changes I usually use Firebug and click on the element, but many times I want to change the HTML/PHP/Javascript. I feel like I'm doing it the wrong way and there's an easier way that I'm missing.

Upvotes: 0

Views: 114

Answers (2)

Gaurav
Gaurav

Reputation: 1098

As you mentioned WordPress theme so I will specifically try to answer this question for editing WordPress theme.

When it comes to WordPress, everything is very structured and well organized. If theme written following standard practices then each component has its specific file. If you are familiar with WordPress theme structure and want to change php code or say a static part then all you need to do is locate the component file say sidebar.php, home.php, single-{type}.php, header.php and many similar files. http://codex.wordpress.org/Template_Hierarchy

Now if you want to edit something that is shown in right/left side of page as sidebar then chances of finding it in sidebar.php are maximum. Similarly to change something on home page try looking for home.php, for posts it could be single-post.php.

Many a times what you are looking to change might need a tweak in widgets. In this case, process remains same as theme you just need to look in different folder.

Javascript: For editing javascript, beautify the code if it came minified. When you have code ready much of js debugging can be done using firebug/Developer Console in chrome. Best way is to put breakpoints at relevant position and then inspect code behavior. You will be able to locate code block that you need to tweak to achieve what you want.

CSS: Create a child theme and then use it override default theme properties.

Upvotes: 1

pdoherty926
pdoherty926

Reputation: 10379

You can probably use grep in PowerShell, Cygwin, etc.

grep -lir "a word or phrase in the file." *

edit: Emulating Grep in Powershell

Upvotes: 0

Related Questions