Доброго времени суток, друзья. Вы обращали внимание, что в ленте комментариев Блоггер нет нумерации. Это не совсем удобно, когда комментариев много и возникает необходимость перенаправить пользователя к тому или иному комментарию. Предлагаю для вас самый простой вариант, как сделать иконку у каждого комментария.
Раньше я публиковала похожий пост как сделать нумерацию и отобразить общее количество комментариев. Сегодня немного приукрасим. Вам останется всего лишь подобрать подходящую иконку и установить код, который предлагаю. Готовые иконки с адресами вы можете взять в этом сообщении.
.comment-thread ol {
counter-reset: countcomments;
}
.comment-thread li:before {
content: counter(countcomments,decimal);
counter-increment: countcomments;
float: right;
z-index: 2;
position:relative;
font-size: 22px;
color: #555555;
padding-left:10px;
padding-top:3px;
background: url(http://4.bp.blogspot.com/-f6ByQfbwApQ/T4x_8p1FGpI/AAAAAAAAB2A/WJKf-ybmvQk/s1600/comment+bubble2.png) no-repeat;
margin-top:7px;
margin-left:10px;
width: 50px; /*ширина иконки*/
height: 48px; /*высота*/
}
.comment-thread ol ol {
counter-reset: contrebasse;
}
.comment-thread li li:before {
content: counter(countcomments,decimal) "." counter(contrebasse,lower-latin);
counter-increment: contrebasse;
float: right;
font-size: 18px;
color: #666666;
}
counter-reset: countcomments;
}
.comment-thread li:before {
content: counter(countcomments,decimal);
counter-increment: countcomments;
float: right;
z-index: 2;
position:relative;
font-size: 22px;
color: #555555;
padding-left:10px;
padding-top:3px;
background: url(http://4.bp.blogspot.com/-f6ByQfbwApQ/T4x_8p1FGpI/AAAAAAAAB2A/WJKf-ybmvQk/s1600/comment+bubble2.png) no-repeat;
margin-top:7px;
margin-left:10px;
width: 50px; /*ширина иконки*/
height: 48px; /*высота*/
}
.comment-thread ol ol {
counter-reset: contrebasse;
}
.comment-thread li li:before {
content: counter(countcomments,decimal) "." counter(contrebasse,lower-latin);
counter-increment: contrebasse;
float: right;
font-size: 18px;
color: #666666;
}
Синим цветом отмечена строка с адресом картинки - иконки в формате png.
Скопируйте предложенный код. Заходим во вкладку ТЕМА - изменить HTML. Находим строку ]]></b:skin> и сразу над ней вставляйте код. Не забудьте сохранить изменения.
Можно сделать нумерацию комментариев как у меня на этом блоге. Вот эта статья.
Желаю всем удачи, терпения и здоровья.
здесь можно оформить подписку на новые шпаргалки
"когда комментариев много". Ой завидно аж стало, что у кого-то много.
ОтветитьУдалитьСаша, вон у девчат педагогов, до сотни бывает . Это удобно.
УдалитьСпасибо, Виктория! В последнее время мне много пишут в Блог Кота Васьки. Весь мир неожиданно полюбил кошек!!!
ОтветитьУдалитьИрина, ну тебе непременно нужно установить нумерацию. Вот у меня бывает повторно спрашивают что - то и дабы не писать снова говорю посмотрите комментарий , допустим 3.2.
ОтветитьУдалитьСовсем не глупо! Вика, может быть Вы сбросите мне на "мыло" более подробную инструкцию. Я пока не могу понять двух вещей:
ОтветитьУдалить1. Надо ли копировать для пользования соответствующе функцией полностью всю, публикуемую Вами ссылку, или только выделенную цветом её часть?
2. Куда эту ссылку следует сбрасывать?
И главное: как застраховать себя от того, чтобы куда чего лишнего не сбросить и не стереть информацию, как у меня, сдуру, случилось в начале моей блогерской карьеры; или не получить дурацкую инструкцию, которую Вы мне не посылали, из-за чего мы чуть не рассорились!
Буду весьма благодарен, хоть не уверен, что пойму, что и как надобно делать.
Семён, здесь не ссылку нужно копировать, а весь код целиком. Естественно и сбрасывать не нужно. Боюсь, что у Вас не получиться. Это нужно в самом шаблоне делать. Оставьте лучше эту затею.
ОтветитьУдалитьНу, что делать! Буду "поститься" старым казацким методом.
ОтветитьУдалитьИнтересная фишка. Спасибо, Вика!
ОтветитьУдалитьИнтересно, Викуля. Потренируюсь на "пробном"
ОтветитьУдалитьЛюба, да всё получится. Другие варианты по ссылкам посмотри тоже.
УдалитьДоброго времени суток, Вика! Ничего у меня неумёхи не получается ни иконка к комментариям не ставится ,ни нумерация комментариев, тоже не получается. Вот такая фигня выставляется и меня совсем это не привлекает что то.http://prntscr.com/s4beaf Наверное придётся убирать.
ОтветитьУдалитьВалентина, здравствуйте. На Вашем блоге Мир творчества посмотрела - стоят иконки. Что не устраивает. Можно конечно поиграться со стилями
ОтветитьУдалитьfont-size: 22px;
color: #555555;
padding-left:10px;
padding-top:3px;
и
margin-top:7px;
margin-left:10px;
width: 50px; /*ширина иконки*/
height: 48px; /*высота*/
Не знаю, Вика я нашла только лишь в одной статье и больше нигде.
ОтветитьУдалитьНе знаю, я почему то нашла только в одной статье и больше нигде нет.
ОтветитьУдалитьВалентина, тут я должна была поправку сделать. Эта иконка стоит только тогда, когда нет пока ни одного комментария. Потм она исчезает . Вот посмотрите. У меня в этих комментариях и предыдущих её тоже нет. Вот нашла пост, где комментариев нет. Она присутствует.http://www.shpargalochki.ru/2017/06/poyavlenie-i-skrytie-elementov-za-schet-prozrachnosti.html
ОтветитьУдалить