Яндекс-метрика. Фиксируем клик на телефон

Яндекс-метрика дает возможность фиксировать достаточно интересные события. Например — клик по какой-либо кнопке, ссылке на сайте.
Как это реализовать?

1. В метрике создаем цель (настройка-цели-добавить)
Тип выбираем javascript, идентификатор — произвольный (например — TELEPHONE)

2. На сайте создаем ссылку на номер телефона, примерно так:

Позвоните нам по телефону:
<a href="tel:(XXX)XXX-XX-XX" 
onclick="yaCounterYYYYYYY.reachGoal('TELEPHONE')">
(XXX)XXX-XX-XX</a>

Где (XXX)XXX-XX-XX — наш номер телефона, YYYYYYY — номер счетчика метрики Яндекса, TELEPHONE — идентификатор цели.

3. Часто пользователь не звонит напрямую, а, допустим, копирует номер телефона куда-либо для звонка позже.
Конечно, отследить движение ручки по блокноту проблематично, но зависание мышки над телефоном, выделение его, копирование — возможно. Событие это будет не конкретное, скорее — проявление интереса. Но давайте и его зафиксируем.
Для этого создадим вторую цель (на рисунке она названа «Звонок с сайта (onmouseover)» и имеет идентификатор TELEPHONE1).
Откорректируем немного наш код на сайте. Теперь он выглядит так:

Позвоните нам по телефону: 
<a href="tel:(XXX)XXX-XX-XX" 
onclick="yaCounterYYYYYYY.reachGoal('TELEPHONE') 
onmouseover="yaCounterYYYYYYY.reachGoal('TELEPHONE1')">
(XXX)XXX-XX-XX</a>

Готово. Наслаждаемся статистикой : )

Битрикс. Переход на php7

Часть 1. Стандартные правки для перехода Битрикса

Битрикс совместим с php7 (конечно, совместимость плагинов не гарантируется, но большинство из них — работают в семерке).

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

В файле /bitrix/php_interface/dbconn.php нужно добавить, если нет, в конец строчку

define("BX_USE_MYSQLI", true);

В файле /bitrix/.settings.php надо настроить connections:

  'connections' => 
  array (
    'value' => 
    array (
      'default' => 
      array (
        'className' => '\\Bitrix\\Main\\DB\\MysqliConnection',
        'host' => 'localhost',
        'database' => '...',
        'login' => '...',
        'password' => '...',
      ),
    ),
  ),

У меня на сайте есть работа напрямую с базой, не через функции Битрикса.  Так уж исторически сложилось, а править сотни строк кода — нет возможности-времени.  Поэтому мне приходилось переключаться между php 5 и 7 несколько раз, чтобы проверить работу того или иного модуля.
Чтобы не править конфигурационные файлы каждый раз при переключении, я внесла в них проверку на версию php:

$ver=phpversion(); if($ver[0]<7) ... else ....

Часть 2. Правка обращений напрямую  к базе

  1. Включаем режим отладки, чтобы видеть ошибки. В файле /bitrix/.settings.php ставим переменную debug в true.
  2. Пишем функцию подключения к базе в отдельный файл, чтобы при смене логина-пароля необходимо было править в одном месте.
      $mysqli= new mysqli('localhost', '...', '...', '...'); 
  3. В темплейтах, где использовалось подключение к базе не через функции Битрикса:
    1. Вызываем функцию подключения к базе.
    2. Меняем конструкции вида
      $rows = mysql_query($qu);
      while($row = mysql_fetch_array($rows))

      на

      $result = $mysqli->query($qu);
      while($row = $result->fetch_array(MYSQLI_BOTH)).
      

      Я меняла не абсолютно, а используя перед вызовом функций проверку на версию php. Если версия стара — то вызов старой функции, если нова — то новой.

    3. Помним, что новшества работой с базой не ограничиваются. Возможно, вы используете устаревшие функции, которые также будут выдавать ошибку. Например — split отменен, за него теперь explode (структура вызова функции — та же). Ereg и его производные больше не используются, заменены на близкие preg. Тут, конечно, включенный режим отладки здорово помогает.

