пятница, 4 марта 2016 г.

Добавление комментариев на сайт

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

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

Для полноценной работы скрипта, приведенного в данной теме, Вам понадобиться в MySQL создать две таблицы: comment и ocenka_comment.

В таблице comment будут храниться комментарии посетителей и вся необходимая информацию о данных комментариях. В таблице ocenka_comment будут храниться последние оценки к комментариям, поставленные посетителями. Структура данных таблиц приведена на рисунках ниже:

Таблица, содержащая комментарии посетителей и информацию о них
Таблица comment.

Таблица, содержащая последние оценки поставленные комментариям
Таблица ocenka_comment.

Для быстрого создания таблиц comment и ocenka_comment, воспользуйтесь следующими SQL запросами, приведенными ниже. Для создания таблицы comment используйте код:
Цитата:
CREATE TABLE IF NOT EXISTS `comment` (
  `
idint(9unsigned NOT NULL auto_increment,
  `
parent_idmediumint(9unsigned NOT NULL default '0',
  `
first_parentmediumint(9unsigned NOT NULL default '0',
  `
dateint(10unsigned NOT NULL,
  `
theme_idsmallint(6unsigned NOT NULL,
  `
loginvarchar(30collate utf8_unicode_ci NOT NULL,
  `
messagevarchar(9999collate utf8_unicode_ci NOT NULL,
  `
moderationtinyint(3unsigned NOT NULL default '0',
  `
plusmediumint(9NOT NULL default '0',
  `
minusmediumint(9NOT NULL default '0',
  
PRIMARY KEY  (`id`),
  
KEY `theme_id` (`theme_id`)
ENGINE=MyISAM  DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci AUTO_INCREMENT=1;
А для создания таблицы ocenka_comment воспользуйтесь кодом:
Цитата:
CREATE TABLE IF NOT EXISTS `ocenka_comment` (
  `
idint(10unsigned NOT NULL auto_increment,
  `
dateint(10unsigned NOT NULL,
  `
comment_idmediumint(8unsigned NOT NULL,
  `
ipint(10unsigned NOT NULL,
  `
ocenkatinyint(3unsigned NOT NULL,
  
PRIMARY KEY  (`id`)
ENGINE=MyISAM  DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci AUTO_INCREMENT=1;
В результате выполнения приведенных выше SQL запросов у Вас в MySQL должны появиться таблицы, как на скриншотах выше.

После того, как необходимые таблицы в MySQL были уже созданы, в начало Ваших страничек, на которых будет присутствовать форма добавления комментариев (выше тега <head>) поместите следующий PHP код, предназначенный для обработки отправленных сообщений:
PHP код:
<?php
$time
=time();
if (
session_id()==''session_start();
$db=mysqli_connect("localhost","Ваш_логин","Ваш_пароль","Имя_базы") or die();$res=mysqli_query($db,"set names utf8");
$mess_url=mysqli_real_escape_string($db,basename($_SERVER['SCRIPT_FILENAME']));
//получаем id текущей темы$res=mysqli_query($db,"SELECT id FROM таблица WHERE file_name='".$mess_url."'");$res=mysqli_fetch_array($res);$theme_id=$res["id"];

if (isset(
$_POST["contr_cod"])){    //отправлен комментарий
 
$mess_login=htmlspecialchars($_POST["mess_login"]);
 
$user_text=htmlspecialchars($_POST["user_text"]);
 if (
md5($_POST["contr_cod"])==$_POST["prov_summa"]){    //код правильный
  
if ($mess_login!='' and $user_text!=''){
   if (
is_numeric($_POST["parent_id"]) and is_numeric($_POST["f_parent"]))
    
$res=mysqli_query($db,"insert into comment
    (parent_id, first_parent, date, theme_id, login, message)
    values ('"
.$_POST["parent_id"]."','".$_POST["f_parent"]."',
    '"
.$time."','".$theme_id."','".$mess_login."','".$user_text."')");
   else 
$res=mysqli_query($db,"insert into comment (date, theme_id, login, message)
   values ('"
.$time."','".$theme_id."','".$mess_login."','".$user_text."')");
    
$_SESSION["send"]="Комментарий принят!";
    
header("Location: $mess_url#last"); exit;
  }
  else {
   
$_SESSION["send"]="Не все поля заполнены!";
   
header("Location: $mess_url#last"); exit;
  }
 }
 else {
  
$_SESSION["send"]="Неверный проверочный код!";
  
header("Location: $mess_url#last"); exit;
 }
}

if (isset(
$_SESSION["send"]) and $_SESSION["send"]!="") {    //вывод сообщения
    
echo '<script type="text/javascript">alert("'.$_SESSION["send"].'");</script>';
    
$_SESSION["send"]="";
}
?>
Не забудьте при подключении к Вашей MySQL базе в функции mysqli_connect() указать Ваши логин, пароль и имя БД.

Так же хотим обратить Ваше внимание на еще один важный момент - получение id идентификатора текущей темы. Т.к. нам неизвестно, какая структура БД у Вас на сайте, то Вам этот момент придется доделать самим, а именно получить id темы и поместить его в переменную$theme_id. В коде id мы получаем запросом после комментария "//получаем id текущей темы".

Далее, для нормального отображения комментариев и формы добавления комментариев к темам сайта нам понадобятся CSS стили. Для этого добавьте себе следующий CSS код:
HTML код:
<style type="text/css">
    .
add_comment {
        
displaytable;
        
width580px;
        
border1px solid #000;
        
background-color#6AF;
    
}
    .
close_hint, .open_hint {
        
floatright;
        
border1px solid #77A;
        
background#6e6;
        
width100px;
        
text-aligncenter;
        
cursorpointer;
    }
    .
close_hint margin5pxcolor#F00; }
    
.comm_body padding0 5pxbackground-color:#EEE; text-align:left; }
    
.comm_head padding3pxborder1px solid #77A; background-color: #DFD; }
    
.comm_minus backgroundurl('image/minus.png'no-repeat; }
    .
comm_plus backgroundurl('image/plus.png'no-repeat; }
    .
comm_minus, .comm_plus {
        
floatright;
        
width19px;
        
height18px;
        
cursorpointer;
    }
    .
comm_text display:none; }
    .
sp_link color#F33; cursor: pointer; }
    
.strelka {
        
backgroundurl(image/strelka.pngno-repeat;
        
border-left2px solid #000;
    
}
    .
strelka_2 backgroundurl(image/strelka_2.pngno-repeat; }
    
#hint { position: absolute; display: none; z-index: 100; }</style>
Теперь, после того, как БД создана, и стили прописаны, можно приступать к коду, отвечающему за вывод и добавление комментариев.

В том месте странички, где должны выводиться оставленные посетителями комментарии, добавляем следующий PHP код:
PHP код:
<?phpfunction parents($up=0$left=0) {    //Строим иерархическое дерево комментариевglobal $tag,$mess_url;

for (
$i=0$i<=count($tag[$up])-1$i++) {
 
//Можно выделять цветом указанные логины
 
if ($tag[$up][$i][2]=='Admin'$tag[$up][$i][2]='<font color="#C00">Admin</font>';
 if (
$tag[$up][$i][6]==0$tag[$up][$i][6]=$tag[$up][$i][0];
 
//Высчитываем рейтинг комментария
 
$sum=$tag[$up][$i][4]-$tag[$up][$i][5];

 if (
$up==0) echo '<div style="padding:5px 0 0 0;">';
 else {
    if (
count($tag[$up])-1!=$i)
        echo 
'<div class="strelka" style="padding:5px 0 0 '.($left-2).'px;">';
    else echo 
'<div class="strelka_2" style="padding:5px 0 0 '.$left.'px;">';
 }
 echo 
'<div class="comm_head" id="m'.$tag[$up][$i][0].'">';
 echo 
'<div style="float:left;"><b>'.$tag[$up][$i][2].'</b></div>';
 echo 
'<div class="comm_minus"></div>';
 echo 
'<div style="float:right; width:30px;" id="rating_comm'.$tag[$up][$i][0].'">';
 echo 
'<b>'.$sum.'</b></div><div class="comm_plus"></div>';
 echo 
'<a style="float:right; width:70px;" href="'.$mess_url.'#m';
 echo 
$tag[$up][$i][0].'"># '.$tag[$up][$i][0].'</a>';
 echo 
'<div style="float:right; width:170px;">';
 echo 
'('.date("H:i:s d.m.Y"$tag[$up][$i][3]).' г.)</div>';
 echo 
'<div style="clear:both;"></div></div>';
 echo 
'<div class="comm_body">';
 if (
$sum<0) echo '<u class="sp_link">Показать/скрыть</u><div class="comm_text">';
 else echo 
'<div style="word-wrap:break-word;">';
 echo 
str_replace("<br />","<br>",nl2br($tag[$up][$i][1])).'</div>';
 echo 
'<div class="open_hint" onClick="comm_on('.$tag[$up][$i][0].',
     '
.$tag[$up][$i][6].')">Ответить</div><div style="clear:both;"></div></div>';

 if (isset(
$tag$tag[$up][$i][0] ])) parents($tag[$up][$i][0],20);
 echo 
'</div>';
}
}
$res=mysqli_query($db,"SELECT * FROM comment
    WHERE theme_id='"
.$theme_id."' and moderation=1 ORDER BY id");$number=mysqli_num_rows($res);

if (
$number>0) {
 echo 
'<div style="border:1px solid #000000;padding:5px;text-align:center;">';
 echo 
'<b>Последние комментарии:</b><br>';
 while (
$com=mysqli_fetch_assoc($res))
    
$tag[(int)$com["parent_id"]][] = array((int)$com["id"], $com["message"],
    
$com["login"], $com["date"], $com["plus"], $com["minus"], $com["first_parent"]);
 echo 
parents().'</div><br>';
}
?>
Если Вы не планируете модерацию оставленных комментариев (чего бы мы Вам не советовали), то просто удалите and moderation=1 из последнего SQL запроса выше приведенного кода. Таким образом, все оставленные посетителями комментарии будут незамедлительно опубликованы.

Если Вы все-таки решили оставить модерацию комментариев, то Вам необходимо перейти в тему модерация комментариев на сайте, в которой приведен PHP код, который позволит Вам быстро изменять, удалять и публиковать оставленные посетителями комментарии.

Теперь Вам необходимо добавить форму для того чтобы посетители сайта могли оставлять комментарии. Для этого Вам понадобится добавить на сайт следующий PHP код:
PHP код:
<?php
$cod
=rand(100,900); $cod2=rand(1,99);
echo 
'<div id="last" align="center">';
echo 
'<form method="POST" action="'.$mess_url.'#last" class="add_comment"';
echo 
'name="add_comment" id="hint"><div class="close_hint">Закрыть</div>';
echo 
'<textarea cols="68" rows="5" name="user_text"></textarea>';
echo 
'<div style="margin:5px; float:left;">';
echo 
'Имя: <input type="text" name="mess_login" maxlength="20" value=""></div>';

echo 
'<div style="margin:5px; float:right;">'.$cod.' + '.$cod2.' = ';
echo 
'<input type="hidden" name="prov_summa" value="'.md5($cod+$cod2).'">';
echo 
'<input type="hidden" name="parent_id" value="0">';
echo 
'<input type="hidden" name="f_parent" value="0">';
echo 
'<input type="text" name="contr_cod" maxlength="4" size="4">&nbsp;';
echo 
'<input type="submit" value="Отправить"></div>';
echo 
'</form>';

echo 
'<form method="POST" action="'.$mess_url.'#last" class="add_comment">';
echo 
'Добавить комментарий:';
echo 
'<textarea cols="68" rows="5" name="user_text"></textarea>';
echo 
'<div style="margin:5px; float:left;">';
echo 
'Имя: <input type="text" name="mess_login" maxlength="20" value=""></div>';
echo 
'<div style="margin:5px; float:right;">'.$cod.' + '.$cod2.' = ';
echo 
'<input type="hidden" name="prov_summa" value="'.md5($cod+$cod2).'">';
echo 
'<input type="text" name="contr_cod" maxlength="4" size="4">&nbsp;';
echo 
'<input type="submit" value="Отправить"></div>';
echo 
'</form></div>';?>
Как Вы могли заметить, мы используем две практически одинаковые формы для отправки комментариев. Не стоит пугаться, т.к. одна форма постоянно видна, и предназначена для обычного добавления комментариев, в то время как вторая форма скрыта и появляется только при клике по кнопке "Ответить" и предназначена для ответов на уже имеющиеся комментарии.

Для того чтобы добавить плавности при появлении и исчезновении формы ответа на уже существующие комментарии, а так же для оценивания комментариев без перезагрузки странички, Вам потребуется подключить библиотеку jQuery. Делается это так:
JavaScript код:
<script type="text/javascript"src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
Библиотека jQuery требуется для работы JavaScript кода, который и отвечает за все выше перечисленные функции. Оговоренный JavaScript код необходимо добавить на Ваш сайт, желательно где-нибудь в конце странички после приведенных PHP кодов и подключения библиотеки jQuery.
JavaScript код:
<script type="text/javascript">//Добавление в форму отправки комментария значений id родительских комментариевfunction comm_on(p_id,first_p){
    
document.add_comment.parent_id.value=p_id;
    
document.add_comment.f_parent.value=first_p;
}

$(
document).ready(function(){//Показать скрытое под спойлером сообщение$(".sp_link").click(function(){
    $(
this).parent().children(".comm_text").toggle("normal");
});
//Показать форму ответа на имеющийся комментарий$(".open_hint").click(function(){
    $(
"#hint").animate({
        
top: $(this).offset().top 25left: $(document).width()/-
        $(
"#hint").width()/2
    
}, 400).fadeIn(800);
});
//Скрыть форму ответа на имеющийся комментарий$(".close_hint").click(function(){ $("#hint").fadeOut(1200); });
//Получение id оцененного комментария$(".comm_plus,.comm_minus").click(function(){
    
id_comm=$(this).parents(".comm_head").attr("id").substr(1);
});
//Отправление оценки комментария в файл rating_comm.php$(".comm_plus").click(function(){
    
jQuery.post("rating_comm.php",{comm_id:id_comm,ocenka:1},rating_comm);
});
$(
".comm_minus").click(function(){
    
jQuery.post("rating_comm.php",{comm_id:id_comm,ocenka:0},rating_comm);
});
//Возврат рейтинга комментария и его обновлениеfunction rating_comm(data){
    $(
"#rating_comm"+id_comm).fadeOut(800,function(){
        $(
this).html(data).fadeIn(800);
    });
}
});
</script>
Теперь Вам остается только добавить на свой сайт файл rating_comm.php, на который мы запросом jQuery.post() отсылаем оценки, поставленные комментариям. Файл rating_comm.php будет получать и обрабатывать поставленные (отправленные) оценки комментариям и высчитывать рейтинг комментариев. Файл rating_comm.php включает в себя следующий PHP код:
PHP код:
<?phpif (isset($_POST["comm_id"]) and is_numeric($_POST["comm_id"]))
    
$obj=$_POST["comm_id"];
else 
$obj='';

if (isset(
$_POST["ocenka"]) and ($_POST["ocenka"]==or $_POST["ocenka"]==1))
    
$ocenka=$_POST["ocenka"];
else 
$ocenka='';

if (
$ocenka!='' and $obj>0) {
 
$ip=$_SERVER['REMOTE_ADDR'];

 
$db=mysqli_connect("localhost","Ваш_логин","Ваш_пароль","Имя_базы") or die();
 
$res=mysqli_query($db,"SELECT count(id),ocenka FROM ocenka_comment
         WHERE comment_id='"
.$obj."' and ip=INET_ATON('".$ip."')");

 
$number=mysqli_fetch_array($res);
 if (
$number[0]==0) {
    
$res=mysqli_query($db,"INSERT INTO ocenka_comment (date,comment_id,ip,ocenka)
    values ('"
.time()."','".$obj."',INET_ATON('".$ip."'),'".$ocenka."')");

    if (
$ocenka==0$res=mysqli_query($db,"UPDATE comment SET minus=(minus+1)
                    WHERE id='"
.$obj."' LIMIT 1");
    else 
$res=mysqli_query($db,"UPDATE comment SET plus=(plus+1)
                    WHERE id='"
.$obj."' LIMIT 1");
 }
 elseif (
$number["ocenka"]!=$ocenka) {
    
$res=mysqli_query($db,"UPDATE ocenka_comment SET date='".time()."',
    ocenka='"
.$ocenka."' WHERE comment_id='".$obj."' and ip=INET_ATON('".$ip."')");

    if (
$ocenka==0$res=mysqli_query($db,"UPDATE comment SET minus=(minus+1),
                    plus=(plus-1) WHERE id='"
.$obj."' LIMIT 1");
    else 
$res=mysqli_query($db,"UPDATE comment SET plus=(plus+1), minus=(minus-1)
                    WHERE id='"
.$obj."' LIMIT 1");
 }
$res=mysqli_query($db,"SELECT plus,minus FROM comment WHERE id='".$obj."' LIMIT 1");$rating=mysqli_fetch_array($res);
echo 
'<b>'.( $rating["plus"]-$rating["minus"]).'</b>';mysqli_close($db);
}
?>
Данный скрипт позволяет оставлять только одну оценку к одному комментарию. Для того чтобы через некоторое время было возможно повторно оценить комментарий, необходимо удалять старые оценки из таблицы ocenka_comment. Для этого используйте следующий PHP код, который удаляет все оценки старше 30 дней:
PHP код:
<?php
$del_date
=$time-2592000;    //время в секундах (2592000 сек. = 30 дней)$res=mysqli_query($db,"DELETE FROM ocenka_comment WHERE date<".$del_date."");?>
После создания в MySQL указанных таблиц и добавления на свой сайт всех выше приведенных PHP и JavaScript кодов, у Вас должна получиться полноценная форма для оставления комментариев к темам сайта.

0 коммент.:

Отправить комментарий