Красочное выделение цитат в комментариях

QuoteВ октябре прошлого года я написал статью, в которой рассказал о разработанном мной виджете, позволяющем давать ответ на конкретный комментарий и, даже, приводить цитаты. Увы, он работает только для линейного формата публикации комментариев. К комментариям, имеющим иерархический формат, он неприменим.

Что ж, мир не стоит на месте, и на смену старым решениям приходят новые. Вот и сейчас я хочу представить свое новое творение, позволяющее уже при иерархическом формате публикации комментариев оформлять текст в виде выделенных цитат!

Хотите вот так?

sunctorus писал(а)
Сегодня я хочу предложить вам свой собственный скрипт.
Чем он примечателен?


Или вот так?

Цитата
Сегодня я хочу предложить вам свой собственный скрипт.
Чем он интересен?
Цитата
Скрипт, позволяющий цитировать нужный отрывок комментария.
Ждем с нетерпением!


А, может, вот так?

sunctorus писал(а)
Цитата
Ну-ка, ну-ка... Интересно...
Этот скрипт позволяет цитировать нужный отрывок комментария.
Хмм... Неплохо!


Или, вообще, вот так?

Цитата
Цитата
Цитата
Цитата
Сегодня я хочу предложить вам свой собственный скрипт.
Какой такой скрипт?
Скрипт, позволяющий цитировать нужный отрывок комментария.
Круто!
А то :-)


Хотелось бы обратить внимание тех, кто раньше использовал аналогичный виджет для линейного формата комментариев, на тот факт, что виджет, описываемый в этой статье, сохранит работоспособность всех цитат, которые были созданы вами ранее, и их дизайн не рассыплется!

Ну что ж, если идея подобного расширения функционала комментариев платформы Blogger (Blogspot) показалась вам интересной, приступим к ее воплощению в жизнь! Откройте редактор шаблона (Дизайн->Изменить HTML) и добавьте перед закрывающим тэгом </head> следующую строку:
<script src='http://code.jquery.com/jquery.min.js' type='text/javascript'/>
</head>
* Если перед тэгом </head> уже имеется ссылка на скрипт jquery.min.js, то дублировать ее не стоит. Достаточно одного указания на библиотеку jQuery.

Теперь подключим основной скрипт. Перед закрывающим тэгом </body> добавляем следующую строку:
<script src='https://drive.google.com/uc?export=download&amp;id=0B3_dGXEjBVdPeXE2Smw5X2NZX0k' type='text/javascript'/>
</body>
Задействуем таблицу стилей. Под строкой "/* Comments" и вставляем следующий код:
/* Comments
----------------------------------------------- */
.comment-quote {
  margin-top: -10px;
  margin-bottom: 5px;
  padding: 7px;
  border: 1px solid #C3DEF4;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  text-align:justify;
  width: 100%;
}

.comment-quote-name {
  margin-left: 10px;
  padding: 0 3px;
  background-color: #fff;
  font-weight: bold;
  position: relative;
}

.name-color {
  color: #138FD8;
}
И, наконец, о том, как задействовать возможности данного виджета! Увы, "варианта для ленивых", как это было организовано в виджете, о котором я упоминал в начале статьи, в текущей модификации нет. Тут все необходимо делать вручную. Хотите оформить простую цитату? Скопируйте цитируемый текст в форму добавления комментария и окружите его псевдотэгами по этой схеме: [q]цитируемый текст[/q]. Хотите лицезреть более сложный вариант, с указанием имени человека, которого вы цитируете? Тогда схема немного меняется: [q="имя"]цитируемый текст[/q]. Как видите, ничего сложного. И вы, и ваши читатели без труда освоите этот механизм, многим уже привычный по форумам.

Данный виджет разработан для иерархического формата комментариев. О том, как воплотить нечто подобное для линейного формата, рекомендую почитать в статье "Персональный ответ и цитирование в комментариях".

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

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

Хотите подписать свой комментарий, но у вас нет аккаунта? Выберите в выпадающем списке Имя/URL.
Вы сможете вписать свои имя или ник. Поле для указания URL можно оставить пустым.

Тэги, допустимые в комментариях