백.전.백.승.

배경에 나오는 유튜브는 [범죄도시] 입니다. 그리고 이전은 [댓글부대] 이었습니다. 참고로 유튜브 배경 멈춤, 소리, 재생 등은 오른쪽 상단 플레이바를 사용하면 됩니다.

Made with Bootstrap 3 And Powered by Tistory

아래 그림에 보듯이 티스토리 블로그 사이드바에 유튜브 동영상이 있는 것을 많이 봤을 것이다. 이것을 해보는 것이다. 하는 방법은 아주 간단하다.



다른 사람의 티스토리를 돌아다니다 위 그림과 같이 사이드바에 유튜브 동영상이 있는 것을 자주 본다. 그것을 어떻게 할까 하고 생각했는데 하는 방법은 직접 해보니 쉽다고 생각됐다.



사이드바의 폭(너비)을 알아야 한다.


사이드바의 너비(폭)은 css에 알 수 있는데 보통 사이드바를 sidebar라고 하여 수치를 적는다. 그리고 폭(너비)은 width라고 하고 높이는 height라고 하니 폭은 width라 하고 높이는 height라고 하는 것을 기억했으면 한다. 


◆ 사이드바 : sidebar

◆ 폭(사이드바) : width



위 그림은 내 스킨의 style.css를 보면 사이드바의 폭(너비)가 240이라는 것을 알 수 있다. 티스토리에서 css는 어디에서 볼 수 있냐면 아래 그림처럼 관리로 들어가 꾸미기에서 HTML/CSS편집을 클릭하면 된다. 이 글에서는 sidebar 앞에 문자와 width 숫자옆의 단위는 중요하지 않으니 그냥 넘어가기 바란다. 신경쓰면 머리만 아플 것 같다.



유튜브 동영상 소스 가져오기


사이드바의 너비(폭)을 알았으면 동영상 소스를 퍼오면 된다. 유튜브 사이트로 가서 유튜브 동영상를 퍼오는 법은 공유 버튼을 누르면 된다. 만약 동영상을 특정 설정으로 가져오려면 소스코드를 눌러서 가져와야 한다. 그리고 스크롤을 내려 맞춤을 찾고 위에서 사이드바의 너비(폭)이 어떻게 됐는지 기억한다. 그리고 너비(폭)에 사이드바의 너비(폭)을 입력한다. 너비만 입력하면 높이는 자동으로 입력된다.



소스를 퍼와 아래처럼 위젯을 삽입하면 된다. 필자는 보통을 태그입력기를 통해서 소스를 입력한다. 사이드바에 위젯을 다는 것에 대해서는 다루지 않겠습니다. 위에서 width는 폭(너비)이라 했는데 아래 그림을 보면 width의 수치가 240으로 됐다. 참고로 치환자에 소스를 넣으면 되는데 네이버 블로그 등에서 오면 치환자가 무얼까 할 것 같다. 누구나 알기 쉬운 말로 했으면 좋겠는데.....다음팟TV의 동영상도 소스의 width를 수정하고 height를 지웠는데 됐다. 그러나 소스를 고치는 것이라 소스를 모르면 힘들 것 같다.


티스토리와 네이버 블로그의 사이드바 폭(너비)


티스토리 경우는 스킨마다 사이드바의 폭(너비)가 다르다는 것을 알아야 한다. 내 스킨의 경우는 240이니 다른 스킨을 200일 수도 있다. 그리고 다른 블로그의 경우 네이버 블로그와 다음 블로그는 폭(너비)가 170이다. 네이버 블로그와 다음 블로그는 스킨의 CSS를 수정할 수 없는지라 무조건 170이다.


아래는 네이버 블로그에서 사이드바에 위젯을 등록하는 것에 대한 그림인데 가로가 170이라고 나왔을 것입니다. 네이버 블로그의 사이드바는 170이니 안 다는것이 나을 것 같다. 참고로 네이버 블로그에서 위젯을 등록하는 것은 티스토리에서 사이드바에 위젯을 등록하는 것과 거의 비슷하고 네이버 블로그의 기능을 우습게 보면 안됩니다. 필자는 티스토리의 자유성만 빼면 기능에서는 블로그중에서 네이버 블로그보다 많은 블로그가 없다고 생각한다. 그러니 네이버 블로그를 우습게 보고 접근하지 말았으면 한다.



동영상 설치는 쉬운데 생각해봐야 할 것이 블로그 로딩이니 동영상 설치후 블로그 로딩이 느리다고 생각되면 설치하지 마세요. 현재 필자의 블로그는 애드센스 3개, 플로팅 배너 스크립트,웹폰트 사용으로 블로그 로딩이 느려져 위젯 등 설치를 하지 않고 있거든요.


'블로그/티스토리' 관련된 글 MORE



Close 방명록
×

카테고리




×
×