Устанавливаем кнопку "Читать далее" на Blogger (Blogspot)





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

Кнопка должна привлечь внимание читателя и в то же время гармонично вписываться в общее оформление блога.

Первым делом необходимо создать изображение кнопки с нужной надписью: "Читать далее" или подобным текстом. 

Для создания кнопок существует много онлайн-сервисов, например, можно воспользоваться dabuttonfactory  либо создать нужное изображение в Фотошоп

Далее, загружаем файл на любой хостинг для хранения картинок (например Радикал-фото), можно воспользоваться веб-альбомом Picasa.
После загрузки нажимаем на картинку правой кнопкой мышки и копируем URL изображения. 
Далее нужно внести изменения в HTML-код шаблона (перед правкой делаем резервную копию шаблона, чтобы в случае необходимости отменить изменения).

В шаблоне с помощью сочетания клавиш CTRL+F находим строку:
_________________________________________________________________
<data:post.jumpText/>
_________________________________________________________________

вместо этого кода вставляем такой:
_________________________________________________________________
<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ3Ni4M1e5DyEsLJxZsSE-XJM7crEclOZMzSJJCbq-RC3rXMcU1pxnFRnvlRbD98Evb8ZTz7lgQ3HP2H69eDBQH5EqsVgY-r6aBVCdoGK22sNYRsjPGJgjTFGW8qOeqDHBRc3DdA2mEQk/s128-Ic42/Button.png" /></A>
</DIV>

</b:if>
_________________________________________________________________
где цветом выделен URL изображения.

Наша кнопка "Читать далее..." готова:
Устанавливаем кнопку "Читать далее" на Blogger (Blogspot)
Сделаем свой блог лучше! Удачи!

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

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