Объявление
Уважаемые читатели, друзья, подписчики. В связи с участившимся и, порядком надоевшим спамом в комментариях от всяких анонимах(будь они не ладны), я вынуждена включить модерацию комментариев на некоторое время. Очень надеюсь на ваше понимание.

Как автоматически сделать ссылку читать далее в Блоггере

Всем доброго времени суток. Вот и первый пост в Новом 2016 году. Праздники это хорошо, но, как говорится - делу время. Приходится потихоньку возвращаться к будням. И шпаргалка сегодня о том, как в Блоггере сделать ссылку читать дальше автоматически. 
ссылка читать дальше
Обычно, чтобы отобразить на главной странице блога анонс сообщения с миниатюрой мы пользуемся кнопкой в редакторе, которая позволяет нам сократить пост в нужном месте.


Если немного покопаться в шаблоне блога, то можно сделать идеальный вариант для тех, кто использует расширяемые сообщения. Скрывает текст под катом. Не нужно будет использовать каждый раз кнопку Вставить ссылку дальше. Миниатюры и часть текста на главной странице постоянно будут выводиться автоматически. И выглядеть это будет более аккуратно, чем привычным многим образом.

К делу.

Шаг 1. Заходим во вкладку шаблон и обязательно сделаем резервное копирование. А вдруг что-то не так пойдёт. С помощью клавиш Ctrl+F находим вот такую строку.

<data:post.body/>

Обычно их в шаблоне 2 или 3. Нам нужна последняя. Копируем следующий код.
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script  type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;,&quot;<data:post.url/>&quot;,&quot;<data:post.title/>&quot;);</script>
 <span class='readmore' style='float:right;'><a  expr:href='data:post.url'>Далее  &#187;</a></span></b:if></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>
Аккуратно удаляем строчку <data:post.body/> и вместо неё устанавливаем, скопированный код. 






Где написано  Далее, (отмечено синим цветом) напишите что-своё. Если есть желание установить картинку вместо слова, то аккуратно удалите Далее  &#187; и вставьте  Html-код вашей картинки: <img src="http://адрес  картинки" alt="Читать далее"/>.

Шаг 2. Там же в шаблоне немного выше ищем закрывающийся тег </head> и над ним вставляем следующий код.

<script type='text/javascript'>
posts_no_thumb_sum = 490;
posts_thumb_sum = 400;
img_thumb_height = 160;
img_thumb_width = 180;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID, pURL, pTITLE){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = posts_no_thumb_sum;
if(img.length>=1) {
imgtag = '<span class="posts-thumb" style="float:left; margin-right:  10px;"><a href="'+ pURL +'" title="'+ pTITLE+'"><img  src="'+img[0].src+'" width="'+img_thumb_width+'px"  height="'+img_thumb_height+'px" /></a></span>';
summ = posts_thumb_sum;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style type='text/css'>
.post-footer {display: none;}
.post {margin-bottom: 10px; border-bottom: 1px dotted #E6E6E6; padding-bottom: 20px;}
 .readmore a {text-decoration: none; }
</style>
</b:if>
</b:if>

Вот некоторые значения, которые можно в коде поменять.

posts_no_thumb_sum = 490; количество выводимых символов если не используется картинку.

posts_thumb_sum = 400;-количество символов с картинкой. 


img_thumb_height = 160; высота отображаемой миниатюры

img_thumb_width = 180; ширина миниатюры. 

Теперь нажмите на кнопку просмотр и если нет замечаний смело нажимайте сохранить. 

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

Всем хорошего Новогоднего настроения, приятного отдыха, морозных денёчков. До встречи. И, конечно, же спасибо, что читаете шпаргалки блогерши.

здесь можно оформить подписку на новые шпаргалки

Введите Ваш email


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

  1. Интересный вариант, нужно будет попробовать)

    ОтветитьУдалить
    Ответы
    1. Попробуй, конечно, если понравилось.

      Удалить
  2. Прикольный блог, Вика, поздравляю. Тоже что ли соорудить блог? Думаю.

    ОтветитьУдалить
  3. Спасибо, Гузель. Ну уж коль тебе , человеку творческому понравилось, значит я на верном пути. А чего не сделать. Опыт у тебя уже есть. Главное тему найти по душе.

    ОтветитьУдалить
  4. Здравствуйте Виктория!
    В данной статье Вы написали использовать последний , но на картинке Вы указали на первый.
    Так какой использовать?

    ОтветитьУдалить
  5. Dima Nosenko скриншот не тот видимо вставила . Надо ориентироваться на последнюю. В нём в любом случае должна быть jump-link. Вообще с этими сторонними шаблонами всегда проблема. Не пойми где что.
    Я свои меняла -мозги опухли.

    ОтветитьУдалить
  6. Данный способ, сработал только на трёх сообщениях, потом отказывается работать... не пойму почему???

    ОтветитьУдалить
  7. Виктор, тут от шаблонов зависит или мешает какой - то javascript. Такая же фигня с гаджетом транслит происходит. Тоже не на всех блогах корректно встаёт. Ещё посмотри, может у тебя больше фрагментов <data:post.body/> . помню кто - то мне писал, что нашёл их в шаблоне аж 5.

    ОтветитьУдалить
  8. Шаблон стандартный "Простой", еще ничем не загажен, пост.боди всего два. Может быть еще из за того, что в два столбца сообщения??? Я пока всё отключил, буду в ручном режиме "cut" использовать.
    Всё равно постараюсь его где нить применить, возможно на новых шаблонах.=)

    ОтветитьУдалить
  9. Возможно. А где у тебя в 2 столбца. вчера на пингвине смотрела, вроде в один.

    ОтветитьУдалить
  10. Я сделал блог под шаблоны и два столбца там....
    templates .whitepingvin. ru

    ОтветитьУдалить
  11. Да, Виктор. Посмотрела.

    ОтветитьУдалить

ВСЕГДА РАДА УСЛЫШАТЬ ВАШЕ МНЕНИЕ!
Ели у вас возникла необходимость опубликовать код в комментарии, то воспользуйтесь encoder HTML