본문 바로가기

   
IT/IT 정보

네이버 동영상 티스토리 블로그 또는 홈페이지에 동영상 넣는 방법

반응형

네이버 동영상 티스토리 블로그 또는 홈페이지에 동영상 넣는 방법

네이버에서 제공하는 영상에 대해서 네이버 블로그에서 올리는 방법은(http://zzarungna.tistory.com/601) 이전에 작성한것이 있으니 네이버 블로그를 하시는분들은 참고하시면 좋을듯 합니다. 
 

네이버에서 제공하는 동영상 같은 경우 티스토리 블로그나 개인 웹사이트에서 동영상을 쉽게 첨부할수 있게 코드를 제공해 줍니다. 간단히 사용하는 방법에 대해서 작성 하도록 하겠습니다.

 

네이버 동영상에 모든 동영상 서비스에 대해서 동영상을 제공해 주는것은 아니고 저작권이 걸려있는 대부분의 영상은 링크만 첨부할수 있도록 되어 있습니다. 아예 방법은 없는 것은 아니지만 iframe태그를 이용해서 수정은 가능 하지만 완벽히 컨트롤 하기는 쉽지 않습니다. 대표적으로 네이버TVCast 에서 제공해주는 영상은 대부분 영상을 쉽게 사이트에 게시할수 있도록 소스코드를 제공해 줍니다.

티스토리 블로그에 네이버 동영상 넣는 방법

예를들어 다른사람의 블로그에서 동영상을 가져오고 싶으시다면 아래 이미지에 표시된 화살표 방향의 버튼을 눌러 주시면 됩니다.

 

그런뒤에 소스코드 탭을 클릭해 주시고 이미지에 표시한 네모칸에 있는 소스코드를 복사해 주시면 됩니다.


 

또는 네이버TV캐스트에서 제공하는 영상을 티스토리 블로그에 동영상을 직접 게시하고 싶다면 아래 이미지에 상단에 표시된 화살표 방향의 버튼을 먼저 눌러주시고 거기서나온 탭 메뉴중에서 크기를 지정하신뒤에 자동재생할건지 아닌지를 체크 하시고 코드 복사를 눌러 주시면 됩니다.

 


 

다른사람의 블로그든 네이버TV캐스트든 소스코드가 복사 하시면 아래 이미지처럼 팝업으로 나올것입니다. 재차 확인을 위해서는 Ctrl+V 또는 마우스 오른쪽 버튼을 누른뒤에 메모장 같은곳에 붙여넣기를 해보시면 <iframe으로 시작 하는 글이 복사가 되었다면 정상적으로 소스코드를 복사한것입니다.

 


 

이제 복사를 완료한 소스코드를 티스토리 블로그에 직접 넣어 보도록 하겠습니다.  아래이미지에 표시된 화살표 방향이 가르키는 HTML을 눌러 주시면 됩니다.


 

그런뒤에 복사된 <iframe으로 시작된 소스코드를 넣어주시기만 하면 끝납니다. 처음과 끝에 <p></p>태그는 신경쓰지 않아도 됩니다. HTML언어에서 문단을 나눌때 사용되는 코드라고 생각 하시면 됩니다. 그냥 빈공간에 복사한 코드를 붙여 넣기만 하시면 됩니다.


 

 

개인 홈페이지에 네이버 동영상 넣는 방법

방금 복사한 코드를 메모장을 열어서 붙여넣어 보도록 합시다. 코드만 복사하셔도 되지만 HTML 기본 구문을 작성을 하였습니다.

<html>

<head><head>

<title></title>

<body>

테스트 해보실분은 이글자를 제외한 html 코드를 복사하시고 이글자 대신 네이버에서 가져온 소스코드를 이곳에 붙여 넣으시면 됩니다.

</body>

</html>


 

그런뒤에 메모장에서 작성한 코드를 이름을 붙인뒤에 .html 확장자를 붙여서 저장해 보도록 합시다.


 

저장된 html파일을 더블클릭하여 실행을 해보도록 하겠습니다.


 

윈도우10 엣지에서 직접 작성한 파일을 실행한 모습인데 기본적으로 연결된 웹브라우저로 열릴것 입니다. 열리면 정상적으로 네이버 동영상이 포함된 웹페이지가 열리는것을 확인하실수 있습니다.

 

웹언어인 php, jsp, asp, c#이든 실제 화면에 보여지는 HTML 구문에서 넣고싶은 부분에 <iframe으로 시작되는 html 소스 코드를 붙여 넣어 주는것만으로 쉽게 동영상을 홈페이지에 올릴수 있습니다.


 

결국엔 복사한 소스코드를 웹페이지든 티스토리 블로그에서든 HTML수정이 가능한 부분에 붙여 넣어 주는것만으로 쉽게 동영상 첨부가 가능 합니다. 네이버 동영상중 소스코드를 제공하지 않는것도 있습니다. 이런 경우는 <iframe> 이라는 태그를 직접 사용해 링크에 동영상이 보여지는 주소를 넣고 사이즈 조절을 하면 동영상을 넣을수는 있지만 완벽히 컨트롤 할수는 없습니다.

 

네이버 동영상들중 소스코드를 지원하지 않는 동영상을 HTML 소스코드를 직접 작성하며 iframe태그로 사용하는 방법에 대해서는 작성하지는 않았습니다. 동영상중 소스코드를 지원을 하지 않는 다는 것은 다른곳에서 직접 첨부하면 문제가 되는 영상일 가능성이 있는 동영상이기 때문입니다. 그래서 기본적인 방법만 작성하였으니 필요한 분에게 도움이 되길 바랍니다.

반응형