You need to code a theme for some php/mysql script and there is no tutorial available? Guess what-you don’t even need one. Just follow my method and with some time and work you can become guru.

Note: You must have some knowledge in html & css.

Software you need: Firefox browser , Web Developer extension for Firefox and Adobe Dreamweaver(not a must have).

1. You need to have script installed on your host or locally on your computer. For local installation, I use Xampp which is making my computer act like server. I am not going to go into installing and using Xampp now,(it is very easy-just Google for some info), so let’s assume you installed script on your host.

2. In most cases, script you are editing has template files in separate folder. That folder will be usually named “templates”, “tpl” or something like that and will be located in root or sometimes in “includes” or some other folder. If script you are working on doesn’t have any of this don’t worry-we have a solution for this.

3. Most common template files for every script are header.something(html, tpl, php…) and footer. Those files are repeated trough whole skin and included in all other files using some sort of “include” function. For scripts with 2 columns layout(like Wordpress) you can also expect file called “sidebar”, “left” or something like that.

4. Let’s just forget all those files and folders and say you have no idea what files to edit. Open your script in Firefox and use Web Developer’s function Outline>Outline Current Element.

outline.gif

Move your pointer over page and look at top bar of your browser.

codepath.gif

You will see html path of every page element.

5. If you located all template files open them all in Dreamweaver. Ones you red id of element you want to change(example #maintbl on image above)-try to locate it in files. If you can’t find it use search function(Edit>Search and Replace or CTRL+F).

search.gif

From first drop down menu, choose Current Document(if you know it is in file you are viewing), Open Documents(if you opened all template files) or Folder… and locate folder where copy of your script copy is by clicking on folder icon besides(if you have no idea where your element is). After you choose your search method, click Find Next.

6. Repeating this process will help you get to know with your script template system. Ones you know classes and id’s of your elements, you are ready to edit css file to suit your needs.