Тегирование каталога позволяет существенно расширить семантический охват и сделать более глубокую структуру ассортимента магазина, не создавая при этом сотни и тысячи дополнительных категорий. Делаем больше полезных страниц, не усложняя поиск товара для пользователей. В ранних версиях CMS 1С Битрикс теги работают довольно странно и порой требуются дополнительные действия, из коробки оно работать не хочет. Особенно это касается кастомных сборок, которые не всегда положительно переносят обновление системы. Ниже разберем, как в ручном режиме сделать себе тегирование и пару примеров, зачем вообще это делать.
Внимание! Категорически не рекомендуется повторять нижеописанное новичкам и если непонятно, что делать в случае, если на каком-то этапе реализации что-то пойдет не так и вместо сайта вылезет белый экран. Это лишь пример того, как оно работает у меня. Гарантий на 100%, что у вас оно тоже заработает, нет. Это Битрикс - тут в каждой сборке свои приколы.
Содержание:
Что потребуется
- Сделать резервную копию сайта. Желательно делать бэкап в любой непонятной ситуации и перед внесением изменений. Особенно во время работ на основном проекте, не тестовой копии.
- FTP-доступ к серверу либо опыт правки файлов из административной панели Битрикса.
- Стабильный интернет. Это важно! Отвалится соединение во время сохранения - сайт перестанет работать.
- Понимание кода. Если его нет, самому лучше не лезть, иначе можно всё поломать из-за одной пропущенной или лишней буквы и чинить потом можно долго. Когда код - тёмный лес, лучше все эксперименты проводить на тестовой копии сайта.
- Список из 2-3 тематических тегов для начала, чтобы настроить страницы под них и вывод в категориях магазина.
- Продумать вёрстку страницы тега. Можно сделать аналогично листингам категорий, использовав тот же шаблон.
Подготовка системы
Глобально есть 2 задачи:
- Создать сами страницы тегов, где будут показаны соответствующие товары с метками.
- Вывести ссылки на эти страницы в нужных местах сайта: в категориях, на главной и т.д.
Ни того, ни другого в старых сборках Битрикса обычно нет.
Справка. Текущий подход вывода тегов в большей степени применим для кастомных сборок, владельцы которых не могут обновиться до актуальной версии 1С Битрикс без риска потерять функционал системы частично или полностью, а потому вынуждены отказаться от тех плагинов, что представлены на Маркете.
Предположим, у нас магазин одежды и надо создать подборку сапог в горошек. Тестовый тег так и назовем, «в горошек». Русскими буквами, с пробелом. Записываем его себе, пригодится для фильтра. Находим в каталоге пятнистые сапоги. Открываем любую понравившуюся карточку товара на редактирование. В закладке SEO в самом низу добавляем наш тег - в горошек. Сохраняем. Внешне на сайте ничего не изменится. Предстоит еще много работы, прежде чем в категории сапог появится красивая ссылка на те самые сапоги в горошек.
Создание страниц-шаблонов для тегов
Идем на сервер сайта. Создаем папку, куда будут размещаться теги. Например, прямо в корне делаем папку /tags/. Внутри создаём папку для первого тестового тега с любым именем. Латиницей, без пробелов. Например, v-goroshek. По итогу получается путь до страницы /tags/v-goroshek/. В папке тега создаем php-файл с названием index.php.
Содержимое - копия любой страницы фильтра, например «Новинки» или «Акции» вашего магазина, но с некоторыми отличиями:
- Убираем содержимое заголовка h1. Его лучше вписывать вручную, в зависимости от названия тега.
- Хлебные крошки также копируем (если есть) и дорабатываем в соответствии с текущим положением страницы. Если по дороге при копировании пропала микро-разметка - возвращаем на место.
- Через SetTitle и SetPageProperty устанавливаем мета-теги для SEO, тайтл и дескрипшн соответственно.
Пример:
$APPLICATION->SetTitle("Сапоги в горошек купить в интернет-магазине от 1500 рублей с бесплатной доставкой");
$APPLICATION->SetPageProperty("description", "Категория Сапоги в горошек в интернет-магазине ХХХ. По вопросам звоните 8 (800) 123-45-67.");
Важно! Чтобы не влететь случайно под Баден-Баден от Яндекса, делаем страницу максимально не спамной. Именно для этого надо вручную заполнять крошки, мета-теги и h1. Если кругом наспамить одним ключом и сделать 100500 страниц тегов фильтр сайту обеспечен, а можно еще и АГС поймать за одно.
При желании добавляем текстовое описание категории. Иногда это положительно сказывается на продвижении.
Основное отличие от прочих страниц с фильтром:
<? $GLOBALS['arrFilter']=array("?TAGS" => 'tag1');?>
Вписываем эту строку над объявлением вывода самого листинга. Если надо отфильтровать сразу по нескольким тегам:
<? $GLOBALS['arrFilter']=array("?TAGS" => 'tag1 | tag2');?>
Здесь tag1 и tag2 - названия проставленных для товара тегов. Прописываем именно в том виде, как указано в параметрах товара. С учетом регистра и всех пробелов. Подробнее о вариантах вывода тегов можно почитать в соответствующей ветке на официальном форуме Битрикс.
В нашем случае с пятнистыми сапогами будет:
<? $GLOBALS['arrFilter']=array("?TAGS" => 'в горошек');?>
Справка. Название тегов, которое вводится для товара, можно делать на русском языке с пробелами. Фильтру это не мешает.
Пользовательские поля
Пользовательские поля помогут вывести ссылки на страницы тегов, чтобы они стали доступны для пользователей. На момент подготовки этого материала я работаю с разными версиями и редакциями 1С Битрикс и ни в одной нет такого готового формата полей, куда можно было бы вписать html-код с сохранением разметки и активными ссылками. Для тегирования это нужно, поэтому добавим новый тип поля с визуальным редактором.
Идём на сервер сайта и в папку /local/php/ добавляем файл WysiwygEditorUserField.php следующего содержания
<?php
class WysiwygEditorUserField
{
public function GetUserTypeDescription()
{
return [
'CLASS_NAME' => __CLASS__,
'BASE_TYPE' => 'string',
'USER_TYPE_ID' => 'editor',
'DESCRIPTION' => 'Визуальный редактор'
];
}
public function GetDBColumnType()
{
return 'text';
}
public function GetEditFormHTML($arUserField, $arHtmlControl)
{
ob_start();
CFileMan::AddHTMLEditorFrame($arHtmlControl['NAME'], $arHtmlControl['VALUE'], false, 'html', ['height' => 450, 'width' => '100%']);
$result = ob_get_contents();
ob_end_clean();
return $result;
}
}
?>
Внимание! Автор этого кода не я, когда-то давно нагуглил такой метод. Проверил - работает. Источник не сохранил, больше тот сайт найти не могу. Попадется - поставлю ссылку.
После размещения файла отправляемся в админку по адресу Рабочий стол - Настройки - Настройки продукта - Пользовательские поля. Нужно добавить новое с типом данных Визуальный редактор. Код поля делаем на латинице, без пробелов. Например, UF_TAG. Объект - это ваш каталог, тут id у каждого свой. К примеру, если у каталога id=3, делаем IBLOCK_3_SECTION.
Справка. Id своего каталога можно узнать, наведя курсор мыши на ссылку любого раздела в административной панели Битрикс, относящегося к нему. Это может быть список товаров, их свойства или что-то еще.
Пример заполнения параметров для создания пользовательского поля с визуальным редактором. Текст, указанный в «Языковых настройках» будет расположен рядом с окном самого поля. Это своего рода описание.
Код поля желательно себе записать, чтобы каждый раз не лазить в настройки или не выводить все параметры страницы с целью выяснить, как же мы его назвали при создании. Он еще пригодится.
Если не получается добавить новое поле для каталога
Бывает так, что Битрикс не дает выбрать нужный id объекта, если создавать поле непосредственно из общего списка этих полей в настройках. В этой ситуации открываем любую категорию каталога на редактирование из административной панели Битрикса, переходим в закладку «Доп. поля» и в самом верху там тыкаем по ссылке «Добавить пользовательское свойство». Нужный объект впишется автоматически. Выбираем тип данных - «Визуальный редактор», прописываем желаемый код поля латиницей (UF_TAG). Сохраняем.
Добавляем ссылки на теги
Теперь, когда в параметрах категории каталога появилось поле с визуальным редактором, в него можно вписывать ссылки на страницы тегов. Html-кодом через заготовленный шаблон или посредством того самого редактора - как удобнее. Я делаю кодом, используя обычные ссылки вида:
<a href="link">Анкор</a>
Где link - это адрес страницы тега латиницей (например, /tag/v-goroshek/), анкор - название тега («В горошек»). Нужно несколько - добавляем еще ссылок, в строчку, без пробелов между ними. Сохраняем изменения. На странице категории пока ничего не появится - это нормально.
Вывод тегов для пользователя
Идём в папку установленной на сайте магазина темы оформления (обычно bitrix/templates) и добавляем в файл template.php для catalog.section вывод данных из созданного ранее пользовательского поля.
<? if(!empty($arResult["~UF_TAG"])) {?>
<div class="tags"><?=$arResult["~UF_TAG"];?></div>
<div style="clear: both; height: 20px;"></div>
<? } ?>
Добавить можно сразу под h1 или по желанию в любое другое место. Потребуется тот самый код поля, который надо было выписать ранее. Если не выписали, можно либо вывести все параметры страницы и найти среди них по содержимому, либо лезть в список всех полей и посмотреть там. Ставим его в код вместо UF_TAG, волнистую линию при этом не трогаем - она нужна.
Такая конструкция выведет ссылки на теги лишь в том случае, если они заполнены в параметрах раздела, сами они не появятся.
На этом техническая часть пройдена. Последовательность действий такова:
- Придумываем новый тег, прописываем его на вкладке SEO соответствующему товару. Записываем в табличку или на бумажку для статистики и настройки фильтра.
- Создаем в папке тегов на сервере новый раздел с названием нового тега латиницей и копируем внутрь ранее созданный и свёрстанный файл index.php. В блоке фильтра указываем тег, выписанный в предыдущем пункте.
- Переименовываем все ключевые места в коде страницы (крошки, h1, мета-теги, описание) под название нового тега.
- Проверяем только что созданную страницу, вбив её в адресную строку браузера. Там должна быть страница листинга и товар, которому указали тег. Если что-то другое - проверяем, что сделано не так. Ищем ошибку. Работает - идем дальше.
- Добавляем ссылку на новую страницу тега в свойства нужного раздела каталога через поле с визуальным редактором. Сохраняем изменения. Всё - в листинге основного каталога должна появиться ссылка на только что созданный тег, и там на странице выводится один товар.
Справка. Теги лучше выписывать именно в Excel-таблицу, что поможет вести статистику и избежать дублей в дальнейшем. Это особенно полезно, если каталог и тегирование делают разные люди, и у них нет четких указаний, что будет тегом, а какой раздел включать в основной список категорий каталога. Без учета со временем начнутся дубли.
Суть тегирования и зачем его делать
Тегирование используется в большинстве крупных магазинов и позволяет создать своего рода трехмерную структуру не пересекающихся между собой разделов. При этом страницы тегов можно сделать индексируемыми, что позволит существенно увеличить посещаемость сайта интернет-магазина за счет многократного увеличения охвата целевой аудитории.
Как это выглядит
Рассмотрим примеры вывода ссылок на теги у крупных торговых площадок. Для простоты обнаружения интересующую область обвёл красной рамкой.
Справка. Хочется спрятать теги - размещаем их страницы прямо в папке категорий и пусть конкуренты гадают, как это работает.
Где брать названия тегов для своего проекта
Вариантов несколько. Лучше идти широким фронтом. Так по финалу охват семантики больше.
Пошаговый алгоритм:
1. Открываем программу Key Collector, под каждую группу ключей делаем отдельную папку, чтобы не запутаться. Названия папок соответствуют источникам запросов - конкуренты, Метрика и т.д.
На этапе создания тегирования для каталога обычно уже сформирован список основных сайтов-конкурентов. Смотрим внимательно каждый из них, заносим интересующие теги в Кей Коллектор.
Если есть данные статистики Яндекс Метрики или Google Analytics, выгружаем оттуда все запросы. Отдельно берем список всех категорий, отбрасываем хвосты и складываем эти фразы в свою папку.
Так получаем вводные фразы для последующего парсинга. Они же маркеры.
2. Парсим Яндекс Вордстат по запросам из пункта 1.
3. Сохраняем результат в отдельный файл. Это пригодится, когда закончится список подходящих для тегов запросов и надо будет как-то масштабироваться. Поэтому на каждом этапе отсева рабочий файл желательно клонировать, откладывая его копию.
4. Через Яндекс Директ снимаем частотность за месяц. Для сезонных товаров возможна большая погрешность и потребуется более детальный и сложный анализ, который не будет рассматриваться в рамках текущего материала.
5. Отбрасываем все пустые запросы, где частотность по нулям. Теги прежде всего нужны для увеличения посещаемости, а не для красоты. Если такое не ищут, оно не подходит. Брать все не нулевые, от 5 или от 300 - зависит от бюджета проекта. При желании можно выжигать семантику дотла, не оставляя конкурентам вариантов.
6. Оставшиеся запросы выгружаем единым списком в MS Excel и с помощью фильтра выставляем от самого частотного к менее интересующим покупателей.
7. Убираем из списка фразы, которые полностью совпадают с категориями каталога (можно сделать в Excel).
8. Внимательно смотрим список оставшихся ключевых слов и выписываем в таблицу будущих тегов всё, что подходит по смыслу каталога интернет-магазина.
Счет тегов может идти на сотни, а то и тысячи. Если получилось 5-10 штук, скорее всего слабо проработана семантика и можно найти гораздо больше.