Медленные ссылки на странице

Иногда нужны ссылки внутри страницы.
Например — при списке часто задаваемых вопросов, или, когда в начале товара выводится описание только нескольких характеристик, а основной массив характеристик — ниже.
Красиво когда переход по ссылке внутри страницы идет плавно.
Вот скриптик, который «округляет» переходы по якорям, начинающимся с des

$(function(){
$('a[href^="#des"]').click(function(){
var target = $(this).attr('href');
$('html, body').animate({scrollTop: $(target).offset().top}, 1200);//1200 - длительность скроллинга в мс
return false;
});
});

Поиск недавно измененных файлов

При подозрении на вирус полезно посмотреть недавно измененные файлы.
Но файлов в современных админках десятки тысяч, а папок — тысячи.

Ниже — коротенький скрипт для поиска свежих файлов.
Его же можно использовать для поиска файлов по названию.
Его же можно использовать для поиска файлов по размеру (это может быть полезно при ограниченном месте на диске).


<?
if(!isset($_GET['d'])) die("Скрипт находит все файлы, измененные после некоторой даты.<br/>
Для работы поместите скрипт в любую папку.<br> вызов скрипта: list.php?d=dd&m=mm&y=yyyy&h=hh<br>
где d:m:y:h - день, месяц, год и час после которого произошли изменения");
$d = $_GET['d'];
$m = $_GET['m'];
$y = $_GET['y'];
$h= $_GET['h'];


function listdir($path)
{ GLOBAL $t2;
$dh=@opendir($path);
if($dh)
{
while (false !== ($file=readdir($dh)))
{
// исключили папку cache
if(is_dir("$path/$file") and !strpos(' '.$file, 'cache') )
{
if (($file=='.') or ($file=='..')) continue;
listdir("$path/$file");
}
else
{
$t= filemtime("$path/$file");
if(($t > $t2 )) echo "<span style='color:red'><b>$path/$file</b> ". date("d-M-y H:i:s",$t)." </span><br/>";
// ищем конкретный файл
if(strpos("$path/$file", 'MailInvoker.php')) echo "<p style='color:green; font-size:16px; ont-weight:bold'>$path/$file". date("d-M-y H:i:s",$t)." </p>";
}
}
closedir($dh);
}
else echo "open error $path<br>";
return TRUE;
}


$t2=mktime ($h,0,0, $m ,$d, $y);
listdir('../');
echo 'готово';
?>

 

Замена форматирования во всех записях

На одном проекте сотрудничаю с хорошим редактором. она не только ставит тексты, но и всегда красиво оформляет.
Ставит шрифты, отступы в ячейках таблиц и прочее.
При смене дизайна оказалось, что отступы ломают мобильную версию, а шрифты — выглядят инородно.
А текстов-то тысячи добавлены.
Спасло редактирование через phpmyadmin базы. Такого типа командами:
UPDATE `b_iblock_element` SET `PREVIEW_TEXT` = REPLACE( `PREVIEW_TEXT`,'font-size:11pt;', '' ) ;

С http на https в вебасисте

С помощью админки Вебасиста можно администрировать несколько сайтов.
При этом физическая папка у них одна, корень сайта общий.
И, соответственно, общий htaccess.
Допустим, у одного из сайтов группы есть сертификат безопасности, он работает по протоколу https. А у других сайтов сертификата нет.
Как же правильно настроить тогда htaccess?

А не нужно его настраивать : ).
Webasyst организует редирект нужного сайта на https без правки htaccess.
Для этого нужно в приложении «Сайт» перейти в настройки домена, для которого установлен SSL-сертификат.
И проставить галочку «перенаправлять на https».

Плагины слайдеров

