Документация
Виджет комментариев

Код виджета комментариев Stream необходимо вставлять в HTML код страницы в то место, где необходимо вывести ленту комментариев.

Стандартный код вставки виджета комментариев следующий:

<div id="hypercomments_widget"></div>
<script type="text/javascript">
_hcwp = window._hcwp || [];
_hcwp.push({widget:"Stream", widget_id: WIDGET_ID});
(function() {
if("HC_LOAD_INIT" in window)return;
HC_LOAD_INIT = true;
var lang = (navigator.language || navigator.systemLanguage || navigator.userLanguage ||  "en").substr(0, 2).toLowerCase();
var hcc = document.createElement("script"); hcc.type = "text/javascript"; hcc.async = true;
hcc.src = ("https:" == document.location.protocol ? "https" : "http")+"://w.hypercomments.com/widget/hc/WIDGET_ID/"+lang+"/widget.js";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hcc, s.nextSibling);
})();
</script>
<a href="http://hypercomments.com" class="hc-link" title="comments widget">comments powered by HyperComments</a>

,где

  • WIDGET_ID - ID Вашего виджета

Получить свой код вставки виджета можно при регистрации или в панели администратора "Настройки"-"Основные".

Настройка виджета

Для настройки виджета комментариев необходимо в объект массива _hcpw из кода вставки виджета добавлять параметры настроек. Например:

_hcwp = window._hcwp || [];
_hcwp.push({widget:"Stream", widget_id: WIDGET_ID, SETTINGS_KEY: SETTINGS_VALUE});

,где

  • SETTINGS_KEY - название параметра настройки виджета
  • SETTINGS_VALUE - значение параметра настройки виджета

 

Параметры настроек виджета
Параметр Значения По умолчанию Описание
xid Строка произвольной длины null Позволяет установить идентификатор страницы и привязать все комментарии к нему. По умолчанию виджет создается для каждой новой страницы в зависимости от URL. Задав идентификатор Вы сможете подгружать одинаковые комментарии на страницах с разными URL адресами. Идентификатором страницы может быть любая строка не включающая специальных символов (?,!,%$#><).
append id блока #hypercomments_widget Позволяет вставить виджет в заданный HTML элемент. В качестве значения принимает id элемента (#idname).
title Строка произвольной длины Значение тега title страницы Позволяет задать заголовок страницы, который будет отображаться в админ панели модерирования комментариев.
css Адрес css файла null Позволяет загрузить css файл для изменения стилей виджета.
Для тарифных планов Professional и выше
href URL страницы без http, https, www Адрес страницы, где установлен виджет C помощью этого параметра можно вывести комментарии одной страницы на странице с другим URL адресом
pagination 0 или 1 0 Позволяет включить\отключить постраничную навигацию в виджете. Постраничную навигацию можно включить и в настройках виджета, но если в коде вставки будет стоять параметр pagination=0 , то на странице постраничная навигация будет отключена, т.е больший приоритет настроек имеют параметры кода вставки виджета.
hc_disable 1 - ГК отключены, 0 - включено. 0 Позволяет запретить гиперкомментирование на странице
quote_disable 1 - Цитирование отключено, 0 - включены. 0 Позволяет запретить цитирование на странице
words_limit int 10 Позволяет задать максимальное количество слов к которым можно оставить гиперкомментарий
comment_length int Ограничен размером на сервере Позволяет задать максимальную длину комментария в символах
social строка с соц.сетями "google, facebook, twitter, vk, odnoklassniki, mailru, yandex, tumblr, livejournal" Позволяет задать перечень и порядок социальных сетей через которые будет возможна авторизация. Значение провайдеров авторизации задаются через запятую, порядок задания соц.сетей соответствует порядку их отображения в виджете.
realtime true или false true Позволяет отключить отображение комментариев в реальном времени. Вместо этого будет показан идентификатор сообщений в реальном времени.
comments_level int 4 Позволяет задать уровень вложенности комментариев для фильтра отображения "Все".
like_href URL страницы Адрес страницы, где установлен виджет Позволяет задать ссылку на страницу, которая будет размещена в соц.сети при нажатии кнопки "Like"
like_title Строка произвольной длины Значение тега title страницы Позволяет задать заголовок страницы, которая будет размещена в соц.сети при нажатии кнопки "Like"
auth Строка произвольной длины null Позволяет синхронизировать пользователей Вашего сайта с пользователями HyperComments. (см. подробнее)
auth_url URL страницы авторизации через сайт null Позволяет передать url авторизации через пользовательский сайт. К url авторизации будет добавлен GET параметр return_to , который будет иметь значение url c которого происходила авторизация пользователя на сайте (Например: http://sitename.com/authurl?return_to=http://sitename.com/page/1 ). URL авторизации можно задать и в настройках API виджета, но больший приоритет настроек имеют параметры кода вставки виджета.
ВАЖНО!!! Чтобы авторизация через сайт работала необходимо поставить соответствующую галочку в "Настройках API". Для того чтобы появилась возможность авторизации через сайт из формы авторизации виджета необходимо также добавить параметры auth_logo auth_title
auth_logo Строка произвольной длины null Позволяет задать адрес логотипа сайта в всплывающем окне авторизации пользователей
auth_title Строка произвольной длины null Позволяет задать подпись авторизации через сайт в всплывающем окне авторизации пользователей.
default_avatar Адрес аватара (png, gif, jpeg) null Позволяет изменить аватар по-умолчанию анонимного пользователя.
callback function null Callback функция, которая вызывается после инициализации виджета, имеет 2 параметра app - экземпляр объекта HC, init - параметры виджета. Пример использования:
_hcwp.push({widget:"Stream", widget_id: WIDGET_ID, callback: function(app, init){
  console.log('Log message after init HC');
}});
              

Пример выведет в консоль сообщение "Log message after init HC" после инициализации виджета.

В callback функции можно подписаться на события, которые возникают в виджете. Например:

_hcwp.push({widget:"Stream", widget_id: WIDGET_ID, callback: function(app, init){
  app.on('siteAuth',function(packet){
     console.log('event site auth');
  });
}});
              

Пример выведет в консоль сообщение "event site auth" в момент авторизации через пользовательский сайт.

packet - некоторые параметры события

Список возможных событий:

  • siteAuth - событие авторизации через пользовательский сайт
  • streamMessage - событие добавления комментария
  • streamTopic - событие добавления гиперкомментария
  • streamDeleteMessage - событие удаления комментария
  • streamEditMessage - событие редактирования комментария
  • streamLike - событие голосования за статью
  • streamVoteMessage - событие голосования за комментарий
texts Объект null Позволяет изменять статические тексты в виджете. Например:
var my_texts = {
  'KEY_CAPTION_1'  : 'VALUE_1',
  'KEY_CAPTION_2'  : 'VALUE_2',
  'KEY_CAPTION_3'  : 'VALUE_3',
};

_hcwp.push({widget:"Stream", widget_id: WIDGET_ID, texts: my_texts});
              

,где

  • KEY_CAPTION_1, KEY_CAPTION_2 - ключи статических текстов в виджете комментариев
  • VALUE_1, VALUE_2 - статических тексты в виджете, которые соответствуют ключам и будут отображаться в браузере

Для того чтобы узнать все ключи (KEY_CAPTION_1, KEY_CAPTION_2, ..., KEY_CAPTION_n), которые используются в виджете, необходимо сделать следующее:

var my_texts = {
  get_keys : function(keys){console.log(keys)}
};
_hcwp.push({widget:"Stream", widget_id: WIDGET_ID, texts: my_texts});
	

Данный код выведет в консоль браузера все текущие ключи и соответствующие им статические тексты.