05.06.2007

Тизеры на blogger.com

С сожалением должен констатировать, что создание тизеров (коротких версий постов для первой страницы) на blogger.com не реализовано никак. Это не значит, что использовать их невозможно. Как видите, мне удалось найти способ. Но как-то это всё не очень правильно.

В поисках сильно помог вот этот пост Андрея Тряпичникова. Но там опять же непосвященному человеку не всё понятно, поэтому опишу метод подробно.

Суть идеи

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

В шаблон, в тучасть, которая генерирует html-заголовки, добавляем проверку на предмет того выводим ли мы индивидуальную страницу поста. Если это не индивидуальная страница, то вставляем в код страницы css-селектор, скрывающий div с основным текстом поста.

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

Шаг 1

В настройках блога, в подразделе «форматирование», в самом низу страницы есть поле «Шаблон сообщения». В нём пишем следующее:

<div class="teaser">
Обрезок
</div>
<div class="body">
Полный текст
</div>

Шаг 2

Теперь нужно внести изменения в шаблон. Прямо перед </head> вставляем вот такое:

<style type='text/css'>
<b:if cond='data:blog.pageType != "item"'>
div.body {display:none;}
</b:if>
</style>

Шаг 3

Ищем в шаблоне же includable id=”post” var=”post”. Внутри него, в принципе не важно в каком конкретно месте, это зависит от того где хочется видеть ссылку, вставляем вот такое:

<b:if cond='data:blog.pageType != "item"'>
  <div class='readon'><a expr:href='data:post.url'>читать дальше</a></div>
</b:if>

У меня вставлено после вот этих строчек:

<!-- quickedit pencil -->
<b:include data='post' name='postQuickEdit'/>

Заключение

Разумеется, работать это всё будет только со специально составленными постами. Собственно, для облегчения составления новых постов и делался Шаг 1.

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

Неудобно то, что нельзя дать тизер, не являющийся частью основного поста. Можно конечно добавить стиль, скрывающий тизер на индивидульной странице, но тогда получается некрасиво в RSS канале, поскольку там css-стили не действуют.

Вообще решение довольно неуклюжее, но другого мне найти не удалось. Если кто-нибудь знает как это сделать лучше - пишите, буду рад.

Комментарии

21.08.07 21:40 ... комментирует:

а зачем дублировать тизер?
просто в тизере первая часть текста, а в боди - вторая.
и никаких проблем, в том числе и с рсс.

22.08.07 08:27 Зови просто X комментирует:

Это круто, спасибо тебе, попробую использовать :)

09.10.08 20:16 Felix комментирует:

Вечер добрый, такая проблема: пи стандартном шаблоне всё работает, под своим - не хочет((((…текст под кат не уходит, а надпись «Читать дальше» есть, но толку никакого((…а сверхк надпись есть «span.fullpost {display:none;}»
В общем, прошу помощи!

11.10.08 07:47 uptimebox комментирует:

Стиль неправильно объявлен. Проверьте ещё раз часть, описанную в шаге 2.

01.12.08 02:01 MATRЁSHKA комментирует:

THANX!!!!!!!!!!!!!!!!!!!!!!

19.05.09 18:01 [k06a] комментирует:

Ну просто никак не могу найти ничего похожего на:
<b:include data=”post” name=”postQuickEdit”/>

19.05.09 18:31 [k06a] комментирует:

Прошёл по вашей ссылке.
Тот метод мне больше понравился.
И заработал зато.
Нужно было расширенные виджеты включить.

23.02.10 11:01 CloverM комментирует:

Спасибо, текст убрался.
Но вот возник вопрос.
В коротких постах, где мне не нужно прятать часть текста, все равно в конце вылезает надпись «читать дальше». Можно это как-то побороть?
Т.е. длинные посты посты прятать, а короткие оставлять видимыми и без надписи «читать далее»
 

Ответить