Сделать онлайн чат: Как реализовать online чат? — Хабр Q&A

Как создать онлайн-чат в HubSpot

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

• Чат – это специальное окно, в котором посетители общаются с «живыми» сотрудниками вашей команды, а не с настроенным ботом.
• Бот – это автоматизированный чат-бот, рассылающий шаблонные ответы.

Вы можете создать онлайн-чат и для аккаунта в Facebook Messenger. Почитать подробнее здесь.

Примечание: создавать и изменять онлайн-чаты могут только пользователи с уровнем доступа Account.

Создание онлайн-чата

• Откройте HubSpot-аккаунт и перейдите в Conversations > Chatflows.
• Справа вверху нажмите Create chatflow.
• Выберите  Website.
• На левой боковой панели нажмите Live chat. Если вы хотите подключить поиск по базе знаний в самом виджете чата, то активируйте опцию Knowledge base search & live chat (только для Service Hub Professional и Enterprise).

Примечание: Поиск по базе знаний в виджете чата работает только, если опубликовано не менее 3 справочных статей.

• Для изменения языка чата (по умолчанию – английский) нажмите на иконку с карандашом вверху справа и выберите нужный язык в выпадающем списке.
• Кликните Next.
• Если у вас подключено более одного ящика, то выберите нужный ящик для получений сообщений из чата.

1. Build – Создание приветственного сообщения

Следующий шаг – это настройка чата во вкладке Build. Здесь вы сможете изменить поведение чата и добавить приветственное сообщение.

Примечание: если вы хотите встроить виджет чата в одностраничное приложение или настроить онлайн-чат через API, то ознакомьтесь с документацией по API чатов.

• Раздел Write a welcome message позволяет менять приветственное сообщение, которое посетитель видит, впервые попав на ваш сайт.
• Чтобы распределять входящие сообщения по определенным членам команды, включите опцию Automatically assign conversations. Далее в выпадающем списке отметьте нужных пользователей/команду.
• Если вы хотите задать определенный момент, когда система будет запрашивать у посетителя адрес электронной почты, то нажмите Ask visitors for their email address.
• Затем в разделе Email capture message укажите текст, который виджет чата покажет посетителю при запросе адреса электронной почты.
  

• Просмотрите, как будет выглядеть ваш чат, через Preview.

• Затем сохраните изменения кнопкой Save (внизу), а далее в боковом меню перейдите во вкладку Target.

2. Target – где показывать чат

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

• Настроить показ виджета чата при открытии определенных страниц сайта можно в разделе Website URL:

1. В первом выпадающем меню выберите Website URL.
2. Далее задайте условия таргетинга.
3. В текстовом поле укажите все нужные критерии.

1. Кликните по первому выпадающему меню и выберите Query parameter.
2. В первом текстовом поле укажите название параметра запроса.
3. Во втором текстовом поле введите значение параметра запроса.
   

Также вы можете настроить таргетинг для показа виджета определенной категории контактов. Раздел Visitor information and behavior позволяет задавать критерии показа в зависимости от того, что уже известно о посетителе

• Кликните по первому выпадающему списку и выберите фильтр. Вы можете задавать отдельные фильтры показа для известных вам контактов и неизвестных посетителей.
• Во втором выпадающем списке укажите критерии.
• Для добавления еще одного правила нажмите Add rule.
• Чтобы отключить показ всплывающего окна чата на каких-либо страницах (например, Политика конфиденциальности), воспользуйтесь Add exclusion rule.
• Для создания группы фильтров с дополнительными параметрами таргетинга нажмите Add filter group.
  
• Затем сохраните изменения кнопкой Save (внизу) и в боковом меню перейдите во вкладку Display.

3. Display – настройка внешнего вида чата

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

• Кликните по выпадающему списку Chat heading, а затем подберите название и аватар для чата.

1. Custom name and avatar – отображает одно общее название команды и общее изображение. Нажмите иконку с плюсом, чтобы загрузить свое изображение, и укажите подходящее название.
2. Specific users and teams – отметьте галочками нужных пользователей-участников чата. При выборе более 3 пользователей их имена будут показываться в случайном порядке.
3. Contact owner – кликните по выпадающему списку New
   visitor fallback и выберите пользователя, который будет общаться в чате с новыми и нераспределенными посетителями.
   

