How To Edit A Wordpress Template

Table of contents:

How To Edit A Wordpress Template
How To Edit A Wordpress Template

Video: How To Edit A Wordpress Template

Video: How To Edit A Wordpress Template
Video: How to Customize Your WordPress Theme 2024, May
Anonim

If you have a site on the Wordpress platform, you probably know that the template on your blog can be changed indefinitely, because there is no limit to perfection. This platform has become a quickly learned tool for the webmaster, especially since the skin can be edited using conventional programs.

How to edit a Wordpress template
How to edit a Wordpress template

Necessary

  • Software:
  • - Internet browser Firefox;
  • - addon Firebug.

Instructions

Step 1

Many webmasters say that the ideal browser for surfing and site building is a product from Mozilla. Firefox is perhaps the only program that supports so many applications and add-ons. To edit templates on any platform, you need the Firebug add-on, which allows you to display and edit any template parameters on site.

Step 2

To install it, you need to click the top menu "Tools" of the browser and select the item "Add-ons" or press the key combination Ctrl + Shift + A. In the window that opens, do not wait for the download of recommended applications for Firefox, you should put the cursor in the field with the text "Search among available add-ons”and introduce Firebug.

Step 3

In the list of search results, click the button opposite the Firebug item. After downloading this add-on, the Restart Now button will become active. Click it to apply the changes. If for some reason this application does not appear in the search results, go to the official Mozilla website and install Firebug from the following link

Step 4

After installing this add-on, a small icon with a beetle image will appear at the bottom of the browser window, click on it - the add-on will become active. For example, you want to change the display of links on the home page of your site, to find the code for this element in the "bug" window, which is divided into 2 parts, you must alternately select Html and Style. Now html-code will be displayed in one part of the window, in another part the code from style.css files will be visible.

Step 5

In the html block, navigate through the file, periodically clicking the blocks, you will see that after clicking on one of the blocks in the "bug", a selection of the same block will appear on the page. This way it is quite easy to find an editable element that you don't know the code for.

Step 6

After you have found the desired block of code, move the cursor to the adjacent window (Style). Here you will see all the display options for a given block, for example, font size is nothing more than the font-size element. If you want to increase it, add a few units to the already existing value. Please note that you only need to change the number, the px abbreviation should not be touched (pixel designation).

Step 7

In the same block, pay attention to all the elements, among them there may be padding, margion, etc. To understand the names of elements unfamiliar to you, it is recommended to use a specialized online command reference - https://htmlbook.ru. Follow this link, in the upper right corner there is a "Site Search" field. Enter the command you are looking for and press the Enter key.

Step 8

You will see variations of this element in the search results. For example, you're wondering what the margin element means. Enter this word in the search field and press Enter. From the search results, select the first CSS link - margin. After following this link, you will be able to familiarize yourself with this command and learn all about its application.

Recommended: