вторник, 9 сентября 2008 г.

Тег MORE в Blogger

Расширенное резюме - это метод, которым пользуются, чтобы показать начало поста. Ну например, чтобы на вашей странице был не один пост, а эдак сколько влезет и, например, по одному параграфу - для наглядности! В blogger реализацию тега more, который используется в таких случаях я не увидел, да и бог с ним - мы простые способы не ищем, а этот мне показался интересным! В итоге мы должны получить приведённое ниже фразу 'прочитать полностью'.
Приступим!


В мануале blogger'а я так всё запутано, что и я тоже запутался. Объясню попроще. Чтобы всё получилось нужно чётко выполнять инструкции и ни-ни в сторону, иначе -.ОПА.

Условный CSS

Первым шагом поместим код так называемого условного CSS. Он заменяет отображение на экране постов на страницах блога. Заходим в Редактировать HTML и сохраняем шаблон - на всякий случай.

Далее прокручиваем шаблон до тега </head> и добавляем следующий код сразу перед этим тегом:

<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>

Удачно? Сохраните шаблон. ВАЖНО: в шаблоне есть такой тег
]]></b:skin> пред тегом </head> именно между ними и надо вставить этот код. В нем мы определили класс "fullpost", который будет появляться только на страницах с вашими постами.

Ссылки "Прочитать полностью..."

Вторым шагом является добавление ссылки Прочитать полностью..., которая будет появляться после каждого резюме вашего поста. Чтобы это сотворить надо включить галочку сверху кода вашего шаблона под названием "Расширить шаблоны виджета". Затем пролистайте вплоть до кода (он обязательно у вас есть) <data:post.body/> и сразу за ним добавьте:

<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url' target='_blank'>Прочитать полностью...</a>
</b:if>

Сохраните шаблон. Эта ссылка будет появляться только на главной странице и по ней будет перекидывать на страницу с вашим 'полноценным' постом.
ОЧЕНЬ ВАЖНО Вааще не трогайте код, ну только если я вам дал наводку, а вы разбираетесь!

Если осилили, то переходим к качеству ссылки! Для читателя важно её видеть, поэтому вместо последнего кода можно засунуть код ( опять же и туда же, но только вместо ) такого плана, Жирный и увеличеный, например такой:

<b:if cond='data:blog.pageType != "item"'>
<span style="font-weight:bold;"><span style="font-size:120%;"><a expr:href='data:post.url' target='_blank'>Прочитать полностью...</a></span></span>
</b:if>

сохраняем!

Изменение вашего поста

Последним шагом создания резюме является изменение шаблона сообщения, который находится в Настройки-Форматирование,
для того чтобы вы каждый раз при написании поста не писали теги для нашего резюме, в общем чтобы автоматически вы видели где само резюме, а где полный текст. Забиваем туда:

Это начало поста(резюме)<span class="fullpost">А это остальной текст поста</span>

Сохраняем изменения шаблона сообщения.
Теперь когда вы будете писать новый пост, вам нужно будет удалить "Это начало поста(резюме)" и "А это остальной текст поста", а теги в скобках не трогать и писать соответственно в начале до первого тега резюме, а между первым и вторым тегом - продолжение поста.

Преимущество способа

Дополнительные ссылки - при индексировании не помешают и текст открывается в новом окошке!
Удачи!

Источник: Делаем расширенное резюме поста

7 комментариев:

Анонимный комментирует...

Здравствуйте! Сделала в свом блоге все, как у Вас написано, кнопка "читать дальше" появилась. все нормально. НО она появилась не после первого абзаца, а в самом конце сообщения. Подскажите, пожалуйста, как это можна исправить (т.е. чтобы кнопка появлялаь после первого абзаца, а не в конце сообщения).
Спасибо.

Tenant комментирует...

Текст, который не должен быть виден на главной (индексной) странице, должен размещаться внутри тега span.fullpost
Например:
<span class="fullpost">Этот текст будет виден, только на странице просмотра сообщения (Кнопка «читать далее»).</span>
P.S. больше материала по настройке шаблонов Blogger здесь: Сварено на руби / блоггер.

Анонимный комментирует...

Спасибо, буду пробовать :)

Croaker комментирует...

Не мучайся :). Есть более свежее решение от команды Blogger. Вот здесь девушка давала описание: о блоге.

Анонимный комментирует...

Спасибо! Именно так и сделала :) Но там девушка допустила ошибку и не закрыла div.
Правильно написано тут: http://www.google.com/support/blogger/bin/answer.py?answer=154172

amabilisa комментирует...

Огромное спасибо тебе, добрый человек! Всё заработало сразу, красиво и без нареканий. Просто супер!

Croaker комментирует...

amabilisa, рад помочь! :)

Это так называемый «классический» кат в Blogger. Но эта техника уже полгода как устарела.

Теперь в Blogger есть «родной», встроенный кат или тег MORE:

<!-- more -->

Много полезного материала по настройке шаблонов Блоггера есть в блоге dotRB.