1. Во вкладке Desktop отметьте нужную опцию:
2. Во вкладке Mobile отметьте галочкой нужную опцию:

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

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

1. On exit intent  – загружать виджет чата, когда курсор посетителя перемещается к верхней части экрана браузера.
2. Time on page in seconds – загружать виджет чата по прошествии определенного периода времени (в секундах), которое пользователь проводит на странице.
3. Percentage of the page scrolled – загружать виджет чата, когда пользователь прокручивает страницу до определенной точки экрана.

Примечание: после завершения настроек чата он начнет автоматически загружаться на страницы сайта. Добавьте в конце URL страницы #hs—chat—open – так вы сможете привязать эти URL к емейлам, лэндингам и прочим маркетинговым кампаниями, которые будут направлять посетителей в виджет чата для дальнейшей коммуникации.

4. Options

Во вкладке Options настраивается язык чата. Кроме того, если в вашем аккаунте активирован General Data Protection Regulation (GDPR), то вы сможете добавить еще один шаг – галочку, которой посетитель будет отмечать свое согласие на коммуникацию.

• Кликните по Select a language, выберите настройки языка для виджета чата и нажмите Save.
  
• Чтобы включить в виджете cookies с текстом согласия, активируйте переключатель Consent to collect chat cookies. В данном случае вы не можете настраивать текст согласия, который появляется в баннере.
• Для сбора согласия на обработку персональных данных активируйте переключатель Consent to process data.
  • Require explicit consent – прежде чем отправить свое сообщение, пользователь должен нажать I agree.
  • Legitimate interest – пользователь выражает согласие на дальнейшую коммуникацию в момент начала чата с вами. Текст для согласия на обработку данных так и останется на странице, однако пользователю больше не нужно будет нажимать I agree.
    

1. Кликните по выпадающему списку Consent type и выберите одну из следующих опций:
2. В поле Process consent text добавьте текст-обоснование для хранения и обработки персональных данных посетителей.
   

Если вы хотите автоматически добавлять участников чата в определенный тип подписки, активируйте переключатель Consent to communicate.

1. Кликните по выпадающему списку Subscription type и укажите нужный тип подписки, в который будут добавляться подобные посетители.
2. Через текстовое поле Checkbox label сообщите посетителю о типах коммуникации, на которые соглашается пользователь.
   

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

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

Как создать бота

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

• Откройте свой HubSpot-аккаунт, перейдите в Conversations > Chatflows.
• Справа вверху нажмите Create chatflow.
• Выберите Website.
• В боковом меню укажите шаблон бота: Qualify leads bot, Book meetings bot или Support bot.

Примечание: Ботов техподдержки могут создавать только пользователи Service Hub с доступом Admin.

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

1. Build – создание приветственного сообщения бота

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

• Для изменения текста в приветственном сообщении откройте шаблон бота и нажмите на Welcome message.
  
• Укажите текст приветствия в поле Welcome message справа и нажмите Save.
  

• Для изменения текста или поведения бота воспользуйтесь разделом action в шаблоне бота. На панели справа:

1. Настройте действия бота. Настройки будут варьировать, в зависимости от изменяемого типа действия.
2. Пользователи с лицензией Professional или Enterprise могут настраивать ход беседы с помощью условной логики (вкладка If/then branches).

Примечание: Пользователи с бесплатным доступом и лицензией Starter не могут добавлять настраиваемые условия.

• Нажмите на иконку с плюсом, чтобы добавить новый вопрос или действие.
  
• Если вы хотите подключить ранее отключенные действия, то нажмите кнопку Alerts (слева вверху). Для поиска всех отключенных действий можно воспользоваться строкой Go to action (справа вверху).
• Как только вы завершите настройку действий ботов, то увидите общий сценарий бота с описанием каждого действия. Вы можете просмотреть условную логику и внести изменения в ветки if/then, изменить настройки определенного действия или поискать конкретное действие с помощью поисковой строки Go to action.
  
• Для предварительного просмотра бота «в действии» нажмите Preview.
• Затем нажмите Save (вверху) и в боковом меню перейдите во вкладку Target.

2. Target – где показывать бота

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

• Настроить показ бота при открытии определенных страниц сайта можно в разделе Website URL:
  1. В первом выпадающем меню выберите Website URL.
  2. Далее задайте условия таргетинга.
  3. В текстовом поле укажите все нужные критерии.

