Useful Tips

View page source Template: Contact wikiHow


More than once it was necessary to make sure that different pages displayed different content in situations where the CMS functionality did not allow this.

For example, to display different text in the footer during page-by-page navigation, or to prevent the widget block in the sidebar from appearing on a certain page, or to have one slider on one page in the template header and another slider on the other page. In such situations, simple php code can help. I decided to publish it as a record, since it’s easier for me to see this note than to remember the variable responsible for url pages each time.

The following php code shows an example of how to display one slider of the metaslider plugin on the page / contacts /, and on all other pages another slider of the metaslider plugin:

How to view page code?

To view the source code of a website page, you need to move the mouse cursor over any area of ​​the web page (excluding images and links). After that, click on the right mouse button. A window opens with several options (in different browsers they may vary slightly). In the Google Chrome browser, for example, these are the commands:

  • back
  • forward,
  • reload
  • save as,
  • print
  • translate to Russian,
  • view page code,
  • view code.

We need to click on view page code, and we will see the html code of the site page.

View page code: what to look for?

So, the HTML code of the page is a numbered list of lines, each of which carries information about how this site is made. To quickly learn to understand this huge number of characters and special characters, you need to distinguish between different parts of the code.

For example, the lines of code inside the head tag contain information for search engines and webmasters. They are not displayed on the site. Here you can see what keywords this page is promoting, how its title and description are written. You can also find a link here, clicking on which we learn about the google family of fonts used on the site.

If the site is made on CMS WordPress or Joomla, then it will also be visible here. For example, this area displays information about a WordPress theme or Joomla website template. You can see it by reading the contents of the links highlighted in blue. One link shows the site template.

This link shows that the site is based on WordPress. This is indicated by the letters wp-content and the name of the theme of the site. Following the link:

We will see CSS font styles for the page. In this case, the font is used. It can be seen here - font-family: ‘Source Sans Pro’.

This site is optimized using the seo-plugin Yoast SEO. This can be seen from this commented out piece of code:

This site is optimized with the Yoast SEO plugin v3.4.2 -

All information inside the body tag is displayed by the browser on the monitor screen. Here we see the html code of the page, and at the very bottom is the Yandex metric script code. It is clothed with a commented tag with text:

To summarize

Having done a rather superficial analysis of the code on the main page of the site, we can conclude with what tools this page was made. We saw on it:

  • CMS WordPress,
  • Google font Source Sans Pro,
  • WordPress Theme - Sydney,
  • Yoast plugins
  • Yandex metric counter.

Now, the principle of analyzing the html code of the site page is quite clear. It is not necessary to keep the page under investigation open in a browser. You can save the page code to your computer using the keyboard shortcuts ctrl + a, ctrl + c, ctrl + v. Paste it into any text editor (preferably Notepad ++) and save it with the html extension. Thus, at any time you can study it deeper and find more useful information for yourself.