Quick and simple comet server

Инструменты сайта

Инструменты страницы

Как сделать чат

В данной статье рассмотрим, как сделать чат с авторизацией на php с использованием комет сервера. Наш php chat будет работать по технологии websocket. Для связи php с websocket сервером надо использовать php comet api.

Первый пример это html скрипт чата для сайта, он будет работать без регистрации пользователей и легко вставится в любую html страницу. Мы его рассмотрим первым по тому что это наиболее простой пример чата использующего комет сервер, а затем на его основе напишем чат для сайта на php с авторизацией пользователей в чате и уведомлениями о входе и выходе пользователей.

Пример создания простейшего чата на php

Первое в чём следует разобраться что такое каналы (pipe) в комет сервере. Канал это именованный поток сообщений, в который можно самому отправлять сообщения и можно подписаться на те сообщения которые туда отправляются кем то другим.

Если рассматривать наиболее простой скрипт чата для сайта, то нам понадобится всего один канал. Все участники подписываются на сообщения из этого канала, а для добавления сообщения в чат просто отправляем сообщение в канал.

Вот принцип работы простого чата для сайта

Примечание: В примерах будет использована библиотека JQuery.

Сначала разберём как работает простой скрипт онлайн чата. Приведу сразу весь код, а потом разберём его подробно. Первое что надо отметить это то что в данном чате люди общаются, используя только лишь комет сервер. Это имеет ряд недостатков, делающий из чата скорее прощёную учебную модель.

Ну вот теперь по кусочкам рассмотрим работу скрипта онлайн чата:

Функция web_send_msg отправляет сообщение в чат.

Здесь можно уточнить что строка: $(«#WebChatFormForm»).append(«

»); добавляет напечатанное сообщение в нашу чат ленту, так чтоб потом было удобно перечитывать сообщения.

А вот вызов CometServer().web_pipe_send(«web_chat_pipe», <«text»:text, «name»:name>); производит непосредственно отправку нашего сообщения всем остальным участникам онлайн чата. Первый аргумент это имя канала в который мы отправим сообщение. Второй аргумент это само сообщение, содержащие имя отправителя и текст сообщения.

Разберём вторую половину скрипта чата:

Следующий код выполняется один раз при загрузке страницы. В нём мы подписываемся на канал для получения сообщений из чата и назначаем функцию обработчик для получения отчёта о доставке сообщений.

Следующий код назначает функцию обработчик, которая будет вызываться каждый раз, когда в канал web_chat_pipe будет приходить сообщение. Первый аргумент – это имя канала, а второй – это функция обработчик.

В функцию обработчик передаётся первым параметром объект содержащий информацию о сообщении и само сообщение.

Вот формат входящих сообщений. Поле data содержит те данные которые мы отправили в качестве сообщения. А поле server_info содержит информацию которую добавляет комет сервер к нашему сообщению.

В данном случаи что бы к нам не пришло, мы рассчитываем что это сообщение для чата которое мы уже научились отправлять вызовом

Обработку ошибок оставим на потом чтоб не раздувать код примеров.

Следующий фрагмент кода назначает функцию обработки на получение отчёта о доставке сообщения.

Здесь первый аргумент это строка в которой первый символ # и за ним имя канала отчёт о доставки сообщения в который мы ждём. В прицепе нет необходимости в обработке отчёта о доставке. Из него мы можем узнать не возникало ли каких либо ошибок.

Как сделать чат с авторизацией

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

Здесь рабочее online демо чата с авторизацией. Теперь рассмотрим общий алгоритм работы чата с авторизацией:

Всё. Таким образом, пользователь не может подделать данные и выбрать чужое имя в чате, так как для этого надо знать чужой пароль.

Код примера чата на php

Теперь весь код примера чата на php, а затем мы его рассмотрим подробно:

Как оформить чат на сайте

Обратная связь с посетителями сайта и возможность пообщаться с клиентами — важная часть бизнеса. Сейчас для этого есть миллион возможностей, без преувеличений.

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

Но почти все чаты для сайтов – это сторонние сервисы с платными и бесплатными функциями. Нужно добавить виджет к CMS или просто вставить специальный HTML код на WEB-страницу, чтобы заработал чат на сайте.

