Когда нашел ошибку на сайте

Добрый день друзья.

Лето подходит к концу и мой затянувшийся отпуск также закончился.

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

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

Итак после недолгих поисков я нашел скрипт, который меня устроил, как способом установки, так и функциональностью, на одном сайте. На этом сайте описывается установка на любой сайт, который поддеживает php.

А так как блог на движке wordpress основан на этом языке, то установить этот скрипт на блог, не составит большого труда.

Ну что ж, начнем.

Для начала скачайте сам скрипт, можете скачать его либо с сайта автора, либо по этой ссылке. Лучше скачать последнюю версию с сайта автора.

В архиве Вы найдете следующие файлы:

• mistakes.css — таблица стилей скрипта
• mistakes.js — сам скрипт
• mistakes.php — страница для формирования и отправки сообщения
• overlay.png — прозрачный фон для картинки

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

В файл mistakes.css, после имеющихся в нем записей, добавляем следующие строки:

/* Плавающий блок */

.m_swimBlock {
height: 90px;
margin-right: 10px;
overflow: hidden;
position: fixed;
bottom: 0px;
width: 122px;
}


Это можно сделать в любом текстовом редакторе, я рекомендую использовать notepad++.

В файле mistakes.js меняем значение переменной misphploc, указываем в нем путь к файлу mistakes.php на Вашем блоге.

Я разместил этот файл в каталоге с установленной темой, по адресу: wp-content/themes/Ваша тема


// Измените следующую строку. Здесь нужно указать путь к файлу mistakes.php
var misphploc = 'wp-content/themes/Ваша тема/mistakes.php'


В файле mistakes.php изменяем значения переменных:

• $title — Заголовок письма с сообщением о ошибке, которое Вы получите.
• $to — адрес электронной почты, на который будет приходить сообщение.
• $mymail — указанный обратный адрес электронной почты, может не существовать.
• в переменной $from — замените «yousite.ru» на адрес Вашего блога.

Обратите внимание, в архиве файлы находятся в кодировке windows-1251 (ANSI), если у Вас, как и у меня, блог использует кодировку utf-8 (Юникод), то замените «windows-1251» на «utf-8» в файле mistakes.php (используется в 3-х местах), и сохраните файлы mistakes.css, mistakes.js, mistakes.php в кодировке Юникод. При использовании Notepad++ Пункт меню «Кодировки» … «Преобразовать в UTF-8 без ВОМ»


<?php
if($_POST['submit']) {
       # Заголовок сообщения - замените "yousite.ru" на имя своего сайта:
       $title = 'Сообщение об ошибке на сайте yousite.ru';
$ip = getenv("REMOTE_ADDR");
$url = (trim($_POST['url']));
$mis = substr(htmlspecialchars(trim($_POST['mis'])), 0, 100000);
$comment = substr(htmlspecialchars(trim($_POST['comment'])), 0, 100000);




$mess = '
Адрес страницы: '.$url.'
Ошибка: '.$mis.'
Комментарий: '.$comment.'
IP: '.$ip.'
'.$_POST['mess'];
              # Email адрес, на который должны приходить сообщения:
              $to = 'email@yousite.ru';
              # Email адрес, от кого пришло сообщение:
              $mymail='noreplay@yousite.ru';
              # Вместо "yousite.ru" указжите имя вашего сайта:
$from = "From: =?utf-8?B?". base64_encode("yousite.ru"). "?= < $mymail >n";
$from .= "X-Sender: < $mymail >n";
$from .= "Content-Type: text/plain; charset=utf-8n";


После выполнения этих действий, нужно сохранить файлы на Вашем блоге. Я сделал в каталоге с установленной темой «wp-content/themes/Ваша тема» специальную папку mistake, в которой разместил файлы mistakes.css и mistakes.js. Файл mistakes.php, как я уже говорил, я разместил в каталоге темы.

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

Добавление стиля в CSS для создания «плавающего блока»

<!-- Подключаем блок проверки ошибок -->
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/mistakes/mistakes.css" type="text/css" media="screen" />
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/mistakes/mistakes.js"></script>


Сохраняем изменения, и выбираем файл сайдбара, где Вы хотите разместить информирующий банер

В файле боковая колонка

<div class="m_swimBlock">
<a href="javascript:void(0)" onclick="PressLink()">
<img src="<?php bloginfo('template_url'); ?>/images/ofert.v2.png" width="222" height="119"></a>
</div>


Вы можете выбрать картинку, которую будете использовать на своем блоге,

или скачать их шаблоны, для создания собственных изображений. Шаблоны разработаны в бесплатной программе Paint.NET.

Картинки имеют разные размеры, обратите на это внимание при их размещении. В данной статье описан тот случай, когда картинки расположены в каталоге /images, темы блога.

Вот и все, скрипт проверки сайта на ошибки «нашли ошибку на сайте» установлен на Вашем блоге. Теперь, если Ваш читатель найдет ошибку на Вашем сайте, ему достаточно выделить мышкой фрагмент с ошибкой и нажать кнопки «CTRL»+«ENTER», или кликнуть на банере, откроется дополнительное окно, в котором он может оставить свой комментарий и отправить Вам.

Желаю, что бы эта функциональность использовалась Вашими читателями, как можно реже.

Успешного Вам блоггинга!