Skip to content

Marking Numbers for Replacement

Specify the element of the code that contains the needed number to allow Roistat to replace the company number with the tracked number.

Please note:

Number replacement does not work without the Roistat tracking code.

Configuration

  1. Open the web page code and check the value of class or identifier of the element that contains a number. To do it, open your browser and browse the code. The needed element will be highlighted.

  2. If the number is already tagged with some class or identifier (id), copy the name of the class or identifier. A telephone number may have multiple classes. Different classes are divided by spaces.

    For example, Roistat customer service number has two different classes: roistat-phone и tel. You should use the class that belongs to the replacement number.

  3. If the element with the phone number does not have class or identifier, you should add it in the web page code. To do it, add class=“unique class name” or id=“unique title” inside the tag before the telephone number.

    Thus, the phone number code should look as follows:

    <span class="roistat-phone">11231111111</span>

  4. On the Choose website element step in the call tracking script settings, open the CSS Selector tab and specify the class or identifier in the CSS class or ID name field. Then press Enter or Space, and the specified text will be displayed as the attribute name.

    You should enter the # symbol before the identifier name. Class names may be specified with a dot or without it. You can specify several classes or identifiers.

  5. You can also add the telephone number of your website and CSS-Selector on step 3. Phone number and CSS-Selector will be replaced.

If you need to add the replacement to the web-link, use the following code:

<a href="tel:11231111111" class="roistat-phone-tel"><span class="roistat-phone-tel">11231111111</span></a>

Please note:

  • A web page may contain an identifier for only one element. Thus, if you specify the identifier for two phone numbers, Roistat will replace only the first of two numbers. If you want to replace more than one number, specify the class instead of the identifier.

  • If you specify the same class or identifier for a replacement number in several scripts and activate these scripts, Roistat call tracking won't work correctly. Specify the unique class or identifier for replacement numbers in each script.

Processing the Phone Number on the Website

By default, the phone number on your website is replaced by the number you specified in the script in the following format: +х(ххх) ххх-хх-хх.

You can change the format of the number in one of two ways:

  1. On step 3 In the Format of replacement number field.

  2. In the website code.

    If you use this way of configuration, the settings of the telephone number mask have the second priority in the call tracking script. So, if the telephone number mask is configured in code and in script, Roistat uses the configuration from the code.

    There are 3 classes for configuration of the format in the website code:

    • {name of the class specified in the call tracking script}-country, for example roistat-phone-country. This class defines the country code in the telephone number.
    • {name of the class specified in the call tracking script}-region, for example roistat-phone-region. This class defines the region code in the telephone number.
    • {name of the class specified in the call tracking script}-number, for example roistat-phone-number. This class defines the format of the telephone number.

Please note:

If you specified an identifier as the element with the phone number, the configuration of phone mask via classes is unavailable.

For example, to remove the + symbol from the mask, use the following code:

<span><span class="roistat-phone-country">1</span>(<span class="roistat-phone-region">123</span>)</span><span class="roistat-phone-number">123-45-67</span>

If you want the phone number to be displayed without city code and country code, specify only the roistat-phone-number class.

If you want to add the active web-link to the replaced number and change the phone number in the web-link and on the website page at the same time, use the following code:

<a href="tel:11231111111" class="roistat-phone-tel"><span class="roistat-phone-country">1</span>(<span class="roistat-phone-region">123</span>)<span class="roistat-phone-number">111-11-11</span></a>