Это удобно, если вопросы безопасности вас не интересуют. Используя такие сервисы, вы даёте своё согласие на то, что все сообщения клиентов и ответы операторов будут храниться на каком-то чужом сервере.

Мы подходим к делу серьёзно, и считаем, что переписка между вашими сотрудниками и клиентами слишком важна, чтобы так легко доверять её третьей стороне.

2. Что должен уметь чат?

Чат должен уметь делать три важные вещи:

  • Отправлять текстовые сообщения. Важно, чтобы система «помнила» человека, и показала историю сообщений, если он будет общаться с оператором во второй или в третий раз.
  • Делать голосовые и видео звонки с сайта. Без установки плагинов или Flash (браузеры планомерно отказались от него). Идеально подходит WebRTC, эту технологию поддерживают все современные браузеры.
  • Отправлять изображения и документы. Очень хорошо, если можно вставлять скриншоты экрана (PrintScreen, Ctrl+V).

3. Безопасно или бесплатно?

И то, и другое. Как ни странно, но такой продукт есть. Это корпоративный мессенджер MyChat. В минимальной бесплатной лицензии на 20 онлайн-подключений можно легко запустить чат для сайта.

Со звонками, передачей файлов, хранением истории сообщений и неограниченным количеством операторов. С приложениями под Windows/Linux/Mac OS/Android и WEB.

4. Как запустить чат для сайта?

Сначала нужно установить MyChat Server. Как это сделать, написано в официальной справке.

Необходимо иметь внешний IP адрес, чтобы к вашему серверу MyChat могли подключаться пользователи через Интернет. Если не знаете, как настроить сервер для работы в Интернете — вам сюда.

За работу веб-чата отвечает встроенный в MyChat веб-сервер, по умолчанию он работает на 80 TCP порту без использования шифрования.

Чтобы самостоятельно узнать, какой у вас порт использует веб-сервер — зайдите в веб-админку через меню MyChat Client ”Инструменты” -> ”Администрирование сервера” (CTRL+F10), этот пункт будет только у пользователей с административными правами:

Затем, уже в браузере, в админ-панели, откройте раздел ”Настройки” -> ”Web-сервисы”, там указан порт вашего веб-сервера:

Теперь мы знаем порт, по которому будем подключать посетителей сайта к чату, запомним его.

Воспользуемся встроенным механизмом для генерации HTML кода чата. Открываем раздел админки ”Инструменты” -> ”Web-поддержка на сайт”:

Создаем локальную группу для веб-поддержки и добавляем туда пользователей — операторов чата. С ними будут общаться посетители сайта.

В списке пользователей слева выделите одного или нескольких человек и нажмите кнопку ”Получить”, чтобы получить текст HTML-кода для вставки на сайт.

