Меню

Клик по картинке счетчик



Клик по картинке счетчик

Здесь могла бы быть ваша реклама

Покинул форум
Сообщений всего: 4574
Дата рег-ции: Июль 2006
Откуда: Israel

Секрет
Теперь, когда вы уже наверняка второпях отправили свой запрос,
я расскажу вам простой секрет, который сэкономит вам уйму ожиданий,
даже если первый ответ по теме последуем сразу же.

Само собой я знаю что ответят мне тут же, и если я посмотрю
на сообщения на форуме, то пойму что в общем то я и не ошибаюсь.
Но еще я точно замечу, что очень мало тем, в которых всего два ответа :
вопрос автора и еще два сообщение вида Ответ + Спасибо

После этого приходится начинать уточнять этим неграмотным что мне надо.
Они что, сами читать не умеют? А уточнять приходится.
И иногда пока они переварят то что я им скажу проходит и не одна ночь..

Уверен что если бы я им сказал что у меня есть
фиолетовый квадрат, и нужно превратить его в синий треугольник
и я пытался взять кисточку, макнуть в банку и поводить ей по квадрату
но почему то кисточка не принимала цвет краски в банке,
то на мой вопрос — где взять правильные банки мне бы ответили гораздо быстрее
предложив её открыть, а не тратить еще стольник на жестянку.

Поэтому с тех пор я строю свои вопросы по проверенной давным давно схеме:
Что есть
Что нужно получить
Как я пытался
Почему или что у меня не получилось.

На последок как оно происходит на форумах

Новичок: Подскажите пожалуста самый крепкий сорт дерева! Весь инет перерыл, поиском пользовался!
Старожил: Объясни, зачем тебе понадобилось дерево? Сейчас оно в строительстве практически не используется.
Новичок: Я небоскрёб собираюсь строить. Хочу узнать, из какого дерева делать перекрытия между этажами!
Старожил: Какое дерево? Ты вообще соображаешь, что говоришь?
Новичок: Чем мне нравиться этот форум — из двух ответов ниодного конкретного. Одни вопросы неподелу!
Старожил: Не нравится — тебя здесь никто не держит. Но если ты не соображаешь, что из дерева небоскрёбы не строят, то лучше бы тебе сначала школу закончить.
Новичок: Не знаите — лучше молчите! У меня дедушка в деревянном доме живёт! У НЕГО НИЧЕГО НЕ ЛОМАЕТСЯ.
Но у него дом из сосны, а я понимаю, что для небоскрёба нужно дерево прочнее! Поэтому и спрашиваю. А от вас нормального ответа недождёшся.
Прохожий: Самое крепкое дерево — дуб. Вот тебе технология вымачивания дуба в солёной воде, она придаёт дубу особую прочность:
Новичок: Спасибо, братан! То что нужно.

Отредактировано модератором: Uchkuma, 26 Апреля, 2011 — 10:21:12

Источник

jQuery Счётчик кликов

На этой тестовой странице сайта проверяю интересную возможность использования jQuery для подсчёта кликов и, что особенно интересно, по каждой из тестовых кнопок отдельно !

Работу управляющего скрипта и ядра jQuery показываю сразу. Подробности о создании — под рисунками мотоциклов.

Пример работы счётчика

Работу скрипта счётчика можно увидеть сразу, если кликнуть по любой из трёх тестовых кнопок.

А здесь счётчик кликов выводит результат.

Для повторного просмотра работы скрипта счётчика, страницу нужно перезагрузить.

Создание счётчика кликов

Сначала создал в HTML-коде три кнопки с разным текстом, на которых и проверяется работа кода счётчика.

После подключил библиотеку jQuery отдельным файлом, и прописал JavaScript-код внутри кода этой страницы, который и считает сделанные клики.
Prim* Этот, написанный, JavaScript-код в отдельный файл НЕ ВЫРЕЗАТЬ! Перестанет работать!

Настройка размера, жирности и цвета цифр и рамок у полей вывода результатов производится атрибутом «style» в блоке вывода у каждого из тэгов «span» HTML-кода этой страницы.

Если в управляющем коде вместо строки: $(‘.counter’).eq($(this).index()).text($(this).data(‘counter’)); которая прописана сейчас, прописать другую, попроще, то результат кликов будет выводится уже по-другому!

