Всё для сайтов

Короткий фрагмент кода, который отрисует теги товара с перекрёстными ссылками на товар.

Полезные сведения

Сниппет "Теги" с SEO уклоном

Сниппет Теги

Скорее всего вы знаете, как обычно используются теги: выведенные в разметку клиентской стороны сайта, каждый из них представляет собой ссылку на страницу со списком товаров, помеченных таким же тегом. По сути, это разновидность поиска в один клик по ключевому слову. Однако существует ещё один вид применения, он служит для создания перекрёстных ссылок на страницу, а по клику уже действует как обычный тег - ведёт на теговый список.

Плюс такого способа в том, что кроме обычной теговой функциональности, выполняется одна из SEO-задач: получить на внетоварных страницах сайта ссылки на товарную страницу с разным якорным текстом, точно соответствующим ключевым словам той страницы.

Рассмотрим несколько его реализаций. Каждый пример кода написан так, словно это маленький модулёчек, например разместим его в файле common/tags.htm нашего шаблона, и который останется вызвать в нужном месте страницы, скажем во время вывода мини карточек товаров:

    ...
    {foreach $products as $item}
        ...
        {include 'common/tags.htm'}
    {/foreach}
    ...
    

Примечательно Код сохраняет работоспособность в том числе для страниц категорий, брендов, новостей, статей и вообще любой записи, которая содержит поле тегов.

Простейший случай

Здесь воспроизводится типичная теговая функциональность.

{$tags = explode(',', $item->tags|default:'')}
{if !empty($tags)}
    <div class="tags">
        {foreach $tags as $tag}
            {$tag = trim($tag|lower)}
            {$key = preg_replace('/\s+/u', '-', $tag)}
            <a href="tags/{$key|escape}" rel="nofollow">
                {$tag}
            </a>
        {/foreach}
    </div>
{/if}

Механизм работы кода Из входной переменной $item, содержащей запись текущего отрисовываемого товара, извлекаем список тегов, которые администратор должен был перечислить через запятую. Если список не пустой, пробегаем по его элементам и выводим каждый в виде теговой ссылки: название тега и ключевой url.

Обратите внимание Ссылки снабжены признаком nofollow, ведь нам как раз не интересно, чтобы поисковик ходил по таким ссылкам.

Простейший случай + SEO

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

{$tags = explode(',', $item->tags|default:'')}
{if !empty($tags)}
    <div class="tags">
        {foreach $tags as $tag}
            {$tag = trim($tag|lower)}
            {$key = preg_replace('/\s+/u', '-', $tag)}
            {$href = 'tags/'|cat:($key|escape)}
            <a href="{url}" onclick="this.href = '{$href}'">
                {$tag}
            </a>
        {/foreach}
    </div>
{/if}

Обратите внимание Ссылки сделаны без признака nofollow, поскольку мы хотим, чтобы поисковик прошёл и сопоставил с такими тегами именно реальную страницу товара.

SEO без теговой функциональности

Очевидно, найдутся сайты, каким плевать на теговый поиск, но привлекательна продвиженческая составляющая тегов. Тогда тот же код можно записать короче.

{$tags = explode(',', $item->tags|default:'')}
{if !empty($tags)}
    <div class="tags">
        {foreach $tags as $tag}
            <a href="{url}">
                {trim($tag|lower)}
            </a>
        {/foreach}
    </div>
{/if}

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

Улучшенный случай + SEO

Отличается от кода выше тем, что вдобавок устраняет человеческий фактор, когда администратор копипастит теги и не следит за их повторяемостью или небрежен в перечислении. Например этот код правильно обработает, скажем такое перечисление тегов flat, adaptive, , ,, flat , , flat, в то время как код выше 3 раза повторил бы ссылку flat и ещё 4 пустые ссылки.

{$tags = []}

{$list = explode(',', $item->tags|default:'')}
{if !empty($list)}
    {foreach $list as $tag}
        {$tag = trim($tag|lower)}
        {if $tag != ''}
            {$key = preg_replace('/\s+/u', '-', $tag)}
            {$href = 'tags/'|cat:($key|escape)}
            {$tags[$href] = $tag}
        {/if}
    {/foreach}
{/if}

{if !empty($tags)}
    <div class="tags">
        {foreach $tags as $href => $tag}
            <a href="{url}" onclick="this.href = '{$href}'">
                {$tag}
            </a>
        {/foreach}
    </div>
{/if}

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

Расширенный случай: SEO без теговой функциональности

