At first, some may think that this is not a necessary tool at all, but viewing the entire HTML code of a site is great for finding the necessary elements in the code, these can be links, tags, meta tags, attributes and other elements.

Hotkey combination +open the search window, in the Chrome browser it appears at the top right:

Figure 3. Search by site code

After you enter a request into the search form, the screen will move to the first element found, using the arrows you can move between them and select the one you need:

Figure 4. Search by HTML site code

Instruction 2: how to view and edit the HTML and CSS code of a site in the Google Chrome browser

Now the most important part, in which I will show how you can edit the HTML and CSS code of a website in a browser. then transfer the changes to the browser.

This useful tool is always available in your browser; experiment with other commands that will make it easier for you to edit your site.

The SendPulse service is a marketing tool for creating a subscription base and converting casual visitors to your website into regular ones. SendPulse combines on one platform the most important functions for attracting and retaining customers:
● e-mail newsletters,
● web push,
● SMS mailings,
● SMTP,
● newsletters in Viber,
● sending messages to facebook messenger.

Email newsletters

Sending Push Notifications

SMTP

Facebook Messenger Bots

Sending SMS

Affiliate program

The size and color of some important elements of the blog - such as the title of the blog or post, the more tag, and the like. I searched for the required code manually, experimenting with the test domain, on the basis of which the article was later written.

And recently I needed to change the color of links. Having sifted through a bunch of literature on this issue, I realized a simple thing: everyone gives examples from their own templates, but we all have different templates and it’s good if the code from the example is at least a little similar: without whining, I’ll still find it by searching - using the method poke.

The number did not work with the link code. Everyone pointed completely different paths. I wondered if there was a simple and accurate tool, how to find the required html code on any website. Many bloggers, even with experience, have difficulty in minor modifications to the template. There is nothing wrong with this, because everyone has their own interests and goals for creating a website.

If you want to make small changes to the template, e.g. change any heading, names of articles and sections, color and size of fonts and links, Usually it is enough to learn the simple principle discussed in this article. But there are also complex cases that require either a deeper study of html and css, or the help of a specialist.

One day, an acquaintance asked me to find where to change the color of the category panel in his template. Uploaded a topic to a test subdomain. The settings for this element were not stored in style.css, but in another file, so a person could not find it.

How to find and change the html and css code of a site

If you don't like long articles, this is for you at the end of the article a video tutorial that tells how you can see the website's html code using Notepad++ and make changes to the design of any template using an example of how to change the font color. In the video there are other subtleties of handling a blog. And for those who are closer and more understandable to the text, below is a detailed analysis of the topic with screenshots.
httpv://youtu.be/uIlVvwCt2ho

Terms and concepts

It would be more accurate to title the article “ How to find css code“, but I decided to go with the “wrong” name, because basically the answer to this question is found in html. CSS and HTML are very different things, even though they are two parts of the same system. There are many technical articles on the Internet, here it will be enough for us to understand that:

• HTML— is responsible for the structure of the site (what follows what, in what order, etc.). This is the basis on which the site is created. If we compare it with a house, then this is its layout, the arrangement of rooms.
• CSS— is responsible for the design (what fonts, sizes, colors, etc.). This is the general style of the house and the style of its individual rooms: what kind of wallpaper there will be, lamps, curtains, furniture. Therefore, the document that states css codes, called "style sheet"

And if you are wondering how to change, for example, the color of the site title, the font size in the texts, or the color of the headers in the sidebar, then you need to look for all this in the CSS style sheet. This is the only thing worth understanding first in order to make changes to the code yourself.

I like to make the complex simple. I remember a long time ago, when I had my first car, it was very old, the wiring was rotten, fuses often blew, and every time I towed it to the service station. Imagine how much money was wasted, despite the fact that replacing it yourself, as it turns out, costs pennies.

One day I looked at what exactly the master does. I still don't know how the fuse works. But I know where to change it). I wouldn’t repair the motor myself, and it’s not difficult to replace the fuse. It's the same with websites.

If you don't want to become a programmer, then there is no need to have a deep understanding of programming. It is sufficiently clear to understand what is intended for what, where to look for it and how to change it. It’s better to change what you can yourself, and leave everything else to specialists. The article about has a useful link on this topic.

