Как установить Tolstoy Comments на WordPress

Есть три способа установить виджет на сайт под управлением WP, один другого проще, выбирайте.

Пройдите регистрацию, и перейдите в панель управления.

Способ 1. Установка кода виджета через плагин

Копируем id виджета в разделе “Настройки / Код”.

В админ панели WordPress, в разделе “Плагины”, нажимаем “Добавить новый”, по поиску находим Tolstoy Comments, устанавливаем и активируем плагин.

Переходим в настройки плагина. В поле Site ID вставляем id виджета, скопированный ранее. Ставим чекбокс в поле Active. На этом можно остановиться, виджет появится на сайте.

Если вам нужна индексация комментариев, потребуется дополнительно создать и скопировать API key из раздела “Ключ доступа к API” в админ панели Tolstoy Comments и добавить его на страницу настроек TC в wordpress. Не забудьте включить чекбоксы Enable export, Enable indexing и сохранить изменения.

Способ 2. Установка кода через меню "Виджеты"

В левой колонке административной панели WordPress выбираем пункт Внешний вид –> Виджеты –> Добавить Html-код

Вставьте код. Все готово. Виджет появится на всех страницах вашего сайта.

Способ 3. Установка кода через редактор

Скопируйте код из раздела "Настройки –> Код" административной панели Tolstoy Comments. В wordpress перейдите в раздел "Внешний вид –> Редактор –> в правой колонке выберите нужный php-файл".

В зависимости от темы wordpress в правой колонке вам будут доступны разные наборы php-файлов. В нашем случае идеальное место для расположения виджета это - comments.php. В него и добавим скопированный в админке код.


Бонус. Как добавить кнопку "Обсудить" в конце статьи.

Сначала создадим специальный класс в настройках css. В разделе Внешний вид переходим по ссылке Встроенный редактор CSS

В левой панели выбираем "Дополнительные стили" и вставляем следующий код:

.tolstoycomment {
background-color: #4CAF50;
border: none;
width: 100%;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 22px;
margin: 4px 2px;
cursor: pointer;
}
button a{
}

Вы можете изменить настройки стилей под себя.

Нажимаем "Опубликовать". Возвращаемся в раздел "Внешний вид –> Виджеты –> Html-код"

Добавляем код:

<a class="tolstoycomment" onclick="window.tolstoycomments.vidget.open();window.tolstoycomments.vidget.navfirst();">Обсудить</a>

Сохраняем виджет. Теперь у нас под каждой статьей появится кнопка, клик по которой будет вызывать окно с комментариями.

Добавляем кнопку "Чаты"

Кнопка будет вызывать виджет на странице списка самых обсуждаемых материалов.

Идем в уже привычный раздел "Внешний вид –> Виджеты –> Html-код"

Вставляем код:

<a class="tolstoycomment" onclick="window.tolstoycomments.vidget.open();window.tolstoycomments.vidget.main();">Чаты</a>


После установки, не забудьте сходить в административной панели в настройки дизайна. У нас есть два формата отображения виджета: отдельным окном и классический (под новостью).

P.S. От нашего программиста: "Если вы человек с высшим техническим образованием, и скриншоты выше, вас скорее утомили, чем внесли ясность. Вот вам расширенная инструкция к API"