• Чтобы пользователь видел бота при открытии одной из преднастроенных страниц, необходимо настроить параметры запроса:
  1. Кликните по первому выпадающему списку и выберите Query parameter.
  2. В первом текстовом поле укажите название параметра запроса.
  3. Во втором текстовом поле введите значение параметра запроса.
     
• Если вам нужно добавить еще одно правило, то воспользуйтесь опцией Add rule.
• Чтобы убрать бота с каких-то страниц сайта (например, со страницы Политики конфиденциальности), нажмите Add exclusion rule.

Также вы можете настроить таргетинг для показа бота определенной категории контактов. Раздел Visitor information and behavior позволяет задавать критерии показа на основании известных сведений о посетителе.

• Кликните по первому выпадающему списку и выберите фильтр. Вы можете задавать отдельные фильтры показа для известных вам контактов и неизвестных посетителей.
• Во втором выпадающем списке укажите критерии.
• Для добавления еще одного правила нажмите Add rule.
• Чтобы отключить показ бота на каких-либо страницах (например, Политика конфиденциальности), воспользуйтесь Add exclusion rule.
• Для создания группы фильтров с дополнительными параметрами таргетинга нажмите Add filter group
  
• Затем сохраните изменения кнопкой Save (внизу) и в боковом меню перейдите во вкладку Display.

3. Display – настройка внешнего вида чата

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

• В текстовом поле Chat heading укажите название бота. Чтобы изменить аватар бота, наведите на него курсором и нажмите Change photo.

• Настроить поведение виджета на экране компьютеров или мобильных устройств вы можете в разделе Chat display behavior.
  • Pop open the welcome message as a prompt – показать приветственное сообщение над виджетом чата.
  • Only show the chat launcher – показать только иконку запуска чата; пользователь должен кликнуть по иконе, чтобы увидеть окно чата.

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

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

1. On exit intent – загружать виджет чата, когда курсор посетителя перемещается к верхней части экрана браузера.
2. Time on page in seconds – загружать виджет чата по прошествии определенного периода времени (в секундах), которое пользователь проводит на странице.
3. Percentage of the page scrolled – загружать виджет чата, когда пользователь прокручивает страницу до определенной точки экрана.

Примечание: после завершения настроек чата он начнет автоматически загружаться на страницы сайта. Добавьте в конце URL страницы #hs—chat—open – так вы сможете привязать эти URL к емейлам, лэндингам и прочим маркетинговым кампаниями, которые будут направлять посетителей в виджет чата для дальнейшей коммуникации.

4. Options

Здесь настраиваются параметры отображения бота.

Чтобы бот отправлял ответы с небольшой задержкой, кликните по Typing delay between messages  и настройте параметры.

• Чтобы настроить временной интервал между окончанием сессии чата и ее возобновлением, нажмите Session timeout и настройте параметры. Сессия чата не возобновится, если в прошлой сессии с посетителем бот завершил все настроенные действия.
• Чтобы настроить сообщение, которое посетитель увидит при ошибке в запросе, воспользуйтесь полем Generic error message.
• Чтобы изменить язык бота, кликните по Select a language и выберите подходящий вариант.
• Если вы захотите, чтобы чат включался только тогда, когда есть свободные сотрудники для общения, то воспользуйтесь опцией Availability и укажите параметры.
  

• Чтобы включить в боте cookies с текстом согласия, активируйте переключатель Consent to collect chat cookies. Вы не можете настраивать текст согласия из cookies, который появляется в баннере.
• Для сбора согласия на обработку персональных данных активируйте переключатель Consent to process data.
  • Require explicit consent – прежде чем отправить свое сообщение, пользователь должен нажать I agree.
  • Legitimate interest – пользователь выражает согласие на дальнейшую коммуникацию в момент начала чата с вами. Текст для согласия на обработку данных так и останется на странице, однако пользователю больше не нужно будет нажимать I agree.
    

1. Кликните по выпадающему списку Consent type и выберите одну из следующих опций:
2. В поле Process consent text добавьте текст-обоснование для хранения и обработки персональных данных посетителей.
   

Нажмите Save.

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

HTML5CSS.ru

ЛУЧШИЙ САЙТ ДЛЯ РАЗРАБОТЧИКОВ

❮ Назад Дальше ❯

Узнайте, как создать чат с помощью CSS.

Chat Messages

