Content managers like WordPress allow you to Buy USA YouTube Likes do almost everything very easily without the need to know web code, but sometimes it is interesting to be able to do very specific things with your template to go a bit further in terms of personalizing the topic and achieving a result even better than what a priori you could achieve. I’ll tell you in this post!
If you go to your website and click on the right button and then see the source code of the page, what you will see is the HTML and CSS code with which your site is built. These codes are created automatically by your CMS so that your website can be viewed on the internet. If you work with a content manager you do not have to implement them manually, but knowing them a bit can make real wonders.
Premium templates usually have a wide section of options to easily modify almost all elements of your website, such as colors, backgrounds, font styles, etc. But, what if there are elements and zones of the template that you can not modify because they are not included in the options?
Neuronas espejo Copywriting Learn how to modify your template and do everything you want on your website
Combining the good management of your template with the knowledge of basic codes for websites allows you to make fully professional pages without any limitation. And you will be able to do it in a fairly fast and easy way.
In this article I’m not going to teach you how to be an expert in web code, but I’m going to try to explain in an entertaining way how to know the basics and then, when you have learned the necessary, I will give you a list of tricks with code so that You can do things like:
Remove the publication date of your posts
Make disappear any element of your page
Change colors and sizes to fonts, buttons, backgrounds
Add code in your widgets
Change margins or spaces between elements
Customize 100% the responsive behavior of your template according to devices
Add banners with HTML
8 38What is CSS and what is it for?
CSS is a code that works with HTML and is used to modify everything related to style, ie colors, fonts, sizes, etc.
For example, using a CSS rule I can redefine the style of all h1 tags (titles 1 of my website) so that from now on they have a size of 36 pixels, black color and Open Sans typography. The way to do it would be by placing the following code in the CSS style sheet:
h1 {
font-size: 36px;
color: # 000;
font-family: ‘Open Sans’;
}
With CSS you can also make disappear the elements of your template that you want to remove by entering a simple line of code. You’ll see it in this post a little later.
In addition, with CSS you can fully customize the responsive behavior of your template, that is, see what you want on each device.
4 35 What is HTML and what is it for?
In broad strokes we can say that HTML is a code used to create the basic structure of a website, header, content, footer, sidebars, etc. It works through predefined labels to which you can modify their styles using CSS.
Therefore, it could be said that the CSS code is used to modify and customize the HTML.
Learning HTML and CSS is not difficult, with a little practice and using logic you will be able to convert a basic template into a professional website, even though your template does not include many customization options.
Pay close attention to the initial explanation in which I will teach you to select the elements of your web and then modify them in your style sheet.
8 26CSS basic concepts
What is a selector and types
A selector is the name that has a certain element within the code of your website. Knowing the name of the selector you can modify that particular element at your whim. There are two types of selectors: identifiers and classes.
– An identifier is the name of a specific element that is repeated only once in the entire web. It is a unique name, and by applying a modification you will only modify this element. The identifiers are defined in the CSS style sheet with # (pad), and inside the HTML are written like this: id = “name of the identifier”.
– A class is the name of a rule that is repeated in several places on your website. For example, you can have a class called. Black that you can apply to both texts and buttons so that they get this color. That is, you define a generic style that you can apply to any element as many times as you want. Classes are defined in CSS with a. (period) and within the HTML code are applied like this: class = “name of the class”.
The name of the selectors is determined by the developer of the template, that is, they are arbitrary names chosen by the creator of the theme, although they often have a certain logic. For example, classes for buttons are usually called .button, the identifier of the web header is usually called #header.
