Breaking News
Loading...
понедельник, 2 ноября 2009 г.

Источник: http://seorussian.blogspot.com

Итак, он хорош тем, что при его использовании внизу появляется ссылка "Читать дальше" (или любые другие слова, что захотите, то и пишите). При этом, ссылка появляется только в тех постах, в каких вы её сами сделаете, а не во всех подряд (как это происходит в первом, упомянутом мною, способе). Эту ссылку можно будет настраивать - где она появится (справа или слева), какого будет цвета, какого размера шрифт и т.п.
Кроме этого, в полном посте не будет ненужных разрывов, предложения "свернуть назад", и при попадании прямо на страницу конкретного сообщения человеку не надо будет дополнительно щёлкать "развернуть".
Всё это немаловажно для меня.
При нажатии на ссылку происходит направление читателя на страницу полного сообщения. 
Должен отметить, что я встречал в сети и другие способы, использующие внешние ява-скрипты. То есть те, которые располагаются на сервере у того дяди, который их написал.
Эти способы я вообще не рассматривал (и вам не советую), т.к. дядя может забыть заплатить за хостинг и т.п. После чего всё перестанет действовать.

Как его реализовать?
Вначале, как обычно, сохраняем, на всякий случай, уже имеющийся у нас вариант шаблона на жёсткий диск (на тот случай, чтобы если что-то не выйдет - можно было всё восстановить).
Этот способ реализовать не сложно (хотя и чуть-чуть дольше чем остальные),  но надо быть очень внимательным, т.к. можно случайно ошибиться.

Идём в макет/изменить HTML и ставим галочку на "расширить шаблоны виджета".
Теперь нам надо добавить код прямо перед тегом </head>.
Вот этот код:

<b:if cond='data:blog.pageType != "item"'>
<script type="text/javascript">

var fade = false;
function showFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i &lt; spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Appear(spans[i]);
} else spans[i].style.display = 'inline';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'none';
if (spans[i].id == "hidelink")
spans[i].style.display = 'inline';
}
}

function hideFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i &lt; spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Fade(spans[i]);
} else spans[i].style.display = 'none';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'inline';
if (spans[i].id == "hidelink")
spans[i].style.display = 'none';
}
post.scrollIntoView(true);
}

function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i &lt; spans.length; i++) {
if (spans[i].id == "fullpost") {
spans[i].style.display = 'none';
found = 1;
}
if ((spans[i].id == "showlink") &amp;&amp; (found == 0))
spans[i].style.display = 'none';
}
}

</script>
</b:if>

Затем, в коде своего блога вам надо найти строку вида:

<p><data:post.body/></p>

Но в разных темплейтах она может быть несколько другой. К примеру вот такой:

<div class='post-body>  или такой:

<p><data:post.body/></p>   или такой:

<div style='clear: both;'/> <!-- clear for photos floats -->

   </div>

Вообщем найдите (используйте Ctrl+F, это удобно) у себя тег <data:post.body/> или его вышеприведённое подобие у себя в коде.

Вот. Далее внимание.
Чуть выше его будет строка, которая в разных темплейтах тоже может немного разниться. Она имеет такой вид (3 варианта):
div class='post'

div class='entry'

div class='post-body entry-content

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

<div class='post-body'  expr:id='"post-" + data:post.id' >

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

        <p><data:post.body/></p>

       <span id='showlink'>
        <a expr:href='data:post.url'>Читать дальше......</a>
       </span>
       <script type='text/javascript'>
         checkFull("post-" + "<data:post.id/>");
       </script>
     </b:if>

     <div style='clear: both;'/> <!-- clear for photos floats -->
   </div>

Обратите внимание, на закрывающий значёк " ' " сразу после первых букв "div class='post-body - если вы забудете его, то темплейт не сохраится и выдаст ошибку.

Всё, если вы всё сделали так как тут сказано - сохраняйте шаблон.
Затем идите в настройки/форматирование.
В рамке внизу, над которой значится "шаблон сообщения", добавляем строки:

Превью поста

<span id="fullpost">

То, что скрыто под катом

</span>

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