Читайте также:  Передать показания счетчиков трехгорка

Если, вместо показанной выше строчки кода, написать такую: alert($(this).data(‘counter’)); тогда результат кликов будет выводиться во всплывающем окне. Тоже неплохо!
Однако, пользователю будет не особо ясно, результат кликов по какой именно(?!) кнопке оно показывает.

* Обе строчки скрипта срабатывают ПРАВИЛЬНО! *
Но всё же вариант, использованный в управляющем коде сейчас, гораздо лучше. Понятнее!

Естественно, что таким способом можно создать счётчики кликов для любых веб-элементов, а не только для тестовых кнопок, как я сделал на этой странице тестового сайта.

Использование счётчика

В данном примере созданный счётчик кликов является интересным способом использования jQuery. Кроме того, с его помощью можно проверить работу написанного для него скрипта. Зачем проверять?!

А затем, чтобы не было сложностей при его практическом использовании. Тем более что практическое использование счётчика требует уже несколько иного подхода.

Для практического использования счётчика кликов, чтобы получать данные о том, что именно заинтересовало посетителя сайта, сколько раз он кликнул по тому или иному элементу веб-страницы, нужно применять уже более сложную технологию. И подобная технология существует!

Это совместное использование двух языков программирования: «PHP и JavaScript» (откроется в новом окне) .

Все права защищены. Copyright © 2009 — Коротеев Владимир.

Источник

Cтатистика кликов | PHP

Простой скрипт сбора статистики нажатий на ссылку, кнопку или другой элемент

С помощью скрипта я приняла решение, что на «Шпаргалке блоггера» не нужна кнопка перевода на Английский, поскольку все нажавшие её предпочитают русский язык. Так начиналась моя таблица (под вопросительные знаки убрано часть инфо):

URL

Предыдущий URL

title

Дата и время

Ширина экрана

Язык

IP

Браузер

http://shpargalkablog.ru/2012/05/kak-nayti-procent-ot-chisla.html?m=1

Как найти процент от числа — Примеры

13.10.2015 18:56

320

ru-RU,ru;q=0.8,en-US;q=0.6,en;q=0.4

.

.

http://shpargalkablog.ru/2012/03/gde-luchshe-sozdat-blog.html

https://www.google.ru/

Где лучше создать блог. Мой опыт — Примеры

14.10.2015 09:30

1920

ru,en;q=0.8

.

.

http://shpargalkablog.ru/2013/10/how-many-hours.html?m=1

http://yandex.ru/touchsearch?text=сколько секунд в пяти с половиной часах

Калькулятор (конвертер) часов: сколько часов в секунде | минуте | дне | неделе | месяце | году | веке — Примеры

14.10.2015 18:10

375

ru-RU,ru;q=0.8,en-US;q=0.5,en;q=0.3

.

.

О пользователе, нажавшем на кнопку/ссылку/картинку/баннер, можно собрать довольно много информации для анализа. Представленная ниже не исчерпывающая. показатели URL страницы URL предыдущей страницы title страницы дата и время ip посетителя предпочитаемый язык посетителя ширина экрана устройства посетителя данные о браузере посетителя условия статистика собирается на другом домене (междоменные запросы) есть атрибут href (у ссылок): чтобы запрос успевал передаваться до того, как посетитель закроет страницу

Файл 1.html на сайт.ru

Статистику можно собирать на другом сайте ( сайт1.ru ). Для «Шпаргалки блоггера», расположенном на Blogger (бесплатный блогохостинг от Google), это единственно возможный вариант: сайт.ru мне нужно заменить на shpargalkablog.ru .

Файл stat.php на сайт1.ru

Файл stat.html на сайт1.ru

Как подсчитать количество кликов по баннеру и предоставить статистику рекламодателю

Рекламодатель захотел увидеть количество переходов по баннеру, размещённому на «Шпаргалке блоггера». Для подсчёта количества нажатий на кнопку или ссылку можно настроить цель в Яндекс.Метрике или Google Analytics, но там не учитываются посетители, у которых включен AdBlock и ему подобные. А в данном случае их присутствие в статистике очень даже желательно. условия статистика собирается на другом домене (междоменные запросы)

