How to Edit a WordPress Template

This article is about how to change various elements and transform the appearance of a blog without any special knowledge of HTML and CSS.

Immediately I want to say that now many of the themes that are released in recent years, have their own settings in the admin area of the site itself. And here there is an opportunity in the tab “Appearance”, to change settings in the graphical editor of appearance.

But what if those settings do not exist or they do not suit you for some reason, but the theme of the template is very like and well suited. So how to make some adjustments?

Now let’s try to understand this topic and learn how to change some of the styles.
How to edit a wordpress template – let’s start with the easiest

Let’s start with the simplest things. We go to our blog and look. For example, we want to change the width of the text box under the content. Increase it by narrowing down the area of the right sitebar (the right column) a little bit.

To do this is very easy. Right-click on the area you want to change, in our case, it is now a website bar, and choose View Element Code from the drop-down menu.

Do it preferably in the browser Google Chrome, other browsers also support this function, but I’m used to doing it in Chrome.

At the bottom of an additional window will appear full-width screen, where we can see the code of the page and the individual element, as well as all the CSS styles to a specific area or an element.

You can also make some changes beforehand and see the result right there in your browser, which is pretty handy.

Still we can immediately find out where we need to tweak already in the template to make changes take effect.

When you hover your mouse over a line (the left area), you see at the top that a certain element or area of the pattern is highlighted. This means that this line of code is responsible for just that highlighted part in our template.

So we find the element we want to change and left-click on the line with the code of that element.

Then we can look at its style on the right and try to make some changes right away. Then, when we did what we wanted and saw the desired result, we go to the admin panel of the blog and edit the CSS style file. Save it, go to the blog, refresh the page and see that the changes took effect.

Thus, you can find any element in the template, change it, find out the exact name for the adjustment in the main template file.