Часто на сайтах можно видите фразу, сейчас данный сайт просматривает столько-то человек, или даже список зарегистрированных посетителей, находящихся в данным момент на сайте. Обычно такой сервис называют "Список посетителей OnLine". Учитывая, что у посетителя может динамически меняться IP-адрес, или наоборот несколько посетителей могут выходить в Интернет из под одного IP-адреса, для подсчёта уникальных посетителей на сайте прибегают к сессиям. Создадим таблицу session в которой будем хранить уникальные идентификаторы сессии (SID), назначенные посетителям.
Таблица session
CREATE TABLE session (id_session tinytext NOT NULL, putdate datetime NOT NULL default "0000-00-00 00:00:00", user tinytext NOT NULL) TYPE=MyISAM;Таблица имеет три поля - id_session, поле, куда помещается SID сессии, поле putdate, для того, хранения времени обращения посетителя к страницам сайта и поле user, которое нами использоваться не будет, но в котором можно хранить имя пользователя, если у вас имеется система авторизации и вы хотите различать гостей и авторизованных пользователей. Предполагается, что имя пользователя помещается в элемент суперглобального массива $_SESSION["user"] - если вас интересует авторизация на PHP, с нейм можно ознакомиться по
В начало каждой страницы сайта, которая будет участвовать в регистрации посетителей следует при помощи конструкции поместить следующий код.
Скрипт регистрации посетителей в таблице session
Протокол HTTP не является сессионным протоколом, поэтому мы можем фиксировать только обращения посетителей к страницам сайта - сколько после этого посетитель будет читать страницу - одному богу известно - получить эту информацию мы не сможем. Поэтому мы будем считать, что если посетиель не обращается к страницам сайта более 20 минут - он ушёл и его можно удалять из таблицы session .
Теперь нам остаётся только вывести содержимое таблицы session или подсчитать число посетителей в ней.
Выводим содержимое таблицы session
Для установки соединения с базой данных, нам потребуется конфигурационный файл config.php , следующего содержания.
Конфигурационный файл config.php
Лучший способ удержать пользователя на сайте, это позволить ему найти, то что он ищет. Если вы делаете для этого удобную систему, то уровень предпочтения вашего сайта будет расти и пользователь обязательно вернётся для того, чтобы найти то, что его интересует.
Я вам покажу как создать простую, но эффективную по функционалу, поисковую форму, которая будет использоваться для поиска статей на сайте. Результаты будут появляться на странице без никаких перезагрузок, что несомненно является лучшим способом подачи информации.
Я создам 2 файла: search.php, который будет содержать HTML и JavaScript. Второй файл, do_search.php будет содержать PHP код. Приступим к созданию первого файла:
PHP, jQuery search demo
$(function() {
$(".search_button").click(function() {
// получаем то, что написал пользователь
var searchString = $("#search_box").val();
// формируем строку запроса
var data = "search="+ searchString;
// если searchString не пустая
if(searchString) {
// делаем ajax запрос
$.ajax({
type: "POST",
url: "do_search.php",
data: data,
beforeSend: function(html) { // запустится до вызова запроса
$("#results").html("");
$("#searchresults").show();
$(".word").html(searchString);
},
success: function(html){ // запустится после получения результатов
$("#results").show();
$("#results").append(html);
}
});
}
return false;
});
});
Попробуйте ввести слово ajax
Результаты для
В этом файле мы создали обычную HTML форму, которая посылает POST запрос в бэк энд - файлу do_search.php.
PHP код содержит комментарии, по которым вы с лёгкостью сможете понять работу скрипта. Если в базе данных нашлись совпадения, вы показываете их вашему пользователю, выделяя жирным те слова, которые искал пользователь.
Придадим всему этому немного CSS:
Body{ font-family:Arial, Helvetica, sans-serif; } *{ margin:0;padding:0; } #container { margin: 0 auto; width: 600px; } a { color:#DF3D82; text-decoration:none } a:hover { color:#DF3D82; text-decoration:underline; } ul.update { list-style:none;font-size:1.1em; margin-top:10px } ul.update li{ height:30px; border-bottom:#dedede solid 1px; text-align:left;} ul.update li:first-child{ border-top:#dedede solid 1px; height:30px; text-align:left; } #flash { margin-top:20px; text-align:left; } #searchresults { text-align:left; margin-top:20px; display:none; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#000; } .word { font-weight:bold; color:#000000; } #search_box { padding:4px; border:solid 1px #666666; width:300px; height:30px; font-size:18px;-moz-border-radius: 6px;-webkit-border-radius: 6px; } .search_button { border:#000000 solid 1px; padding: 6px; color:#000; font-weight:bold; font-size:16px;-moz-border-radius: 6px;-webkit-border-radius: 6px; } .found { font-weight: bold; font-style: italic; color: #ff0000; } h2 { margin-right: 70px; }
Вот вы и научились создавать простейшую поисковую форму, которая работает без перезагрузки страницы. Надеюсь, урок вам понравился.
Фреймворк Bootstrap: быстрая адаптивная вёрстка
Пошаговый видеокурс по основам адаптивной верстки в фреймворке Bootstrap.
Научитесь верстать просто, быстро и качественно, используя мощный и практичный инструмент.
Верстайте на заказ и получайте деньги.
Бесплатный курс "Сайт на WordPress"
Хотите освоить CMS WordPress?
Получите уроки по дизайну и верстке сайта на WordPress.
Научитесь работать с темами и нарезать макет.
Бесплатный видеокурс по рисованию дизайна сайта, его верстке и установке на CMS WordPress!
*Наведите курсор мыши для приостановки прокрутки.
Назад Вперед
Счетчик посещений сайта своими руками на PHP и MySQLВ этом уроке мы с вами рассмотрим, как можно сделать простой счетчик посещений для вашего сайта. Пример мы будем реализовывать на PHP с использованием базы данных.
Понятно, что сейчас существует множество готовых решений - начиная от liveinternet и mail.ru , и заканчивая Яндекс.Метрикой.
Все эти сервисы предоставляют множество различной статистической информации, однако меня все равно периодически просят рассказать, как можно создать пусть даже очень простой, но свой собственный счетчик посещений сайта.
Мы не будем фиксировать десятки и сотни параметров, как это делают монстры, вроде Яндекса. Я покажу вам сам принцип создания счетчика, а вы, при желании, сможете туда добавить больше функций, если это будет необходимо.
Все исходники, используемые в процессе урока, приложены в архив вместе с видеоуроком.
Вы можете просмотреть этот урок прямо сейчас, либо скачать его себе на компьютер по ссылке выше.
Под видео вы найдете сокращенную текстовую версию для этого видеоурока.
Краткий обзор урока (все подробности смотрите в видео):
Что нам понадобится?
1.
4 практически идентичных файла, играющих роли разных страниц сайта (index.php, contacts.php, about.php и uslugi.php)
2.
Файл.htaccess для задания кодировки сервера в значение UTF-8
3.
Папка css с файлом стилей. Там прописано немного простейших стилей для наших страниц
4.
Папка inc с подключаемыми файлами. Их три:
- файл подключения к базе данных
- Файл, который будет подключаться в нужном месте страницы для вывода счетчика на экран
- Основной скрипт, в котором прописана логика работы счетчика
5.
Папка admin с файлом index.php. В этом файле мы сможем просмотреть статистику посещений сайта
Как что работает?
1. Создаем проект в Денвере (либо на реальном сервере)
Я создал в Денвере хост с именем statistic , а в папке www находятся все файлы сайта.
2. Создаем базу данных
Давайте перейдем к созданию базы, где у нас будет лежать вся информация. Назовем ее stats и создадим в ней две таблицы.
Если вы не хотите вручную создавать таблицы, то можете воспользоваться дампом базы (приложен в дополнительных материалах) и выполнить SQL-запрос на вкладке SQL после создания базы.
Итак, создаем первую таблицу . Назовем ее ips - в ней будут храниться идентификаторы IP-адресов и сами IP-адреса посетителей сайта.
В таблице будут 2 поля:
Id_id (int (12), первичный ключ, автоинкремент)- идентификатор IP-адреса;
- ip_address (varchar (50)) - сам IP-адрес посетителя.
В таблице будут 4 поля:
visit_id (int (12), первичный ключ, автоинкремент) - идентификатор визита;
date (date) - дата визита;
hosts int(12) - количество хостов (уникальных посещений);
views int(12) - количество хитов (просмотров страниц).
В итоге база будет выглядеть вот так:
3. Базовые положения
Теперь, когда база данных создана, можно перейти к нескольким положениям, от которых мы будем отталкиваться при написании скрипта:
1. Определять уникального посетителя мы будем по IP-адресу. 1 IP-адрес равен 1 уникальному посетителю (хосту).
2. Заходы в течение 1 дня с одним и тем же IP-адресом не увеличивают количество уникальных посетителей в этот день.
3. Любой заход на сайт в течение суток увеличивает счетчик посещений (хитов) на 1 (вне зависимости от того, совершается ли он с уникального за сегодня IP-адреса или нет).
4. Начало суток мы будем определять следующим образом: когда человек заходит на сайт, мы будем делать проверку, существуют ли в таблице visits какие-либо записи за сегодняшнюю дату. Если нет, значит текущий посетитель является первым посетителем в данных сутках.
5. Раз в сутки идет очистка таблицы с IP-адресами для того, чтобы мы могли заносить в нее IP-адреса уже текущего дня и собирать статистику именно по сегодняшним посещениям сайта (делается это как раз по факту обнаружения того, что к нам пожаловал первый в текущих сутках посетитель).
4. Пишем файлы страниц сайта (index.php, contacts.php, about.php и uslugi.php)
Поскольку все 4 файла страниц сайта практически идентичны, мы рассмотрим только страницу index.php . Остальные три страницы (contacts.php, about.php и uslugi.php ) отличаются только тэгами title и h2 , в которых написаны другие названия страниц.
Итак, файл index.php :
Главная
Главная страницаВ самом начале мы подключаем файл сount.php , который содержит всю логику работы счетчика.
В нижей части, перед закрывающим тэгом body мы подключаем файл show_stats.php , в котором содержится сам код счетчика, т.е. в этом файле уже формируется непосредственно то, что мы будем выводить на экран.
Т.е. на каждой странице сайта у нас будет выводиться счетчик, и будет указано, сколько было за сегодня уникальных посетителей и просмотров. Этот файл мы разберем позже.
5. Пишем файл стилей (style.css)
#nav{ padding-left: 0px; } #nav li{ display: inline; margin: 5px; padding: 5px; font-family: Verdana; font-size: 15px; background-color: #F1EEF7; border: 1px solid silver; } #nav li a{ text-decoration: none; } #nav li:hover{ background-color: #8D93EF; }
Стили, как вы видите, очень простые. Мы задаем отступы, размер и гарнитуру шрифта, убираем подчеркивание для ссылок в меню и меняем цвет фона при наведении курсора мыши на элемент списка.
Кроме того, мы используем свойство display со значением inline для того, чтобы наше меню приняло горизонтальный, а не вертикальный вид.
6. Пишем файл.htaccess
На всякий случай создаем в корне сайта файл .htaccess с одной единственной директивой для задания кодировки UTF-8:
AddDefaultCharset UTF-8
Данный шаг может оказаться излишним, если кодировка сервера уже была установлена в это значение.
7. Подключаемся к базе данных (db.php)