Шаг 1. Добавить на все HTML страницы с баннером на сайт.ru

Шаг 2. Создать папку «raz» на сайт1.ru . В ней — два файла

Шаг 3. На HTML странице сайт.ru разместить следующую форму. Адрес страницы передать рекламодателям. Они смогут увидеть статистику (каждый свою), если введут в форму свой email (электронный адрес).

Как работает счётчик кликов?

В шаге 1 при щелчке по картинке в файл PHP передаётся порядковый номер рекламодателя в массиве $email : Если появляется новый рекламодатель, то достаточно дописать его email последним

В шаге 2 эти данные записываются в файл (если последнего не существует, то он автоматически сам создастся). Тут можно информацию передавать в базу данных (наиболее распространена MySQL) или по ID вычислять город посетителя.

Источник

Клик по картинке счетчик

Одна из основных форм активного взаимодействия пользователя с вашим сайтом — клики по определенным элементам, отслеживание которых является важной задачей для аналитики. Вы не должны менять их названия, если хотите обеспечить правильный подсчёт кликов и получить точную статистику по поведению пользователей на вашем ресурсе. Как обеспечить контроль и сбор информации о поведении клиентов, когда работа над сайтом предполагает регулярные обновления? Я расскажу вам на примере реального кейса, чем GTM поможет вам в решении этой задачи.

Что такое GTM

Google Tag Manager — это веб-сервис, так называемый «менеджер тегов». Его задача — дополнять информацией стандартные инструменты аналитики, в первую очередь Google Analytics. Благодаря GTM вы можете встраивать в общий код сайта необходимые фрагменты кода, не используя при этом административную панель.

С его помощью интернет-маркетолог, веб-аналитик, менеджер по контекстной рекламе способен оперативно и без навыков программирования добавить нужный фрагмент кода на сайт. Самые частые случаи: установка системы аналитики, кода ремаркетинга, пикселя социальной сети и т.д.

Большинство кодов созданы на JavaScript и HTML. JavaScript используется чаще, так как этот язык исполняет «сценарии» обработки данных, дополняя сайт новыми функциями. Добавляемый код и техническое задание по его внедрению должны быть созданы профессиональным программистом, потому что сам GTM помогает только разместить код на сайте и протестировать его, временно отключить и включить снова, а не создать.

Зачем он нужен вашему бизнесу

Одним из ключевых преимуществ GTM является интуитивный и простой интерфейс, а также возможность использовать его без входа в административную часть сайта.

Иногда требуется добавить на сайт какие-нибудь дополнительные функции: установить код аналитического счетчика, код ремаркетинга, пиксель сервиса социальной сети, а также настроить получение или отправки с сайта информации. Вам не нужно сразу бежать к программисту или искать специалиста, который справится с этой работой, потому что модернизировать сайт с GTM вы сможете своими силами. Конечно, если вы не планируете сэкономить своё время для решения более важных задач.

GTM не может в полной мере заменить веб-программистов. Этот инструмент позволяет делать то, что для профессионала зачастую неэффективно с точки зрения приоритетов: вносить тестовые изменения на сайт, переносить некоторые настройки с одного сайта на другой и многое другое.

Принципы работы GTM на практике

Интернет-магазин косметических средств, который является нашим клиентом, делает ставку на привлечение внимания аудитории к новым продуктами и акциям с помощью графических баннеров. Из баннеров составляется слайдер на главной странице сайта. Дизайнеры готовят баннеры для каждого нового продукта или промо-акции. Смена происходит с периодичностью несколько раз в неделю, а иногда и чаще.

Для оценки эффективности как самих акций, так и работы дизайнеров, владельцы магазина поставили задачу по отслеживанию количества кликов по каждому из баннеров. Настроить систему было бы проще, если бы баннеры не менялись с такой высокой частотой. Нецелесообразно каждые два-три дня настраивать новое событие «Клик по баннеру», фактически корректируя код сайта.

Google Tag Manager помог решить эту задачу, позволив нам автоматизировать отслеживание кликов даже при частой смене картинок. Веб-мастеру сайта достаточно выкладывать новые баннеры в привычном ему режиме.

Как выглядит схема отслеживания:

Пользователь заходит на сайт;