Дело в том, что поле тегов в записи о товаре заполняется не всяким магазином, а поле Meta Keywords, хотя и служит другим целям, но по сути родственно теговому перечислению или прекрасно дополняет его. И вот неплохо было иметь такой код, чтобы учитывал данную особенность полей и объединял их списки в один теговый список. Пожалуйста:

{$tags = []}

{$pack = [ explode(',', $item->tags|default:''),
           explode(',', $item->meta_keywords|default:'') ]}
{foreach $pack as $list}
    {if !empty($list)}
        {foreach $list as $tag}
            {$tag = trim($tag|lower)}
            {if $tag != ''}
                {$key = preg_replace('/\s+/u', '-', $tag)}
                {$tags[$key] = $tag}
            {/if}
        {/foreach}
    {/if}
{/foreach}

{if !empty($tags)}
    <div class="tags">
        {foreach $tags as $tag}
            <a href="{url}">
                {$tag}
            </a>
        {/foreach}
    </div>
{/if}

Стилизация

Пример простой раскраски блока тегов. Эти правила следует расположить в файле стилей вашего шаблона.

.tags {
    border-top: #ddd 1px solid;
    font-size: 10pt;
    margin: .5em 0 0;
    padding: 1em;
    overflow: hidden;
}

.tags a {
    background: #ddd;
    border-radius: 3px;
    display: inline-block;
    float: left;
    line-height: 1.4em;
    margin: .5em 1.5em;
    padding: 0 .5em;
    white-space: nowrap;
}
Обсуждение
«Vlad | 8 окт 12:32
Перекресные ссылки ставят в описании, не тегах. Ссылка без окружающего релевантного текста может быть не засчитана. Тем более ряд близко стоящих ссылок на одну и ту страницу.
Ответить
«Олег | 10 окт 11:45
Еще как засчитываются. Из личного опыта знаю, вообще пофиг рядом или в разрядку анкоры стоят, на одну или разные страницы ссылаются.
Ответить
«sanjit | 11 окт 11:59
Вместо тегов хочу вывести якорными ссылками точные поисковые запросы из подсказок адворд, гугло и яндекс поиска.
Список запросов собрал. 7 наиболее частых на каждый товар.
Так вот могу я вместо tags или meta_keywords перечислить запросы в поле seo текст товара?
Ответить
«tttttt | 11 окт 23:04
Не забыть только поле seo_description хранит html текст. Прежде чем эксплодить перечисление в массив надо стрипнуть теги и декодить &сущности.
Но зачем такие трудности если meta_keywords лучше всего подходит для точных поисковых ключей?
Ответить
«Impera CMS | 12 окт 11:13
Правильно заметил TTTTTT, поисковые запросы разместите в мета кейвордах. Во-первых, сниппет переделывать не придётся. Во-вторых, те же запросы будут видны поисковику как ключевая заголовочная информация о странице, что крайне важно. В-третьих, сохранится функционал касаемо SEO-текстов, иначе, кроме переделки сниппета, нужно убирать из файлов шаблона вывод SEO-текста, ведь в вашем случае он тогда служит другой цели и SEO-текстом как таковым уже не является.

Мне понравилась идея с точными поисковыми запросами для каждого товара. Можно поинтересоваться, как вы автоматизировали их сбор?
Ответить
«sanjit | 12 окт 22:00
Спасибо )) Товаров не много. Запросы собирал руками. Как это делать не руками чесно не знаю.
Ответить
«greencombat | 19 окт 18:14
Гуглу пофиг что написано в мета кейверде, тк этот тег пропускает, а кейверды страницы извлекает из контента по каким то своим правилам.
Ответить
«Михаил | 24 июн 01:08
Ты дебил? Про keywords спроси у гугла!
Ответить
«Игорь | 12 окт 17:23
Упустили Вы такую деталь как наличие тех же теговых ключей на странице товара. Их надо вывести в strong.
Ответить
«SEO'Dzen | 3 ноя 23:41
Где люди вы заражаетесь дебильной верой в магические свойства кейвордов в хеде документа и стронгов в боди? Все хотят полумерой заменить комплекс мер, что называется сео.
Ответить
«Тимош | 4 ноя 22:44
Еще один умник. Говорит о сео, но отрицает испытанную методику.
Ответить
«Иван | 24 июн 01:15
Надо протестить 3-6 месяцев - увидим...
Ответить

Другие обсуждения »

Теги: сниппет, теги, tags, перекрёстные ссылки

Хотите чтобы мы рассказали ещё о чём-то - предлагайте тему.

Предложить

Следите за нашими публикациями в социальных сетях и новостных каналах.