Автоматическая обрезка постов для главной страницы в Blogger

Так же этот метод азывают auto read more. Его суть состоит в том, чтобы выводить на главной, архивной и ярлыковой страницах изображение из сообщения, кусочек текста и надпись для перехода к статье, которую вы привязали к тегу more (читать далее) из админки.

Реализуется за счёт шаблона, настраивается с помощью css, без участия javascript, который в данном случае - костыль, так как нам сео важнее красоты.

Чтобы это дело заработало в блоге (Blogger), надо:
1) Забекапить свой шаблон!
2) Найти через поиск браузера (crtl+f) строку data:post.body/ (она же <data:post.body/>)
4) Заменить её на вот этот кошмар:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
 <data:post.body/>
 <b:else/>
 <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
 <data:post.body/>
 <b:else/>
 <b:if cond='data:post.hasJumpLink'>
 <data:post.body/>
 <b:else/>
 <b:if cond='data:post.snippet'>
 <b:if cond='data:post.thumbnailUrl'>
 <div class='Image thumb'>
 <img expr:src='data:post.thumbnailUrl'/>
 </div>
 </b:if>
 <data:post.snippet/>
 <div class='jump-link'>
 <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
 </div>
 <b:else/>
 <data:post.body/>
 </b:if>
 </b:if>
 </b:if>
 </b:if>

5) Перед тегом:
]]></b:skin>
Вставить:

.thumb img {
   float: left;
   margin: 0 10px 10px 0;
 }

left - изображение находится слева. Если нужно справа, то ставьте right.
margin - это отсупы от картинки до текста анонса
Также можно насильственно здесь изменить размер (имейте ввиду, что меняться будет thumbnail, поэтому хорошего качества не будет), добавив ширину в процентах и высоту автоматически (чтобы не потерять пропорцию изображения):
width: 20%;
height: auto;

Что получится?
Для наглядной демонстрации я создал тестовый блог, в котором опубликовал два сообщения: обрезанное тегом more и не обрезанное.

Пост, который мы не обрезали тегом <!-- more --> будет выглядеть вот так:

Т.е. то, что нам нужно: автоматическая обрезка постов и кнопка "далее" (заменить на нужную надпись)

Пост, в который вставлен тег <!-- more -->, останется без каких либо изменений и подчинится стандартным правилам шаблона:

И самый больной вопрос в таких кодах-автокропах - это статические страницы:

Но в данном случае статическая страница осталась без изменений, в чём и нужно было убедиться.

На архивной странице тоже всё в порядке:

Источник.