Error location method in the process of WordPress template making

WordPress template in the production process, there are some seemingly complex problems, in fact, as long as the problem identified the location, most of them can solve themselves.

1. Use Firebug for troubleshooting

1.1 Brief Introduction and installation method

Firebug is a Firefox plug-in that provides a complete set of tools necessary for web development. From HTML authoring to CSS style sheet beautification, and ...

So we're going to install the Firefox browser first.

After installing the browser, select the "Tools" menu on the menu bar and click "Add-on" ==> "Get additional Components"

Enter "Firebug" in the input box. After the search results come out click Firbug link into the firebug download installation page.

1.2 How to use

After the installation is complete, in the location of their error, point right ==> view elements, you can find the wrong style where.

2, Border background debugging method

2.1 Brief Introduction

If the page in IE under the exception to browse, in the FF normal browsing, it is more troublesome, at this time we can set a prominent border or background, to debug.

2.2 How to use

First estimate the location of the error at that, add style= "Border:1pxsolid#000″" on its label, so you can see how much of the module is in place and whether it is growing in scope.

3, the maximum width of the minimum width

3.1 Brief Introduction

In the template making process, there is often a side column sinking, usually the content area of the excessive width caused, but not absolutely.

3.2 Resolution Method

In this case, we can first give the content width to 100 or smaller and add the Overflow:hidden attribute, hiding out the outside part. If the width is changed to small, the sinking problem is resolved. You can tell that the problem is on this element. After you can change the small margin-left, small width, hidden out of the width of the picture or something, 1.1 points test, tune out the perfect version. (see a colleague before, each width reduces 10来 test, since is the test, reduce 100 is not easier to find the problem?) ）

3. Style Exclusion method

Some complex pages may have loaded n outside the chain of CSS files, then one by one to delete the CSS file, find the specific bug triggered CSS file, narrow the scope of the lock.

For the problem you just locked CSS style file, delete the specific style definition line by row, navigate to the specific trigger style definition, even the specific trigger style properties.

4, the module confirms the method

Sometimes we can also start with the HTML elements of the page. Delete the different HTML modules in the page and find the HTML module that triggers the problem.