Hello. How are you today?

11:00

Hey! I’m fine. Thanks for asking!

11:01

Sweet! So, what do you wanna do today?

11:02

Nah, I dunno. Play soccer.. or learn more coding perhaps?

11:05

Создание чата

Шаг 1) добавить HTML:

Пример

<div>
  <img src=»/w3images/bandmember.jpg» alt=»Avatar»>
  <p>Hello. How are you today?</p>
  <span class=»time-right»>11:00</span>
</div>

<div>
  <img src=»/w3images/avatar_g2. jpg» alt=»Avatar»>
  <p>Hey! I’m fine. Thanks for asking!</p>
  <span>11:01</span>
</div>

<div>
  <img src=»/w3images/bandmember.jpg» alt=»Avatar»>
  <p>Sweet! So, what do you wanna do today?</p>
  <span>11:02</span>
</div>

<div>
  <img src=»/w3images/avatar_g2.jpg» alt=»Avatar»>
  <p>Nah, I dunno. Play soccer.. or learn more coding perhaps?</p>
  <span>11:05</span>
</div>

Шаг 2) добавить CSS:

Пример

/* Chat containers */
.container {
    border: 2px solid #dedede;
    background-color: #f1f1f1;
    border-radius: 5px;
    padding: 10px;
    margin: 10px 0;
}

/* Darker chat container */
.darker {
    border-color: #ccc;
    background-color: #ddd;
}

/* Clear floats */
.container::after {
    content: «»;
    clear: both;
    display: table;
}

/* Style images */
. container img {
    float: left;
    max-width: 60px;
    width: 100%;
    margin-right: 20px;
    border-radius: 50%;
}

/* Style the right image */
.container img.right {
    float: right;
    margin-left: 20px;
    margin-right:0;
}

/* Style time text */
.time-right {
    float: right;
    color: #aaa;
}

/* Style time text */
.time-left {
    float: left;
    color: #999;
}

❮ Назад Дальше ❯

Как сделать

Вкладки
Выпадающие
Аккордеоны
Конвертер
Анимированные кнопки
Боковая Навигация
Верхняя навигация
Модальные коробки
Строки хода выполнения
Параллакс
Форма входа
HTML вставка
Google Карты
Ползунки диапазона
Подсказки
Слайдшоу
Список фильтров
Сортировать список
html картинка
как вставить картинку в html
цвет текста фона
размер текста html
цвет размер шрифта html
формы html
список html
таблица html
как сделать ссылку в html
html элементы

Copyright 2018-2020 HTML5CSS. ru

Правила и Условия Политика конфиденциальности О нас Контакты

Как создать собственный веб-сайт чата с помощью WordPress

• Фейсбук
• Твиттер
• LinkedIn

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

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

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

Что такое веб-сайт чата?

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

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

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

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

Очень похоже на разные форумы Reddit или серверы Discord.

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

Стоит ли строить его в 2022 году?

Если быть до конца честным, то вряд ли.

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

И это совершенно бесплатно.

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

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

Существует также несколько служб чата, которые предприятия используют для общения, например Microsoft Teams или Slack. Не говоря уже о бесчисленных приложениях для телефона.

Тем не менее, если вы все еще хотите попробовать создать свой собственный, давайте начнем.

Как создать веб-сайт чата

Шаг 0: Определите фокус

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

Или ваш веб-сайт может быть связан с определенной темой, которая вам не нравится. Интернет не самое приятное место.

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

Надеюсь, это второй вариант, потому что первый вариант был бы катастрофой. Конечно, важна не только тема.

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

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

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

Шаг 1: Выберите платформу для создания (WordPress)

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

WordPress — самая популярная CMS на рынке, с ее помощью создано более 40% Интернета. Это потому, что он прост в использовании, бесплатен и может создать любой тип веб-сайта.

С WordPress вам не придется писать ни строчки кода, но эти знания могут помочь.

Собственно, именно поэтому платформу любят как новички, так и эксперты в индустрии веб-дизайна.

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

Принимая во внимание, что тема представляет собой набор шаблонов и таблиц стилей, которые придают вашему веб-сайту его внешний вид. Все в теме настраивается. Оба они доступны в бесплатной и премиальной версиях, и есть множество отличных вариантов для сайта онлайн-чата ( См. шаг 3 ).

Шаг 2: Выберите веб-хостинг и доменное имя

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

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

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

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

