Artikel tersebut akan mempertimbangkan salah satu opsi yang memungkinkan untuk menerapkan pelacakan panggilan di situs. Materi ini ditulis semata-mata untuk tujuan pendidikan dan tidak membawa tujuan untuk mengganti layanan khusus yang ada yang menyediakan layanan calltracking.
Persyaratan Fungsional
- Layanan harus menyediakan kemampuan untuk mengganti angka (angka) dengan sumber transisi ke situs - transisi dari mesin pencari, transisi ke iklan, lewatnya tautan dengan tag utm.
- Layanan harus memperbaiki nomor yang ditampilkan kepada pengunjung situs dan menampilkan nomor ini pada kunjungan selanjutnya.
- Saat memulai panggilan ke nomor yang ditampilkan, layanan harus memulai pembuatan acara di Google Analytics.
Mekanika umum
Ketika Anda pergi ke situs, kami menentukan sumber transisi, dan kemudian memeriksa apakah nomor tersebut diberikan kepada pengunjung ini. Jika seorang pengunjung pertama kali mengunjungi situs tersebut, maka kami memberinya pengenal unik, setelah itu kami memberinya nomor dari kumpulan angka yang terkait dengan sumber rujukan ini. Di masa mendatang, ketika pengunjung kembali ke situs, kami menampilkan nomor yang diberikan kepadanya sebelumnya.
Saya ingin fokus pada log panggilan. Mengganti nomor, menetapkannya ke pengguna adalah masalah teknis, yang utama adalah untuk dapat membandingkan panggilan tertentu dan nomor yang saat ini ditetapkan untuk pengguna. Jika telepon yang Anda gunakan memungkinkan Anda untuk terus menerima detail tentang panggilan yang sedang berlangsung, maka mengetahui saat panggilan ke nomor tertentu dan memiliki informasi tentang nomor yang ditampilkan pada saat itu di situs web pengguna mana, dimungkinkan untuk memulai pembuatan acara di Google Analytics dan mengaitkannya dengan ROK.
Struktur
- ct-server.ru - skrip layanan web yang dapat dieksekusi akan ditempatkan di sini, database untuk menyimpan pengaturan ruang dan mencatat pengunjung;
- refer-to-site-with-ct-code.ru - di situs ini kami akan meniru transisi dari jaringan pencarian;
- site-with-ct-code.ru - situs di mana skrip substitusi nomor akan ditempatkan.
Mari kita mulai
Contoh di bawah ini akan diterapkan di server lokal.
Buat situs host
virtual-dengan-ct-code.ru , di mana kami meletakkan file
index.html dari konten berikut.
<!DOCTYPE HTML> <html> <head> <meta charset='utf-8'> <title>CT</title> <script src="http://ct-server.ru/script.js"></script> <script> </script> </head> <body> <p id='calltracking'>79000000000</p> </body> </html>
Seperti yang Anda lihat dari contoh, kami menghubungkan skrip eksternal
ct-server.ru/script.js , yang akan "berkomunikasi" antara
situs-with-ct-code.ru dan
ct-server.ru , serta berinteraksi dengan pohon DOM situs
situs-dengan-ct-code.ru . Nomor akan diganti oleh id elemen - 'calltracking'.
Sekarang buat
referensi- ke- situs-dengan-ct-code.ru , yang akan berisi tautan ke situs-dengan-ct-code.ru untuk kemampuan memeriksa nomor pin pada transisi dari pengarah.
<!DOCTYPE HTML> <html> <head> <meta charset='utf-8'> <title>CT</title> </head> <body> <a href="http://site-with-ct-code.ru"></a> </body> </html>
Setelah itu, kami akan menaikkan host
ct-server.ru , yang akan memiliki struktur sebagai berikut:
index.php - file skrip yang dapat dieksekusi yang akan menerima permintaan-posting dari situs-dengan-ct-code.ru dan berinteraksi dengan database;
script.js - file skrip yang akan terhubung di situs tempat penggantian nomor akan dilakukan.
Basis data
Kita perlu membuat dua piring. Dalam tabel
ct kita akan menyimpan angka dan pengaturan untuk tampilan mereka, dalam tabel
angka kita akan mencatat tampilan angka.
CREATE TABLE `ct` ( `id` int(11) NOT NULL, `phone` varchar(200) NOT NULL, `refer` varchar(200) NOT NULL, `utm` varchar(200) NOT NULL, `host` varchar(200) NOT NULL, `ga` varchar(200) NOT NULL, `login` varchar(200) NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=utf8; ALTER TABLE `ct` ADD PRIMARY KEY (`id`), ADD UNIQUE KEY `id` (`id`); ALTER TABLE `ct` MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=1;
Penjelasan kecil dari bidang yang ditambahkan:
telepon - nomor telepon pengganti;
merujuk - sumber transisi;
utm - tautan ke halaman tempat penggantian nomor harus dilakukan;
host - situs tempat skrip substitusi angka berada;
ga - id dari penghitung Google Analytics;
login - login pemilik nomor.
Isi piring dengan data.
INSERT INTO `ct` (`id`, `phone`, `refer`, `utm`, `host`, `ga`, `login`) VALUES (2, '78000000001', '', 'http://site-with-ct-code.ru/?utm_medium=cpc', 'http://site-with-ct-code.ru', 'UA-12345678-1', ''), (3, '78000000002', 'http://refer-to-site-with-ct-code.ru/', 'http://site-with-ct-code.ru/', 'http://site-with-ct-code.ru', 'UA-12345678-1', ''), (4, '78000000003', 'http://refer-to-site-with-ct-code.ru/', 'http://site-with-ct-code.ru/', 'http://site-with-ct-code.ru', 'UA-12345678-1', ''), (5, '78000000004', 'http://refer-to-site-with-ct-code.ru/', 'http://site-with-ct-code.ru/', 'http://site-with-ct-code.ru', 'UA-12345678-1', ''), (6, '78000000005', '', 'http://site-with-ct-code.ru/', 'http://site-with-ct-code.ru', 'UA-12345678-1', '');
Sekarang buat plat angka.
CREATE TABLE `numbers` ( `id` int(11) NOT NULL, `phone` varchar(200) DEFAULT NULL, `ct_user` varchar(200) DEFAULT NULL, `refer` varchar(200) DEFAULT NULL, `gid` varchar(200) DEFAULT NULL, `page` varchar(200) DEFAULT NULL, `time` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP ) ENGINE=InnoDB DEFAULT CHARSET=utf8; ALTER TABLE `numbers` ADD PRIMARY KEY (`id`), ADD UNIQUE KEY `id` (`id`), ALTER TABLE `numbers` MODIFY `id` int(11) NOT NULL AUTO_INCREMENT;COMMIT;
Di piring ini kami akan mencatat pengunjung mana, nomor mana dan pada titik waktu berapa ditampilkan di situs. Di masa mendatang, data ini dapat dibandingkan dengan log panggilan untuk memulai tindakan target - mengirim acara ke Google Analytics, membuat arahan dalam CRM, mengirim email, dll.
telepon - nomor telepon;
ct_user - id pengunjung;
merujuk - sumber transisi;
gid - cookie Google Analytics
halaman - halaman tempat nomor ditampilkan;
waktu - jumlah waktu tampilan.
Buat penangan permintaan
Interaksi antara layanan web ct-server.ru dan situs yang menampung skrip akan dilakukan melalui permintaan POST lintas-domain XHR (XMLHttpRequest).
Mari kita buka file
ct-server.ru/index.php yang dibuat sebelumnya dan tambahkan cek untuk menerima data dari host yang diizinkan, dalam kasus kami ini adalah
site-with-ct-code.ru ,
situs-with-ct-code2.ru dan
situs-dengan -ct-code3.ru .
<?php if (isset($_SERVER["HTTP_ORIGIN"]) === true) { $host = $_SERVER["HTTP_ORIGIN"];
Kami menulis dalam nilai variabel dari permintaan POST yang datang dari situs-dengan-ct-code.ru
$phone = $_POST["phone"]; $ct_user = $_POST["ct_user"]; $gid = $_POST["gid"]; $refer = $_POST["ref"]; $page = $_POST["page"];
Cook _ga memiliki bentuk _ga = GA1.2.1212121212.121212121212, kami akan membawanya ke bentuk "1212121212.12121212121212".
if ($gid) { $pos = strpos($gid, '.', strpos($gid, '.') + 1); $gid = substr($gid, $pos + 1); }
Kami akan membuat koneksi ke database tempat kami sebelumnya membuat tabel kami.
$conn = new mysqli("localhost", "root", "", "calltracking"); if ($conn->connect_error) { die("Connection failed: " . $conn->connect_error); }
Interaksi dengan layanan web akan melalui dua metode -
get_num_first dan
get_num .
Metode
get_num_first dipanggil ketika pengunjung pertama kali berinteraksi dengan situs untuk mendapatkan nomor dengan memilih dari database sesuai dengan kriteria - mail, referrer, utm, host. Jika hasil seleksi mengembalikan nilai, maka kami menampilkan nomor telepon.
Selain itu, kami mengirim acara ke Google Analytics melalui
Protokol Pengukuran Google . Metode yang sama berlaku untuk melacak tindakan offline, di masa depan dapat digunakan saat membandingkan log panggilan dan nomor log dalam tabel angka.
if ($_POST['method'] == 'get_num_first') { $sql = "SELECT * FROM `ct` where `host` = '" . $host . "' and `refer` = '" . $refer . "' and `utm` = '" . $page . "' ORDER BY RAND() LIMIT 1 "; $result = $conn->query($sql); if ($result->num_rows > 0) { while ($row = $result->fetch_assoc()) { print_r($row["phone"]); $event = file_get_contents('https://www.google-analytics.com/collect?v=1&tid=UA-12345678-1&cid=' . $gid . '&t=event&ec=GetNumber&ea=number&z=' . $row["phone"] . ''); } } else {
Metode
get_num diperlukan untuk
mencatat entri dalam tabel angka.
else if ($_POST['method'] == 'get_num') { $sql = "INSERT INTO `numbers` (`phone`, `ct_user`, `gid`, `refer`,`page`) VALUES ( '" . $phone . "', '" . $ct_user . "', '" . $gid . "', '" . $refer . "', '" . $page . "');"; $result = $conn->query($sql); $sql = "SELECT * FROM `numbers` where `ct_user` = '" . $ct_user . "' ORDER BY `id` DESC LIMIT 1 "; $result = $conn->query($sql); if ($result->num_rows > 0) { while ($row = $result->fetch_assoc()) { print_r($row["phone"]); $event = file_get_contents('https://www.google-analytics.com/collect?v=1&tid=UA-12345678-1&cid=' . $gid . '&t=event&ec=ShowNumber&ea=number&z=' . $row["phone"] . ''); } } else {
Skrip pengganti angka
Selanjutnya, kita akan beralih ke skrip
ct-server.ru/script.js , yang kita sambungkan di situs-with-ct-code.ru
Untuk memulai, mari kita buat dua fungsi -
setcookie untuk membuat dan
getcookie untuk membaca cookie. Kami akan menggunakannya untuk merekam dan mendapatkan id cookie dari pengguna dan nomor telepon.
Setelah itu, tambahkan fungsi
makeid untuk menghasilkan id untuk pengguna.
Sekarang mari kita membuat fungsi untuk menghasilkan cookie yang berisi id pengguna 33 digit.
Cookie
ct_user yang dihasilkan disimpan selama 1 jam.
Kami melanjutkan untuk menghasilkan permintaan nomor melalui metode
get_num_first . Nomor yang dihasilkan dari ct-server.ru ditulis ke dalam cookie selama 1 jam dan kami melakukan substitusi pertama nomor pada halaman dengan id elemen.
Kami akan membuat fungsi yang secara berkala akan mengirimkan ke sisi ct-server.ru nilai-nilai nomor yang ditampilkan, id pengguna, alamat halaman, nilai cookie analitik google, sumber rujukan.
function getNumberPeriodically() { var method = "get_num"; var ct_user = getcookie("ct_user"); var phone = getcookie("phone"); var gid = getcookie("_ga"); var ref = document.referrer; var page = document.location.href; var host = window.location.origin; var xhr = new XMLHttpRequest(); var body = "&method=" + encodeURIComponent(method) + "&page=" + encodeURIComponent(page) + "&ct_user=" + encodeURIComponent(ct_user) + "&ref=" + encodeURIComponent(ref) + "&host=" + encodeURIComponent(host) + "&phone=" + encodeURIComponent(phone) + "&gid=" + encodeURIComponent(gid); xhr.open("POST", "http://ct-server.ru", true); xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xhr.withCredentials = true; xhr.send(body); xhr.onreadystatechange = function() {
Pada akhirnya, kami menambahkan fungsi sendToCalltracking, yang memeriksa keberadaan nomor telepon cookie dan id pengguna.
function sendToCalltracking() { var ggg = getcookie("ct_user"); var ccc = getcookie("phone"); var gac = getcookie("_ga"); if ( typeof ggg === "undefined" || ggg === null || ccc === "undefined" || ccc === null || ccc.length < 1 || ggg.length < 1 || ccc === "" || ggg === "" ) {
Di bagian paling awal dari skrip, kita memanggil timer fungsi kita.
var myTimer = setTimeout(sendToCalltracking, 500);
Jika cookie dihapus selama operasi berikutnya, fungsi akan menetapkan cookie baru kepada pengunjung sesuai dengan seleksi yang diterima oleh host dan sumber. Selain itu, dimungkinkan untuk menulis nilai yang diterima ke browser Penyimpanan lokal.
Sekali semenit, skrip akan mengirimkan nilai nomor cookie dan id pengguna yang menunjukkan halaman penerapannya tanpa memuat ulang. Dapat dipahami bahwa skrip akan ditempatkan pada semua halaman domain.
Pada artikel selanjutnya, kita akan membahas pengembangan antarmuka sederhana untuk menambah dan mengonfigurasi angka.