Пример кода кнопки:

  • id — генерируется автоматически;
  • text — текст кнопки чата на сайте;
  • position — расположение кнопки чата на сайте:

  • uin — один или несколько идентификаторов, с кем будет открыт чат, выбор делается случайным образом;
  • url — IP адрес или доменное имя вашего сервера в Интернете (очень важно, чтобы это значение было таким же, как и в разделе админ-консоли ”Настройки” -> ”Сетевые настройки” -> ”IP адрес или Host сервера для внешних клиентов”. Если там пусто — впишите свой внешний адрес;
  • secure — используется шифрование трафика веб-сервером или нет. По умолчанию не используется, поэтому пишем ”false”.
  • Создание чата на сайте: как его настроить и зачем?

    Онлайн-консультант или чат для интернет-магазинов (и других коммерческих сайтов) — сервис, отвечающий за прямую оперативную связь потенциального клиента с менеджером компании. Посетитель не тратит денег на звонок и не ждёт очереди на «горячей» линии, плюс это очень удобно для тех, кто предпочитает письменное общение звонкам.

    Читайте так же:  Приказ мвд россии 13 от 2009

    Установка чата на сайт существенно поднимает конверсию площадки, при условии правильной настройки и оперативных полезных ответов на обращения пользователей. Так есть данные, что чат на странице корзины может увеличить конверсию на 20%, а средний чек — на 43%, консультации на этапе сравнения продуктов повышают продажи до 200%, а лендинги с чатом становятся эффективнее на 150 – 190%.

    Еще одно полезное решение для увеличения конверсии на странице корзины — предложение сохранить корзину и выслать ее на email.

    Какие вопросы помогает решить добавление чата на сайт?

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

    Наиболее продвинутые системы онлайн-помощников идут дальше простого чата с пользователем и предлагают прямую демонстрацию последовательности действий. Эта функция называется Co-Browse, когда консультант с разрешения клиента подключается к его браузеру и «проводит» по сайту: подсвечивает пункт меню, который ищет клиент, или конкретное предложение, на которое тому стоит обратить внимание. Также существуют сочетания голосовой помощи и чата, когда консультант может отвечать на вопросы голосом и одновременно предлагать ссылки на нужные разделы сайта в окошке.

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

    Создание чата на сайте: в чём преимущества?

    • Качественный клиентский сервис собирает лояльную аудиторию. Оперативный исчерпывающий ответ на вопрос о товаре или работе магазина придётся по вкусу клиенту, который с удовольствием заглянет на сайт ещё раз и может его рекомендовать знакомым.
    • Аналитика обращений даёт исчерпывающую информацию о проблемах и потребностях потенциальных клиентов на сайте компании, позволяет отслеживать источники трафика и их эффективность.
    • Расширенная статистика по клиентам может заменить маркетинговые исследования, предлагая сведения об источниках перехода, географии посетителя, его социально-демографических характеристиках и даже истории перемещений.
    • Отслеживая страницы, с которых больше всего приходит обращений, владельцы сайта могут улучшить юзабилити, наполнение и техническую сторону ресурса без дополнительных исследований.
    • Все обращения пользователей и ответы на них сохраняются — это позволит отслеживать слабые места сайта и работы менеджеров-консультантов.
    • Зная, на какой странице находится посетитель, откуда он пришёл и как много времени провёл на сайте, можно самостоятельно инициировать разговор, задав вопрос или предложив консультацию по конкретному продукту.
    • Простота обращения в чате без установки дополнительных программ и совершения звонков снимает психологические барьеры потребителей при обращении к консультанту.
    • Грамотный консультант может располагать более точной информацией, чем опубликованная на сайте — особенно когда речь идёт об остатках товара на складе и т.п.

    Как установить чат на сайт?

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

    Далее клиент переходит в настройки окна чата на своём сайте, где легко меняется внешний вид ярлычка и самого окошка, устанавливается фото оператора, фразы приветствия и прочие характеристики.

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

    Есть немало решений для бизнеса от бесплатных (полностью, только для сайтов с небольшой посещаемостью или условно-бесплатных с ограниченными функциями) до платных по принципу абонентских отчислений за оператора, время пользования или полноты функционала.

    Как сделать чат на сайте эффективным?

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

    1. Самый эффективный вид чата — постоянно висящий сбоку цветной стикер с надписью «онлайн-консультант», который можно развернуть в небольшое окошко для вопроса менеджеру. Ещё лучше, если система позволяет консультанту самому предложить помощь, если пребывание посетителя на странице превышает 5-10 минут. Прочие варианты — от выскакивающих в середине экрана pop-up до постоянно мигающих и мелькающих стикеров по бокам, а также предлагающих помощь сразу после загрузки страницы, когда посетитель ещё не определился туда ли он попал и есть ли здесь что-то нужное ему — работают намного хуже и увеличивают процент отказа.
    2. Оперативность ответа. Как и с телефонными консультантами, в компании должен быть заведён стандарт времени ответа на запрос в чате. А при условии, что онлайн-чат даёт информацию о странице, с которой задан вопрос, подготовка оперативных ответов должна быть поставлена на поток.

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

    1. Окошко чата должно иметь значок «Online» или «В сети» минимум с 9:00 до 18:00. Если консультант не круглосуточный, в остальное время посетителю должно приходить сообщение автоответчика о времени работы чата онлайн с предложением альтернативных средств связи или ссылкой на раздел FAQ — часто задаваемых вопросов. Ещё лучше — сделать на базе чата форму обратной связи для работы в нерабочее время консультанта, где пользователь сможет отправить свой вопрос и контакты для связи.
    2. Простой интуитивно понятный интерфейс без дополнительных вкладок и спорных дизайнерских решений, с одной-единственной кнопкой отправки сообщения.
    3. Грамотность и корректность ответа. Консультант должен не только разбираться в товаре или услугах, но и уметь правильно формулировать ответы. Неграмотность часто воспринимается как непрофессионализм, а панибратский тон отталкивает посетителей.

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

    Как сделать чат для сайта и нужен ли он

    Давайте разберемся, как сделать чат для сайта, какие чаты бывают и нужен ли он вообще. Чат, в переводе с английского — разговор друзей, болтовня, это беседа в реальном времени. Этим он отличается от форума, где разговор более серьезный, растянут по времени и разделен по тематикам.

    Если веб-мастер посчитает, что его сайту необходим чат, например, для улучшения поведенческих факторов поискового ранжирования, эту задачу можно решить без особых проблем и даже без финансовых вложений. Конкретные пути зависят от задействованной при создании сайта технологии.

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

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

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

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

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

    Здесь все зависит от посещаемости чата. Если переговоры ведутся несколькими пользователями раз в сутки, бесплатной версии вполне достаточно. Если же в чате будут задействованы тысячи активных пользователей, потребуется более мощная система, в том числе и для регулярного модерирования записей и своевременного удаления нежелательных высказываний.

    Читайте так же:  Эод налог

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

    Для продвинутых веб-мастеров, понимающих толк в программировании, умеющих самостоятельно настраивать базы данных, устанавливать элементы php и MySQL, не составит труда самостоятельно скомпилировать, установить и настроить собственную программу для чата.

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

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

    Нужен ли чат для сайта?

    Вопрос, стоит ли беспокоиться вообще? Нужен ли чат для сайта? Понятно, что задумываться о чате для сайта следует только тогда, когда в нем назреет насущная необходимость. Чат, в котором будут общаться только сам веб-мастер и его приятели, производит удручающее впечатление на посетителей и не приводит в восторг поисковые системы.

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

    Как сделать чат

    Думаю, что каждый из Вас знает, что такое чат. И очень часто на сайтах можно встретить либо маленькие чаты, либо достаточно большие и сложные. В этой статье я опишу принцип создания чата. Обратите внимание, что в этой статье не будет готового кода «скопировал-вставил«, а только алгоритм, с помощью которого Вы, обладая необходимыми знаниями, сможете сделать чат.

    Ключевая особенность чата в том, что его содержимое обновляется автоматически. Отсюда и возникают все трудности.

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

    • id — уникальный идентификатор.
    • name — имя, оставившего сообщение. Здесь также может быть, например, user_id, означающий id пользователя из другой таблицы.
    • message — сам текст сообщения.
    • date — дата отправления сообщения.

    Безусловно, это только пример. Вы можете добавлять ещё массу других полей, тем самым, расширяя возможности Вашего чата.

    Теперь необходимо вывести HTML-код:

    В данном коде опять же всё как пример. Можно всё смело менять, но принцип должен быть тем же: есть место, где выводятся сообщения, причём они выводятся в одинаковом виде. Вместе с полем, где выводятся сообщения, есть текстовое поле и кнопка «Отправить«.

    Обязательно для блока chat поставьте фиксированную высоту, чтобы при добавлении новых сообщений, у Вас этот блок не вырастал, также поставьте полосу прокрутки у него, чтобы можно было просмотреть все сообщения. Всё это делается с помощью CSS.

    Теперь займёмся JavaScript:

    И, наконец, PHP-код (добавление новых сообщений):

    И последний файл, которые потребуется — это получение всех сообщений из таблицы:

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

    Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

    Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
    Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

    Если Вы не хотите пропустить новые материалы на сайте,
    то Вы можете подписаться на обновления: Подписаться на обновления

    Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

    Порекомендуйте эту статью друзьям:

    Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

    Она выглядит вот так:

  • BB-код ссылки для форумов (например, можете поставить её в подписи):
  • Комментарии ( 24 ):

    Спасибо за статью, Михаил! Но ведь можно сделать и без применения js?

    Можно, с применением frame. Но это очень плохой вариант в том плане, что, во-первых, будет «моргать» экран, поскольку обновляется целиком весь блок, особенно это будет заметно на медленных компьютерах. Также очень сильно ограничена функциональность и многое нельзя будет сделать.

    Spasiba za statiu Mixail..Vapros: Shtob Sozdat Chatik na znat PHP ? i JavScript? obizatelna ? a mojna li vot suda postavit http://remzi.mail2k.ru/ ? Zarane spasiba ..

    Можно взять готовый скрипт чата. Минусов масса, но если ничего не знаете, то это единственный вариант.

    Михаил а как сделать так чтоб аякс запрос, проверял есть ли новые сообщения, если есть то уже подгружает, а если нет то нет. как вот сделать эту проверку? Сама структура запроса не ясна. пожалуйста обьясните.

    Отправлять вместе с запросом id последнего сообщения, например. Если новое появилось, то возвращать результат.

    А лучше ли будет передавать хэш id ? или лучше будет сделать специально отдельно колонку в таблице, с рандомным значением (и сделать и его хэш)чтоб исключить подстановку?!

    Если беспокоитесь о безопасности, то можете и так сделать. Как альтернатива, можете передавать не id, а время последнего обновления. Тогда выводить только сообщения, отправленные позже этого времени.

    Можно сделать асинхронную подгрузку сообщений если не беспокоетесь о нагрузке

    Я сделал чат по такому же принципу, только я не знал как обновлять и узнал здесь. Спасибо.

    Михаил, а как сделать так, чтобы при обновлении страницы все сообщения из окна чата исчезали? Т.е. каждый новый пользователь не видел сообщений старых. И если это вообще возможно, то где хранить сообщения в БД или в файлах… Спасибо

    Можно хранить в cookie дату первого посещения чата и выводить сообщения только, отправленные позже этого времени.

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

    Через CSS у блока можно поставить максимальную высоту и прокрутку.

    спасибо) просто не сталкивался с прокруткой) обязательно попробую)

    Михаил, вы пишите статьи для людей или для поисковиков?

    В первую очередь, для людей. Для поисковиков только ставлю.

    Михаил, спасибо за статью. Вопрос: мне нужно установить, уже готовый чат Mibew Messenger.Все понятно, но там нужно создать БД MySQL и БД пользователя, где это создавать и как? управление сайта через самописную cms. В примере БД создаются в phpMyAdmin.

    Для создания пользователя и БД используйте все тот же phpMyAdmin

    Чаты с организациями следует создавать на сервисе Яндекс.Диалоги. Не забудьте войти на сервис с тем логином, для которого подтверждены права на ваш сайт в Яндекс.Вебмастере.

    Если вы настроили несколько каналов общения для разных страниц вашего сайта, создайте отдельный чат для каждого канала.

    Чтобы создать чат:

    Нажмите плашку Создать диалог .

    Выберите тип диалога Чат с организацией .

    Заполните все поля настроек и отправьте чат на проверку кнопкой На модерацию .

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

    Основные настройки

    Обязательны все поля настроек, кроме приветственного сообщения и саджестов.

    Сайт для верификации прав использования бренда — адрес вашего сайта. Правильно указывать адрес главного зеркала со схемой, например, https://example.ru .

    Права на сайт должны быть подтверждены для вашего аккаунта в Яндекс.Вебмастере, Диалоги проверят это автоматически.

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

    Если вы хотите подключить свою платформу к проекту чатов для бизнеса в Яндексе, напишите нам.

    ID — идентификатор канала, который нужно транслировать в чат Яндекс.Диалогов. Чтобы узнать ID вашего канала, следуйте инструкции для вашего провайдера.

    URL — адреса страниц, для которых должен включаться этот чат в результатах поиска. С помощью этого поля можно ограничить чат определенными страницами сайта. Каждый адрес должен быть указан на отдельной строке.

    • Всего в поле URL можно указать не более 32 точных адресов, и не более 10 шаблонов адресов.
    • Все адреса должны принадлежать хосту, указанному в поле Сайт для верификации прав использования бренда , или его поддомену. Например, если в этом поле указан адрес https://example.ru , адреса страниц на домене example.com будут проигнорированы.

    Указывать нужно только те адреса, которые действительно попадают в результаты поиска.

    В частности, схема в указанном URL должна совпадать со схемой адреса в результатах поиска: если вы указали URL https://example.ru , а в результаты поиска попадает страница http://example.ru , чат для этой страницы отображаться не будет.

    В указанных адресах игнорируются части адреса после символа «#» — адрес https://example.ru/catalog/ равнозначен адресу https://example.ru/catalog/#welcome .

    Подробнее о том, как работает указание URL для диалога, читайте в разделе Примеры указания URL.

    Примеры указания URL

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

    Перечень точных адресов страниц

    Вы можете ограничить чат определенными страницами — для этого перечислите их адреса, например:

    Вы можете указать до 32 точных адресов для каждого чата.

    Для всех страниц, в результатах поиска, чей адрес отличается от указанных, чат отображаться не будет:

    • https://example.ru/catalog
    • https://subdomain.example.ru
    • https://example.ru/?from=app
    • и так далее.

    Шаблон адреса

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

    Например, чтобы чат появлялся в результатах поиска для любой страницы вашего сайта, задайте поле URL так:

    Подстраницы определенного каталога

    Чтобы настроить чат для всех страниц в определенном разделе сайта, напишите шаблон следующего вида:

    В этом случае чат будет отображаться для всех страниц, чей адрес начинается с этого фрагмента:

    Поддомены основного сайта

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

    В этом случае чат будет отображаться для главной страницы каждого поддомена:

    Публикация в каталоге

    Обязательны все поля настроек, кроме приветственного сообщения и саджестов.

    Название компании-разработчика чата, которое следует отображать в каталоге (например, «Сбербанк» ).

    Будет отображаться в заголовке чата (например, «Сбербанк Новосибирск» ). Не более 25 символов.

    Название обязательно должно содержать название организации или сайта:

    • Правильно: «Сбербанк» , «example.ru» , «Студия дизайна Example» .
    • Неправильно: «Чат с адвокатом» , «Онлайн-поддержка» , «Самый лучший чат» , «Получить кредит под низкую ставку» .

    Помимо названия организации или сайта название чата может содержать слова, характеризующие деятельность компании:

    • Правильно: «Интернет-магазин Example.ru» , «Пластиковые окна Example» , «Грузоперевозки „Образец“ » .
    • Неправильно: «Окна» , «Служба поддержки Example.ru» , «Детские площадки» .

    Если ваш чат предназначен для конкретного города или региона, вы также можете указать название региона:

    • Правильно: «Сбербанк Новосибирск» , «Грузоперевозки в Липецке „Образец“ » .
    • Неправильно: «Грузоперевозки во Владивостоке» , «Новосибирск» .
    Читайте так же:  Договор обслуживания коммуникаций

    Категория

    Группа, к которой правильнее всего отнести ваш чат. Чат может не пройти модерацию, если выбранная категория не соответствует роду деятельности компании.

    Приветственное сообщение Сообщение, которое получит пользователь сразу после нажатия кнопки Начать чат (с этой фразы начнется диалог). Не более 1000 символов.

    В приветственном сообщении не должно быть рекламы продуктов или услуг, а также не должно быть призывов перейти на сайт и совершить какую-либо транзакцию:

    • Правильно: «Здравствуйте. Какой у вас вопрос?» , «Чем могу помочь?» .
    • Неправильно: «Зайди на сайт студии!» , «Покупайте у нас со скидкой!» , «Участвуйте в акции»

    Саджесты

    Наиболее частые вопросы, которые возникают у ваших клиентов. В чате саджесты отображаются как кнопки: когда пользователь нажимает кнопку, текст саджеста отправляется как сообщение.

    Каждый саджест должен быть не длиннее 35 символов, всего можно задать не более трех саджестов.

    Саджест правильно формулировать как вопрос пользователя или его намерение:

    • Правильно: «Хочу заказать сайт» , «Как оформить заказ?» , «Сколько стоит билет?» .
    • Неправильно: саджесты, которые не могут быть репликами пользователя — «Чем мы можем помочь?» , «Быстрый ответ на ваш вопрос» .

    Иконка

    Изображение, которое отображается в заголовке чата.

    Ограничения для иконок:

    • Поддерживаемые форматы — PNG и JPG.
    • Размер — 192×192 пикселя. Картинки большего размера отмасштабируются автоматически.
    • В иконке может использоваться название или логотип только того бренда, официальный сайт которого указан в поле Сайт для верификации прав использования бренда .
    • Иконка чата должна соответствовать фавиконке сайта или логотипу компании.
    • Иконка не должна быть фотографией или общеупотребимой пиктограммой (смайлик, эмодзи, статус «онлайн» и т. п.)

    Рабочее время

    График работы чата.

    Если операторы ваших каналов работают только в определенное время, переключитесь на вариант Выборочно . После этого можно будет указать часовой пояс и промежутки времени, в которые чат должен работать.

    7 советов как настроить онлайн чат для сайта (ч.1)

    1. Когда лучше запускать онлайн чат?

    • Он посмотрел на сайте три карточки товаров или посмотрел более трех страниц. Точное количество нужно рассчитывать самостоятельно, основываясь на специфике ваших товаров и услуг. Для этого анализируйте в «Яндекс.Метрике» глубину просмотра сайта среди пользователей, достигших заданной вами цели.
    • Он посетил определенный набор страниц, например: «продукт» — «цена» — «модификации» или «услуга» — «цена» — «о компании». Для выявления таких паттернов в каждом случае нужно анализировать статистику сайта, смотреть отчет из метрики (или Google Analytics) «Пути пользователей по сайту».
    • Он вернулся на карточку товара, которую уже смотрел в этой сессии.
    • Он достиг определенной точки внутри длинной страницы два и более раза (для длинных одностраничников) или достиг определенной точки на очень длинной странице.

    2. Где ставить on-line chat на сайте?

    Какие могут быть варианты установки?

    2.1 В содержании страницы

    Внимательный анализ пути пользователя по сайту позволит определить оптимальное место расположения визуальных элементов системы чата. Анализируя через «Веб Визор», как пользователь скролит страницу, на что обращает внимание, мы можем выявить идеальные места для предложения «начать разговор с консультантом».

    Как легко догадаться, чтобы повысить конверсию чата, нужно написать соответствующий призыв к действию (call to action). Такой подход обеспечит максимальную конверсию запуска ЦЕЛЕВЫХ разговоров, ведь вы сможете натолкнуть пользователя на нужную ему и вам тему обсуждения: например, сколько будет стоить сложная конфигурация продукта (услуги) или какую марку насоса выбрать для двухэтажного дома. Вот пример совсем простого варианта, тут банальный вопрос «Нужно больше информации?»

    2.2 Плавает по экрану

    На рисунках, расположенных ниже, хорошо видно, что предложение начать чат находится в наиболее функциональной позиции. Куда бы человек ни пошел, он всегда будет видеть предложение получить консультацию. Человек поневоле обращает внимание на иконку чата, и в то же время этот графический элемент абсолютно ненавязчив, так как не раскрывается без спроса на все окно. Проще говоря, мы таскаем иконку чата по экрану. Ее можно расположить сбоку или сверху в строке навигации, которая не уходит с экрана при скролинге страницы. При таком способе вызова важно обеспечить правильный призыв начать чат (но об этом позже).

    2.3 Внизу окна браузера

    Блок с кнопкой вызова чата может быть зафиксирован неподвижно относительно движения контента на экране и поэтому всегда будет находиться на виду. Также неплохим выбором будет плавающая кнопка, прижатая к нижней кромке браузера, которая приглашает воспользоваться чатом для получения скидки или чего-то в этом роде. На мой взгляд, это одно из самых оптимальных решений для ленивых.

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

    2.4 Просто принудительно открывается в любом месте

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

    Безусловно, этот вариант организации работы чата даст вам максимальное количество формальных поводов начать разговор, только вот о чем можно разговаривать с пользователем, если он провел на сайте лишь 5 секунд?! У него вообще не могло возникнуть вопросов.

    Если вы думаете, что вам подойдет именно такой «агрессивный» вариант чата, то запускайте, но соберите аналитику: сколько человек закрыли окно чата (для этого установите свою переменную в Google Analytics), сколько покинули вашу страницу, сколько начали диалог.

    В следующей части мы рассмотрим конкретные способы установки чата, виды систем, их стоимость.