HTML에 채팅 기능 추가하기

안녕하세요.

오늘은 HTML에 웹 사이트 방문자와 채팅을 할 수 있는 채팅 기능을 추가하는 방법에 대해 알아보겠습니다.

 

혼자 스스로 채팅 기능을 구현한다는 것은 엄청 어려운 일이고 많은 시간과 기술 많은 노력, 돈이 들지만 이러한 기능을 간단히 제공하는 사이트가 있고 이 서비스를 웹 사이트 HTML에 붙여 채팅기능을 활용할 수 있습니다.

 

웹사이트에 채팅기능을 구현하기 이전에 지금까지 저희가 만든 html코드를 호스팅해 누구나 접근 가능한 웹 호스팅 페이지로 만들어야 합니다. 

 

웹 호스팅 하는 방법에 대해서는 아래에 포스팅 해놓겠습니다.

HTML을 github를 이용하여 웹 호스팅하기 (tistory.com)

 

이제 채팅기능을 구현 해주는 웹 사이트( tawk.to – "100% FREE live chat software for your website!" )에 방문하도록 하겠습니다.

100% FREE Live Chat Software, Ticketing & Knowledge Base! - www.tawk.to

 

 

홈페이지에 가서 중앙에 보이는 Get Free Widget버튼을 눌러줍니다.

이제 회원가입 창이 나올껀데 회원가입을 해주고 이메일인증이 가는데 작성한 이메일 주소로 들어가 이메일인증을 해주는 절차를 합니다.

 

 

이제 웹 호스팅을 통해 만든 자신의 웹페이지 주소를 빈칸에 삽입해주고 다음 버튼을 눌러줍니다.

 

 

그 후 사용할 관리자의 이름을 정해줍니다.

 

이제 보이는 코드 위에 마우스를 올려 놓으면 Copy to Clipboard가 나오게 됩니다. 이것을 복사하여 자신의 코드의 하단의 </body> 직전에 붙여주고 실행을 시켜주면 아래의 그림과 같이 채팅을 할 수 있는 기능이 구현되고 채팅에 글을 써보겠습니다.

 

이렇게 전송을 하면 이렇게 사이트에 누군가가 자신에세 메세지를 보냈다는 알림과 함께 메세지가 도착을 합니다.

하단의 Join Chat을 통해 메세지를 작성해 보내줍니다/

 

 

 

이렇게 채팅이 가능해졌습니다.

 

 

오늘은 html의 채팅추가 기능에 대해 알아봤습니다!

감사합니다.