Do you need to be an expert in everything?

There are often discussions on SEO blogs about whether a beginner needs to have a deep understanding of HTML, or even better, learn how to write websites themselves so that everything is unique.. Well, I don’t know - to each his own, and here what is closer to whom is closer. I’m interested a little more, so I’m now learning more from Vladimir. In November of this year, Vladimir opened his own blog. His blog was made on the simplest, free template, he only slightly modified it to suit himself.

After 10 days of existence, the blog took 104th place in the ranking of all Runet sites with a traffic of about 1.5 thousand people per day. In 10 days. So what's the matter? Vladimir is well versed in HTML and can order and buy himself a unique template. So you must understand that The secret lies not in the templates, but in the usefulness of the information.

Where is the html code hidden?

Sorry for the digression, let's return to our codes). Let's say you want to change the font color of your blog title. Let's look at the example of my test site.

1. Open the site in the Google Chrome browser (if you don’t use it yet, install it - it’s well designed for working with websites, it has a lot of built-in tools).
2. We move the mouse cursor over the element that we are going to change . In this case - the name of the blog. We right-click on it and in the window that appears, select VIEW ELEMENT CODE.

IMPORTANT: do not confuse this with VIEWING THE PAGE CODE! We don't need the whole page now, just a separate element.

Click on it - a code viewing window appears at the bottom of the browser:

The line of code that we are changing is highlighted in red.

But the area highlighted in blue contains what we are looking for. This is where you can find the exact (not approximate) line of code responsible for fonts, color, size, highlighting, etc. This way you can find out ANY code of any element of any template.

Find the desired line in the block highlighted in blue. There is a slider on the right, you can scroll through and find the line you need.

General principle of where to look for things:

Font name - in the FONT FAMILY line

Font size - in the FONT SIZE line

Font color - in the COLOR line

Here are three main lines in which the name, size and font color of any element change. On the right in the style css line the position of the line in the document is given. If you need to change some other element (for example, you need to find out where the line is where you can change the color of the menu bar or the color of links), everything is done exactly the same.

ATTENTION:

The line that we will copy is highlighted in red in the figure,

so that you can later find it in the style sheet.

4. Copy the line. Since in this example we want to change the color of the site name, I copy the line highlighted in the red rectangle in the second picture. In my template, it is responsible for changing the color of the site title:

#header h1 a, #header h1 a:visited (

Find the required line in the file “style sheet (style.css)”. This is already done in the admin panel. I strongly ask that, while there is no confidence and complete understanding, all experiments should be carried out on a test subdomain in order to exclude .

So, go to the admin panel: CONSOLE - APPEARANCE - EDITOR. In the right sidebar we find the file STYLE TABLE (STYLE.CSS), open it.

Now open the search line using the CTRL + F keys: an empty line-window will appear in the top window. We paste into it the line that we copied in step 4.

And you will see how this line will be highlighted in the style sheet (in orange in the picture):

We make a change to the element. In our case, we are changing the font color, so in the COLOR line we substitute another value - the color that we want. In the example, the color is black, its meaning:

You can select a color in any web color palette service: type “Web color palette” in a search engine and select the one you want. We select a color, copy its digital value and carefully replace it with the old one. after which we click UPDATE FILE and go to see what happened.

If the changes are not displayed, for the past hour and go to the page again - this time everything should be displayed.

It takes a long time to describe, but in practice everything is done quickly, especially when the initial skill appears.

In more detail, how to change certain elements:

That's all for today, I won't bother you with codes anymore. I hope that now you yourself can easily find and change any element of the html code, or rather, the css code - may the experts forgive me for simplifying it. And if you don’t figure it out, still visit the page. Don't waste your time on nonsense.

I suggest watching Artem Abramovich’s video on how to search and find any word or element in any theme/template, for any engine (wordpress, joomla, etc.) and replace it with what you need:

Please share if you liked it:

You might also be interested in knowing:

Instructions

Using a browser, go to the site where you want to change the HTML code. To do this, enter the resource address in the address bar of your browser or use one of the Internet search engines.