Кликает по баннеру;

Срабатывает код GTM;

Информация о клике по баннеру уходит в Google Analytics;

В отчётах вы видите количество кликов по конкретному баннеру;

Оцениваете эффективность каждого баннера.

Что нужно для реализации этой схемы:

Установить код контейнера GTM.

Настроить в контейнере две переменных, один триггер и два тега.

Опубликовать контейнер, чтобы настройки начали действовать на сайте.

Пошаговая инструкция

Устанавливаем на сайт код контейнера

На первом этапе лучше привлечь программистов.

Настраиваем первую из двух переменных

Называть переменные и компоненты во всех сервисах нужно так, чтобы нейминг был одновременно кратким и информативным. Это облегчит работу вам и вашим коллегам. Переменную именуем, например, «Название баннера»; в неё запишется название файла баннера, по которому кликнут посетители вашего сайта. Такие названия будут постоянно меняться, если у вас стоит такая же задача, как у нашего клиента.

Выберем настройки — в окне «Конфигурация переменной»:

Тип переменной — «URL»;

Тип компонента — «Путь»;

Дополнительные настройки — источник URL — «<>».

Сохраняем настройки. Сами баннеры называйте, исходя из логики и не забывая про информативность, чтобы потом не запутаться и правильно оценить их эффективность.

Создаём вторую переменную

Она пригодится вам практически для всех других тегов. Эта переменная, по сути, указание адреса, куда следует направить информацию о событиях «клики по баннерам». Назовём её «Идентификатор отслеживания Google Analytics».

Тип переменной — «настройки Google Analytics»;

Идентификатор отслеживания — «UA-XXXXXXX-X», где вместо «X» необходимо указать номер вашего счетчика (ресурса) Google Analytics.

Создаём и настраиваем триггер

Останавливаемся на кратком и информативном варианте названия — «Клик по баннеру».

Тип триггера — «Клик — Все элементы»;

Условия активации триггера «Click URL содержит /upload/banners/».

Что такое «/upload/banners/»

Папки на сервере, где находится сайт, в которые размещаются баннеры. Важно, чтобы путь к картинкам не менялся, то есть папка «upload» всегда существовала и содержала в себе папку «banners». При этом в вашем конкретном случае, название пути может быть другим.

Создаём тег с таким же названием, как и триггер

Тип тега — «Google Аналитика — Universal Analytics»;

Тип отслеживания — «Событие», в) категория — «banners»;

Настройки Google Analytics — <>«.

При заполнении полей «категория» и «действие» старайтесь использовать английский язык и «верблюжий шрифт» без пробелов: например, клик по баннеру можно обозначить «clickOnTheBanner». Но в нашем кейсе названия состоят из одного слова («banners» и «click»).

Публикуем контейнер с изменениями

Рекомендую назвать версии контейнера также информативно, как и другие элементы. В случае нашего кейса название было таким: «Добавлены события для отслеживания кликов по баннерам».

Тестовые клики по баннерам

Проверка того, что мы всё сделали правильно. Имитируем поведения пользователя, самостоятельно совершая целевое действие. После кликов мы сразу переходим в отчёты по событиям в реальном времени в Google Analytics: раздел «Отчеты» — «В режиме реального времени» — «События». Там уже есть результаты наших кликов. В графах «Категория» и «Действие» мы должны видеть названия «banners» и «click», а в графе «Ярлык» — имя нашего файла вместе с названиями папок каталога сайта.

Это всё GTM

На основе полученных данных вы выстраиваете дальнейшие аналитические отчеты в Google Analytics и отслеживаете результаты по каждому баннеру. Зачем тратить рекламный бюджет на размещения, которые не приводят к целевым действиям пользователей. Лучше перераспределить его на каналы, которые приводят на сайт потенциальных клиентов.

Google Tag Manager позволяет детализировать аналитику, при этом не затрачивая большие временные ресурсы сотрудников, поддерживающих сайт. Такая детализация поможет объективно оценить работу дизайнеров и эффективность уникальных торговых предложений.

Ищете исполнителя для реализации проекта?

Проведите конкурс среди участников CMS Magazine

Узнайте цены и сроки уже завтра. Это бесплатно и займет ≈5 минут.

Источник