Продолжаю про плагины Вебасиста.
В системе много слайдеров. Для себя я выбрала два.
1. RevolutionSlider — шикарная система.
Миллион возможностей по созданию разных слайдеров на все случаи жизни.
Можно создать крутилку баннеров на главной.
Можно создать небольшие рекламные завлекалочки для размещения сбоку, в шапке, в футере.
В статьях с его помощью можно красиво оформить иллюстрации.
Созданные вами баннеры структурируются, собираются в списки. Можно хранить сколько угодно заготовок-черновиков (например, отложить в запасник поздравлялку к Новому Году).
Доступные эффекты радуют. Не будучи дизайнером и не имея специальных знаний, можно заставить текст всплывать, прыгать; товары кружиться в вальсе и т.п.
Потратить некоторое время на освоение приемов чтобы творить эту красоту, конечно, придется. Но теория не очень сложна — в проекте, который веду, баннеры создают менеджеры магазина.

2. Nivo Slider — удобен и прост.
RevolutionSlider, конечно, хорош. Он позволяет сделать достаточно сложные сценарии со сравнительно небольшими усилиями.
Но, как правило, слайды, сделанные в нем (особенно руками менеджеров магазина) получаются тяжеловатыми.
Nivo Slider — более удобен в применении, быстр в настройке. И слайды в нем весят не больше чем картинки, вами загружаемые. Это отличный инструмент для создания красивого традиционного слайдера на главной странице сайта.
Он адаптируется под любую ширину экрана, дружественен к вашей верстке, имеет простые и логичные параметры настройки.

Проверено на себе, рекомендую оба варианта.

Генерация прайсов (WA)

Вебасист (как и Битрикс, впрочем) хорош плагинами.
Даже самая великолепная команда разработчиков не сможет предусмотреть все потребности пользователей.
Поэтому привлечение всех желающих к разработке — великое благо.

Хочу написать несколько постов о любимых плагинах.
Начну, пожалуй, вот с этого https://www.webasyst.ru/store/plugin/shop/mprices/.
Замечательная вещь!
Генерирует прайсы для товаров магазина, позволяя достаточно тонкую их настройку.
Можно размещать превьюшки товаров.
Можно включать и выключать любые рубрики в генерируемые прайсы.
Создать свою шапку для экселевских фалов.
Генерировать все вместе и каждый раздел отдельным файлом.
Генерировать в бэкенде и фронтенде, выбирать адрес размещения.
Генерировать боком, шагом и с прискоком : ))
Генерировать по крону. Прайсы всегда будут актуальны! Причем заботливый разработчик плагина дает в подсказках полную команду для крона, остается ее только подставить в планировщик задач.

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

Печать части страницы

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

Делаем через скриптик:

<script type="text/javascript">
function print1(){
var prtContent = document.getElementById('sclad');
var win = open();
win.document.open();
win.document.write('<img src="/wa-data/public/shop/img/shema-sklad2.png" />');
win.document.write(prtContent.innerHTML);
win.print();
win.document.close();
}
</script>

Где
print1 — вызывается по кнопке «напечатать схему»;
«sclad» — id блока с описанием, а изображение, которое дописываем в блок — специально подготовленная для печати схема проезда. На странице она тоже есть, но помельче, негожая для печати. Поэтому ее добавляем в окно для печати дополнительно.

Скрипт галереи

Перепробовала несколько разных скриптов.
Всегда возвращаюсь к highslider.
Самый удобный, надежный, гибкий.

Пара приемов по использованию галереи.

  • Если мы используем галерею в разных местах и разными способами, то удобнее загружать скрипт и css сразу в шапке. Добавляем в head highslide-full.js и highslide.css.
  • Для того, чтобы увеличивать картинку в любом месте сайта по клику, добавим в шапку небольшой скрипт —
    <script type="text/javascript">
    hs.graphicsDir = '/highslide/graphics/';
    hs.align = 'center';
    hs.transitions = ['expand', 'crossfade'];
    hs.outlineType = 'rounded-white';
    hs.fadeInOut = true;
    </script>

    Изображение, которое нужно увеличить, оформляем так:
    <a href="URL полного изображения" onclick="return hs.expand(this)" ><img src="URL превью" alt="" /> </a>
  • Чтобы убрать надпись в верхнем правом углу со ссылкой на автора галереи достаточно в highslide-full.js отредактировать значение showCredits с true на false.