Подписка RSS

Подписка на блог по RSS

четверг 25 2024

Кнопка "Читать далее" : Как изменить ссылку "Read More" в Blogger

Установка на blogspot кнопки "Читать далее"

Кнопки являются очень важным элементом дизайна сайта. В этой статье я покажу, как установить кнопку "Читать далее".   Кнопка должна привлечь внимание читателя и в то же время гармонично вписываться в общее оформление блога.



 Главная страница — важная часть каждого блога. Она должна содержать до 5-6 постов, чтобы максимально привлечь внимание читателя. Удержать читателя дольше — это то, что я называю успехом блога...❞

Кнопка «Reed more» (Читать далее) заменяет ссылку на полную статью. Это достаточно удобно для читателя, когда на главной странице блога отображено лишь начало поста, отображающее основной смысл всей статьи. Положительно к такой разбивки относятся и поисковики, так как в этом случае уменьшается процент дублированного контента. Ниже на скриншоте подробное пошаговое описание как настроить запись и убрать "лишний" с точки зрения СЕО тег "#more" из кода разделения статьи.


Как вставить ссылку «Читать дальше»

  •  В режиме верстки текстового редактора сообщения ставим курсор в том месте статьи, где хотим ее разделить. Пункты 1 и 2 на скриншоте. Сразу после этого увидите под текстом полосу — она отделает анонс от полной записи.
  • Если переключиться в HTML режим, то увидите, что в коде применился специальный тег
    <! —more—>. Пункт 3 на скриншоте.
  • Для настройки или изменения самого текста ссылки «Читать…» заходим во вкладку Дизайн>Гаджет Сообщения блога> Изменить и в появившемся окне вы можете менять настройки по своему усмотрению. Пункт 4 на скриншоте.
    💡Не забудьте после этого сохранить все настройки.

Избавляемся от тега #more&quot;

💡Способ реализуются за счет правки шаблона Blogger для темы Watermark 💡

  • Раздел Тема> Настроить> Редактировать HTML. Ставим курсор в любом месте кода шаблона: Тема> Ctrl+F. В левом верхнем углу окна редактора HTML кода появится окно с текстом «Search».
  • В этом окне надо ввести HTML код: <div class='jump-link’> для поиска и нажать клавишу «Enter»💡(При наличии такого кода в шаблоне HTML будет выполнен переход на него. Первый найденный HTML скрипт в окне редактора выделится тёмно-жёлтым цветом.)💡
  • Удаляем старый код и вставляем новый. Пункт 5 на скриншоте выше.
  • Нажимаем на значок в форме дискеты с всплывающим текстом "Сохранить".  (Этот значок предназначен для сохранения изменений, внесённых в код темы Blogger.)
/*этот код копируем и вставляем вместо старого*/

<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:if cond='data:blog.pageType != &quot;item&quot;'> <div class='readmore'> <a expr:href='data:post.url'><data:post.jumpText/></a> </div> </b:if> </b:if>

Комментариев нет:

Отправить комментарий

Если понравилась статья, то оставьте, пожалуйста, комментарии!

Статистика блога

Популярные сообщения

Blogger Tricks

Blogger Themes

Форма для связи

Имя

Электронная почта *

Сообщение *