Open code pages to view. Depending on the browser you are using, you must select the appropriate menu item. In Opera to view the original code and use “View” - “Development Tools” - “Source” code" In Google Chrome, this feature is available in the "Tools" - "View Source" section. code" If you are using Mozilla Firefox, click on the “Menu” key - “Web development” - “Source” code pages." Depending on your browser settings, HTML code will open in a new tab or window.

Edit the displayed code. In Firefox and Chrome, to edit a document, you must first save it to your hard drive (File - Save Page As).

After making all changes, save the page using the “Save” button. The document has been loaded. You can change it yourself using any text editor.

To save a complete copy of the page with all images, go to the resource you need and select the “File” - “Save As” menu. In the window that appears, select the document type “HTML file with images.”

Useful advice

For visual editing of HTML, there are many editors that provide syntax highlighting and automatically substitute missing descriptors. One of the most powerful web developer tools is Macromedia Dreamweaver. As an alternative, there is a lighter Front Page. If you don't need visual debugging and just need underlining and coloring of syntax, you can use the more lightweight but powerful editor Notepad++.

Sources:

• how to change source code

From the answer to the question “What should I call the article?” depends not only on the number of people who read it, but also, without exaggeration, on the reputation of the entire site on which it is posted. After all, each article is a small stroke in the overall picture of the resource, and the combination of many individual strokes creates a unique image of the whole site.

Instructions

It’s better to leave the title for later, when the text itself is ready. When writing, this will allow you not to limit the flight of thought to the framework established by the title. Having the finished text in front of your eyes, it is easier to determine the title that best reflects all the nuances of the article. Re-read the finished text, mentally formulate the essence of the text in several succinct phrases.

Depending on the audience of the site, we select an article template. Obviously, flashy headlines are not suitable for articles, for example, on legal topics. Conversely, a serious headline for a light material will scare away a percentage of potential readers. There are many templates for article titles, for example:

Intriguing question (“Do you know that...?”)

A question starting with the word “how?” (“What should I call the article?”)

Address to the audience (“Only students…”)

Sentence-statement (“Pond at the dacha – peace of mind”)

Offer-guarantee (“Guaranteed method...”)

Incentive to action (“Get a discount...”)

Of course, article headings are not limited to this list of templates.

We create several variants of names based on the selected templates. Then we cut off the unsuccessful ones and leave those that:

Most accurately reflect the essence of the article

Relevant to audience interests

Sources:

• Denis Kaplunov. Free master class on writing headlines
• article title

HTML (HyperText Markup Language) instructions are sent by the web server at the request of the browser of a site page visitor and contain complete information about what and how the browser should show the visitor of this page. Today, these instructions are most often generated by server-side scripts, rather than stored ready-made in files. If the need nevertheless arises to edit the HTML code, and not the scripts that form it, then this can be done using different tools.

Instructions

Use the content management system editor to edit the source HTML code. To do this, after loading the desired one into the editor, you need to switch it from visual mode (which is sometimes called WYSIWYG mode) to HTML editing mode. By doing this, you will get directly to the instructions ("tags") of the markup language. However, using the visual mode, you also change the HTML tags, doing this in the “” page editor.

Use any text editor to make changes to the HTML code of pages if yours does not have a control system installed. The files storing this code differ from ordinary text files only in the extension, and the recording format exactly corresponds to the format of files with the txt extension. Therefore, any text editor that can work with txt files can also be used to edit HTML code.

Install a specialized HTML code editor if you plan to do page layout quite regularly. Such programs differ significantly from ordinary text editors and from editors installed in controls. For example, they have “contextual hint” functions, that is, when you start typing an HTML tag, the editor offers you the most suitable options, which significantly speeds up typing, reduces the number of typos and helps you quickly master the syntax of the language. In addition, such programs can format and color the entered code, look for errors in syntax, and check compliance with established standards. Many specialized applications of this kind have a visual editing and page preview mode, can upload created pages to , synchronize local and remote versions of HTML pages, and much more.

Sources:

• how to edit a website page

It’s not enough to write a good article for the site, you also need to come up with the right one title. It should simultaneously reflect the meaning of the article and ensure that the user can quickly find it in a search engine. To find out which headline will be successful, look at the search engine statistics.

You will need

• - computer
• - Internet access

Instructions

