Оптимизация мобильного шаблона blogger (blogspot)

Blogger (blogspot) передовая, лёгкая, бесплатная cms платформа, но как и любая система управления контентом имеет слабые стороны. Одна из них - мобильный шаблон, вернее его главная страница которая в исходном состоянии существует лишь для галочки. При проверке её наличия в поиске Яндекса, получаем ответ: «страница знакома роботу, но отсутствует в поиске, так как не несёт значимости». И правда, кому нужна по сути пустая страница, на которой имеются лишь ссылки-заголовки с пятьюдесятью знаками текста в придачу, да мизерные изображения которые можно разглядеть только в лупу. Тем не менее она - главная, имеет огромную значимость для ресурса и мы сделаем её основным двигателем сайта в мобильном поиске, немыслимо набирающем обороты, проведя оптимизацию мобильного шаблона blogger (blogspot).

Чтобы оценить результат оптимизации мобильного шаблона blogger (blogspot) и решить стоит ли заморачиваться, скопируйте урл главной страницы этого блога, прибавьте ?m=1 и протестируйте в этом сервисе, а потом проделайте тоже самое с главной страницей своего блога. Вы поймёте разницу, даже не являясь средней руки веб-мастером, а наградой за труды станет огромное увеличение посещаемости с мобильных платформ.

За отображение главной страницы в blogger (blogspot) на мобильных устройствах отвечает id='mobile-index-post'. Раскрываем этот раздел в редакторе шаблона удаляем имеющийся там код и вставляем этот:

<div class='mobile-date-outer date-outer'> <div class='mobile-post-outer'> <div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'> <div class='date-posts'> <div itemprop='image' itemscope='itemscope' itemtype='https://schema.org/ImageObject'> <img expr:alt="data:post.title" expr:src="data:post.thumbnailUrl" itemprop="image" style="display:none;"/> <img expr:alt="data:post.title" expr:src="data:post.thumbnailUrl" itemprop="url" style="display:none;"/> <meta content='450' itemprop='width'/> <meta content='300' itemprop='height'/> </div> <a expr:name='data:post.id'></a> <time class='updated' expr:content='data:post.timestampISO8601' expr:datetime='data:post.timestampISO8601' itemprop='dateModified'> <data:post.timestampISO8601/> </time> <b:if cond='data:post.title'> <b:if cond='data:post.link'> <div class='post-header'> <div class='post-header-line-1'/> </div> <div class='post-body entry-content' expr:id='"post-body-" + data:post.id' itemprop='articleBody'> <data:post.body/> <div style='clear: both;'/>  </div> <a expr:href='data:post.url'> Читать дальше » </a> <div class='post-footer'> <div class='post-footer-line post-footer-line-1'> <span class='post-author vcard'> <span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'> <span itemprop='name'> Автор </span> </span> </span> </div> </div> </div> </div> </div> </div>

Этот код главной страницы мобильного шаблона имеет валидную разметку всех элементов в классификации schema.org для браузеров Яндекс и Google. Чтобы разметка была правильной и в самом сообщении сделайте её идентичной в id='mobile-post'. После этого мобильная версия вашего блога на blogger (blogspot) будет индексироваться поисковой системой Яндекс и иметь правильную разметку. Советую проделать тоже самое и с desktop вариантом (id='post'), для увеличения валидности.