Вместо этого мы можем иметь положительный эффект.

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

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

Шаг 3: Установите WordPress и выберите тему и плагины для использования

Теперь вы готовы приступить к созданию веб-сайта чата. Сначала установите WordPress с помощью Softaculous.

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

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

Вот несколько плагинов, которые могут оказаться полезными:

AtomChat

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

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

Чаты могут быть организованы по темам, чтобы упростить их организацию. Вы можете использовать бесплатную пробную версию, чтобы узнать, подходит ли она вам.

Групповой чат BuddyPress

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

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

Это отличный способ создать сайт живого чата.

Шаг 4. Составьте план модерации

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

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

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

Теперь ваш сайт чата готов к работе; поздравления.

Создайте чат сегодня

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

Какие темы будут обсуждаться в вашем чате? Рассматривали ли вы другие варианты, такие как Discord?

• Фейсбук
• Твиттер
• LinkedIn

5 очень простых способов бесплатно добавить онлайн-чат на свой веб-сайт

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

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

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

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

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

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

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

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

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

Tawk.to

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

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

У Tawk.to есть некоторые платные опции, такие как плата, если вы хотите удалить их брендинг. Тем не менее, у большинства людей не возникнет проблем с использованием бесплатной версии для всех их нужд.

HubSpot

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

Мы включили HubSpot в качестве опции №1, потому что бесплатный онлайн-чат — это лишь верхушка айсберга. Если вы создаете чат-сервисы для построения долгосрочных отношений со своими клиентами и повышения прибыльности, вам нужно думать о долгосрочной перспективе.

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

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

Прочитайте наш пост «Что такое HubSpot», если вы хотите получить более подробное объяснение того, как работает HubSpot и насколько проще может стать ваша жизнь, когда вы используете его для своего бизнеса.

Уже являетесь пользователем HubSpot и хотите настроить чат? Посмотрите наше руководство здесь:

Служба поддержки WP Live Chat

Служба поддержки WP Live Chat — отличный вариант, если ваш веб-сайт создан на WordPress. Этот бесплатный плагин WordPress позволяет вам управлять своими чатами прямо из административной панели WordPress, устраняя необходимость входа в другой программный инструмент.

Бесплатная версия содержит множество функций, включая возможность настраивать внешний вид окна чата, неограниченное количество одновременных чатов и настраиваемые офлайн-сообщения. В отличие от большинства других бесплатных инструментов чата на веб-сайте, поддержка WP Live Chat не имеет своего бренда или ссылки «работает от» в окне чата, что является приятным сюрпризом. Это бесплатно для до 10 пользователей.

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

LiveSupporti

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

Платный план LiveSupporti стоит всего 5 долларов в месяц и дает вам возможность иметь 5 агентов (вместо 3), получать многоязычную поддержку и включать систему тикетов, а также другие параметры настройки.

Userlike

Userlike предлагает простое окно чата на бесплатном плане, которое дает вам одного оператора и виджет чата с неограниченным количеством чатов, что является отличным местом для начала.

Их платные планы позволяют вам добавлять навыки оператора, чтобы сопоставлять клиентов с экспертом по определенной теме, и позволяют вам общаться с клиентами с помощью таких сервисов, как SMS, Facebook и Telegram. Они сосредоточены на персонализации и обратной связи в своих функциях чата. Планы Userlike начинаются с ~ 9 долларов.0/месяц с базовыми вариантами настройки и интеграции.

Бонус : MyLiveChat

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

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

Если вам нужно больше, чем то, что предлагает бесплатный вариант, MyLiveChat предлагает платные планы (начиная с 15 долларов США), которые позволяют вам делать такие вещи, как удаление их торговой марки и добавление возможности иметь несколько агентов, общающихся с посетителями сайта одновременно. время. В целом, между платными планами нет большой разницы, кроме количества предлагаемых мест.

Второй бонус: Интерком

Интерком — один из самых популярных онлайн-чатов — и не просто так. У них один из лучших пользовательских интерфейсов и самые надежные функции. Если вы хотите полностью погрузиться в живой чат или у вас есть приложение или продукт SaaS, вам определенно стоит обратить внимание на Intercom. Одно предостережение заключается в том, что у них нет бесплатной опции, хотя они позволяют вам попробовать ее бесплатно в течение первых 14 дней.