HTML_생활코딩 : 동영상 삽입, 댓글 기능, 채팅 기능, 방문자 분석기

생활코딩 학습 내용 복습_3일차

 

- 날짜 : 2022.07.21.목

- 학습내용 : WEB 1 부록

 

1.  동영상 삽입

-<iframe> : 동영상을 삽입하는 코드

ex)

<iframe width="560" height="315" src="https://www.youtube.com/embed/tZooW6PritE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

 

2. 댓글 기능 추가

댓글 기능을 구현하는 것은 html로는 불가능하고, 백앤드 기술을 활용해야 한다. 또한 댓글은 스팸 같은 변수들도 있기 때문에, 스팸 차단 기능 등, 단순히 백앤드 기술 뿐만 아니라 복잡도가 높고 여러가지 기능이 필요하다. 그러므로 우리가 댓글기능을 직접 구현하는 것은 쉽지 않다. 그러나 개발을 해보는 것은 좋다. 그런데 직접 해보기 전에, 남들이 만든 댓글을 우리 웹사이트에 포함시키면 직접 구현하지 않고도 이런것이 가능하다는 것이다.

 

DISQUS, LiveRe 같은 서비스를 활용하면 가능하다.

이렇게!

https://myeongseoklee.github.io/my-first-website/

 

3. 채팅기능 추가

- www.tawk.to  

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

이거 엄청신기하다.. 방문자가 아래 채팅창으로 채팅을 하면, 관리자 pc에 전화벨이 울린다.. 문의가 들어왔다고.

그 알림을 듣고 실시간으로 문의자와 채팅이 가능함..

<!--Start of Tawk.to Script-->
<script type="text/javascript">
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/62d954fa37898912e95ef106/1g8gf7t9i';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
</script>
<!--End of Tawk.to Script-->

 

4. 웹사이트 방문자 분석기

- GA는 알고 있으므로 패스