Хаки и Скрипты Next Generation CMS : Настройка плагинов, Разное : Правильная разметка Breadcrumb

irbees2008 Опубликовано - 6 - марта Настройка плагинов

Адаптировал: irbees2008
Уровень сложности исполнения: это делается простым копированием и нажиманием кнопки

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

И так как же модифицировать Breadcrumb в соответствии с стандартом schema.org. Смотрим документацию http://schema.org/BreadcrumbList.

Там есть вот такой пример :

Код:

<ol itemscope itemtype="http://schema.org/BreadcrumbList">
  <li itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/dresses">
    <span itemprop="name">Dresses</span></a>
    <meta itemprop="position" content="1" />
  </li>
  <li itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/dresses/real">
    <span itemprop="name">Real Dresses</span></a>
    <meta itemprop="position" content="2" />
  </li>
</ol>

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

Открываем шаблон плагина Breadcrumb (/engine/plugins/breadcrumbs/tpl) файл breadcrumbs.tpl
И видим там такой код

Код:

<div class="frame-crumbs">
    <div class="crumbs" xmlns:v="http://rdf.data-vocabulary.org/#">
        <div class="container">
            <ul class="items items-crumbs">
                {% for loc in location %}
                <li class="btn-crumb">
                    <a href="{{ loc.url }}" typeof="v:Breadcrumb"><span class="text-el">{{ loc.title }}</span></a>
                    <span class="divider">/</span>
                </li>
                {% endfor %}
                {% if (location_last) %}
                <li class="btn-crumb">
                    <button typeof="v:Breadcrumb" disabled="disabled">
                    <span class="text-el">{{ location_last }}</span>
                    </button>
                </li>
                {% endif %}
            </ul>
        </div>
    </div>
</div>

И заменяем весь код на вот этот

Код:

<div class="frame-crumbs">
    <div class="crumbs" >
        <div class="container">
            <ul class="items items-crumbs" itemscope itemtype="http://schema.org/BreadcrumbList">
                {% for loc in location %}
                <li class="btn-crumb" itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
                    <a itemprop="item" href="{{ loc.url }}" ><span class="text-el" itemprop="name">{{ loc.title }}</span></a>
		    <meta itemprop="position" content="1" />
                    <span class="divider">/</span>
                </li>
                {% endfor %}
                {% if (location_last) %}
                <li class="btn-crumb" itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem">
                    <a itemprop="item" href="{{ news.url.full }}">
                    <span class="text-el" itemprop="name">{{ location_last }}</span></a>
		     <meta itemprop="position" content="2" />
                </li>
                {% endif %}
            </ul>
        </div>
    </div>
</div>

Сохраняем, и можете проверять ,как видно на изображении Гугл одобрил .

Можешь почитать и вот эту статейку "Смена оформления сайта или фона сайта по времени суток"

Это тоже интересно

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