Make the title successful in terms of search engine optimization, let it include keywords. Find out what words and phrases users are looking for in search engines. To do this, view the request statistics. For example, in Yandex this can be done on the wordstat.yandex.ru page. For example, you look at the statistics for the word “money” and see that there were 3,613,993 impressions per month. This means that so many times it appeared in Yandex search results, including different phrases. If you're interested in how many times people searched for the word "money" by itself, type it in quotes and with an exclamation point at the beginning: "!money."

If you have little experience in SEO and website content, promote articles using low-frequency queries. High-frequency ones include, for example, this one: “How to make money.” This phrase was searched many times during the month, and it will be difficult for you to fight the competition, because... you are unlikely to appear in the first pages of the search, not to mention the TOP. At the same time, the phrase “How to make money for an apartment” was typed only 146 times in a month, so if you write about this topic, you will have a good chance of getting a worthy place in the search.

Don't create headlines for queries that are too low in volume. Even if you are in the top for a phrase that you searched for twice in a month, you still won’t get many visitors. But if you think that the topic is promising (for example, it concerns some new gadget), then you can try it. It's also good to use titles that include the keyword or phrase (beginning with it) but are unique.

Make the title of the site interesting. It’s good if it involves solving a problem and is short and concise. Learn to put maximum meaning into a minimum of words. Let the user know that your article contains useful information.

Try to add intrigue to the title, for example by questioning conventional wisdom, playing on contrasts, etc. The words “how”, “why”, “why” also attract attention.

Video on the topic

Useful advice

Make your headlines more specific; if you are writing about a specific phenomenon or brand, mention it. This increases the likelihood that your target audience will reach your web page.

Instructions

When mentioning a site in text located on another resource, use the following construction in HTML: Cat Photography Tutorial. In this case, the site name will be highlighted in color, and in some browsers it will also be underlined. When you move the mouse arrow to it, the address will be displayed in the lower left corner of the browser, and if you click on the link, you will follow it - depending on the browser settings, in the same or another tab.

You can also make sure that, in addition to the name of the site, its URL is also displayed in the text, even when the mouse arrow is not brought to it. To do this, use another construction:

Cat Photography Tutorial: http://site.domain

If you do not want a link to be followed when you click on it, do without using HTML tags at all, for example, like this:

Cat Photography Tutorial: http://site.domain

HTML code is a program code that determines how elements (text, pictures, videos, etc.) will be arranged on an Internet page. The HTML language is quite easy to understand, but it is constantly being improved and supplemented with new features.

What is HTML code?

Markup refers to certain rules and properties that are assigned to page elements. They are implemented in the form of so-called tags. For example, to indicate that certain text on a page should be centered, you can mark it with the center tag. You can see the HTML code of a specific page through its context menu. For example, to access this code in the Firefox browser, you need to right-click within the page and select “Page Source Code”.

How does HTML code work?

What are the types of tags?

HTML Limitations

What attracts the reader's (user's) attention on the page of a printed or online publication?

• Picture


• Heading


• Subtitle


• Signature under the picture or photo

As sad as it is, people don’t want to read, they don’t have time, because they are endlessly in a hurry to get somewhere. But if you are an author (journalist, blogger, freelancer, news writer, writer), you want to convey to the reader your thoughts, conclusions, vision of the problem, etc. How to make sure that the reader does not skip past your note? How to make the title enticing, so that you want to delve deeper into the article?

1. Use verb forms in your titles.

For example: “Where to invest money”, “How to make a home first aid kit”, “Putin’s new decree”.

2. The principle of novelty.

Headlines like “Spring is a time for worries” are morally outdated. Let “bureaucratic” newspapers and magazines use them. The title should convey something new, something that is unknown and that will be revealed in more detail in the text of the note. For example, a better headline would be: “Spring worries will not allow farmers to rest.”

3. Metaphor, imagery, oxymoron, unusualness in the title will give the article a chance to be read. Use sharp comparisons, epithets, and semantic emphases of certain letters. The main thing is not to overdo it with means of expression. Everything should be in moderation.

4. Practicality is important to the reader (user). Titles that are vague, not meaningful, or too general will leave the article without attention. Why should I read the text? What will this give me in practical terms? What will I take away from it? Will this experience be useful to me? If the reader finds answers to these questions at the level of the title, and not the text, then the article will be read.