Как добавить иконки-превьюшки в Blogger

Давно ничего не меняла в блоге. А тут захотелось немного его приукрасить, прицепить брошку-бантик. Побродила по интернету и вернулась с уловом: очаровательные иконки-превьюшки в конце поста.

Возможно, их мало кто и заметит, а мне душу греет. Мелочь, а приятно.

Так теперь может выглядеть и ваш блог.

И цветные кнопки соцсетей от платформы Blogger тоже смотрятся неплохо.

Добавляем наши иконки: "Дизайн" -- "Изменить HTML"  и перед ]]></b:skin> вставим код:

Код:

.post-author{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhloFvLKc0GS0WuysXI49lYgcRrrSdxDHQ2ZR7wIuYexnb97MCOFNuuwKoc65T9yo_GcuOf-s05DT7i85FPXYXsKnn74W4kU7yrXpBJbRhcuh6nSXoJnrdQTv4AxQiWqPs0rTyjXG2HaQo/s1600/calendar.png) no-repeat scroll left center;
padding:2px 0px 2px 20px;
}
.post-labels {
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFN498UwDI2jNnI74hOXWEqM6iqwDvvSH7NZbUJ2GtHhhAsugIiBxSjQMZ1NJUMRX2qJuD7-PqTGuIWJrMAY1BuUg07P-XS6BkNkObkENwpfg9F4Z0r7c-a8B6WoxLcss4ur-LTWFXm1o/s1600/box.png) no-repeat scroll left center;
padding:2px 0px 2px 20px;
}
.post-comment-link {
background:transparent url(http://https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLKkQI387DZrJMlmN1hRg1MubmwHj7UEUPSAl1b27TGHbrx10WiNoXGzlXe8VfIfjlO7GqObSJ1zYYZNAPD_XsNuuNqt-cK_heQJVtYKeJNv0XHG4qv3uPIjJy0_zQH4Al7KYhYwydwbE/s1600/balloon.png) no-repeat scroll left center;
margin-right:10px;
padding:2px 0px 2px 20px;
}

Все просто. Пять минут - и желаемое достигнуто. Только учтите что данный вариант применим только на стандартных шаблонах Blogger.Можете даже поменять превьюшки на свои, если найдете что-то поинтереснее. Это легко сделать, заменив в коде URL картинок (http://1.bp.....png ). 

Код позаимствовала у автора Bloggarolla.

Понравилась статья? Поделитесь с друзьями.