Установка на blogspot кнопки "Читать далее"
Кнопки являются очень важным элементом дизайна сайта. В этой статье я покажу, как установить кнопку "Читать далее". Кнопка должна привлечь внимание читателя и в то же время гармонично вписываться в общее оформление блога.Главная страница — важная часть каждого блога. Она должна содержать до 5-6 постов, чтобы максимально привлечь внимание читателя. Удержать читателя дольше — это то, что я называю успехом блога...❞
Кнопка «Reed more» (Читать далее) заменяет ссылку на полную статью. Это
достаточно удобно для читателя, когда на главной странице блога отображено
лишь начало поста, отображающее основной смысл всей статьи. Положительно к
такой разбивки относятся и поисковики, так как в этом случае уменьшается
процент дублированного контента. Ниже на скриншоте подробное пошаговое
описание как настроить запись и убрать "лишний" с точки зрения СЕО тег
"#more" из кода разделения статьи.
Как вставить ссылку «Читать дальше»
- В режиме верстки текстового редактора сообщения ставим курсор в том месте статьи, где хотим ее разделить. Пункты 1 и 2 на скриншоте. Сразу после этого увидите под текстом полосу — она отделает анонс от полной записи.
- Если переключиться в HTML режим, то увидите, что в коде применился специальный тег
<! —more—>. Пункт 3 на скриншоте. - Для настройки или изменения самого текста ссылки «Читать…» заходим во вкладку Дизайн>Гаджет Сообщения блога> Изменить и в появившемся окне вы можете менять настройки по своему усмотрению. Пункт 4 на скриншоте.
💡Не забудьте после этого сохранить все настройки.
Избавляемся от тега #more"
💡Способ реализуются за счет правки шаблона Blogger для темы Watermark 💡
- Раздел Тема> Настроить> Редактировать HTML. Ставим курсор в любом месте кода шаблона: Тема> Ctrl+F. В левом верхнем углу окна редактора HTML кода появится окно с текстом «Search».
- В этом окне надо ввести HTML код: <div class='jump-link’> для поиска и нажать клавишу «Enter»💡(При наличии такого кода в шаблоне HTML будет выполнен переход на него. Первый найденный HTML скрипт в окне редактора выделится тёмно-жёлтым цветом.)💡
- Удаляем старый код и вставляем новый. Пункт 5 на скриншоте выше.
- Нажимаем на значок в форме дискеты с всплывающим текстом "Сохранить". (Этот значок предназначен для сохранения изменений, внесённых в код темы Blogger.)
/*этот код копируем и вставляем вместо старого*/
<b:if cond='data:blog.pageType != "static_page"'> <b:if cond='data:blog.pageType != "item"'> <div class='readmore'> <a expr:href='data:post.url'><data:post.jumpText/></a> </div> </b:if> </b:if>
Комментариев нет:
Отправить комментарий
Если понравилась статья, то оставьте, пожалуйста, комментарии!