Fast Yandex Metrika

Phone

In the drop-down list, select "Phone (WhatsApp)".
Enter the name of the goal. For example: phone.
Enter the CSS selector in the format: tel:7XXXXXXXXXX.

<a href="tel:7XXXXXXXXXX">+7 (XXX) XXX-XX-XX</a>

In the drop-down list, select "Phone (WhatsApp)".
Enter the name of the goal. For example: whatsapp.
Write the CSS selector in the format: https://wa.me/7XXXXXXXXXX.

<a href="https://wa.me/7XXXXXXXXXX">+7 (XXX) XXX-XX-XX</a>

If your WhatsApp link looks like "https://wa.me/7XXXXXXXXXX?text=Text&source=&data=", in the goal settings, specify "https://wa.me/7XXXXXXXXXX". The script will still find the desired link on the page.

Form

In the drop-down list, select "Form".
Enter the name of the goal. For example: form.
Write the CSS selector in the format: #id_form or .class-form.

<form id="id_form" class="class-form" ... >...</form>

Button

Select "Button" from the drop-down list.
Enter the name of the goal. For example: button.
Enter the CSS selector in the format: #id_button or .class_button.

<button id="id_button" class="class-button">...</button>

Link

In the drop-down list, select "Link".
Enter the name of the goal. For example: links.
Write the CSS selector in the format: https://example.com/path/sub/?param=value&param1=value.

<a href="https://example.com/path/sub/?param=value&param1=value">example.com</a>

The link can be as full as "https://example.com/path/sub/?param=value&param1=value", and short "https://example.com/path/sub/", the script will still find it on the page. As GET parameters, the Cyrillic alphabet is not allowed.

HTML tag

Allows you to set complex CSS selectors: header .contacts > div:nth-child(3) a[href= "tel:7XXXXXXXXXX"].
How to differentiate clicks on the phone (header, footer, sidebar, content)?
Header

Select "HTML tag" from the drop-down list.
Enter the name of the goal. For example: header_phone.
Write the CSS selector in the format: header a[href= "tel:7XXXXXXXXXX "].

<header> ... <a href="tel:7XXXXXXXXXX">+7 (XXX) XXX-XX-XX</a> ... </headre>

Footer

Select "HTML tag" from the drop-down list.
Enter the name of the goal. For example: footer_phone.
Write the CSS selector in the format: footer a[href= "tel:7XXXXXXXXXX "].

<footer> ... <a href="tel:7XXXXXXXXXX">+7 (XXX) XXX-XX-XX</a> ... </footer>

Sidebar

Select "HTML tag" from the drop-down list.
Enter the name of the goal. For example: sidebar_phone.
Write the CSS selector in the format: aside a[href= "tel:7XXXXXXXXXX "].

<aside> ... <a href="tel:7XXXXXXXXXX">+7 (XXX) XXX-XX-XX</a> ... </aside>

Content

Select "HTML tag" from the drop-down list.
Enter the name of the goal. For example: article_phone.
Write the CSS selector in the format: article a[href= "tel:7XXXXXXXXXX "].

<article> ... <a href="tel:7XXXXXXXXXX">+7 (XXX) XXX-XX-XX</a> ... </article>

There can be many variations, and you don't have to link to header, footer, aside, or article. You can use .class or #id, as long as the selector belongs to the parent element of the HTML markup.

.content a[href="tel:7XXXXXXXXXX"]

<div class="content"> ... <a href="tel:7XXXXXXXXXX">+7 (XXX) XXX-XX-XX</a> ... </div>
How to track clicks on the order buttons in the price list?
Table

Select "HTML tag" from the drop-down list.
Enter the name of the goal. For example: order_table.
Write the CSS selector in the format: table button.

<table> ... <button>Order</button> ... </table>

Block layout

Select "HTML tag" from the drop-down list.
Enter the name of the goal. For example: order_price.
Enter the CSS selector in the format: .price a.order.

<div class="price"> ... <a class="order">Order</a> ... </div>