티스토리 본문 특정 영역만 드래그 잠금 해제하기

멀티미디어 콘텐츠나 소프트웨어만 불법 복제되는 것이 아닙니다. 영화, 미드, 음악, 프로그램 등이 집중 적으로 불법 복제되는 것이지 언론사 기사, 사이트 게시물, 블로그 글 등도 엄청나게 불법 복제 당하고 있습니다. 교육을 덜 받은 인간들이 훔쳐서 자신의 블로그나 사이트에 게재하는 경우도 있지만, 커뮤니티의 불법 복제 문제는 정말 심각합니다.


대부분의 커뮤니티 게시판을 보면 출처 표시된 펌글이 넘쳐 흐릅니다. 인기 글의 십중팔구는 펌글입니다. 정말 웃긴 것은 커뮤니티의 펌글을 다른 커뮤니티에서 퍼다가 게재하며 퍼온 커뮤니트를 출처로 명시합니다. 도둑놈 집에서 훔쳐온 TV에 옆집 도둑놈 집에서 가져온 TV라고 붙여 놓는 꼴이죠. 그렇지 않다고 아무리 우겨봐야 소용 없습니다. 현실이고 사실이니 말입니다.


네이버 및 다음의 비공개 카페 까보면 정말 엄청날 겁니다. 비공개로 숨어서 무엇을 공유하는지 알 수 없으니 말입니다. 네이버와 다음이 애당초 펌질 기능을 막았어야 하는데요. 대체 왜 펌질 기능을 넣어 서비스를 하였는지 모르겠습니다. 여튼 커뮤니티들은 지금도 옆집 도둑놈 집에서 가져온 TV라고 출처 달아 놓고 열심히 펌질 중입니다.


사이트 및 블로그 운영자들은 펌질 못하게 막을 수 밖에 없습니다. 비웃으며 펌질하는 도둑놈이 있겠지만 대비는 해야죠. 마우스 우클릭 금지 및 드래그 금지 설정해 놓으면 약간의 효과를 볼 수 있습니다. 막 퍼가느냐 약간의 수고를 하고 퍼가느냐 차이이지만 그래도 효과는 볼 수 있습니다.


사이트도 그렇겠지만 블로그에 마우스 우클릭 금지 및 드래그 금지 설정을 하면 약간의 문제가 발생되는 경우가 있습니다. 일반적인 사진 및 텍스트 구성의 게시물이라면 아무 문제가 없을 것인데요. 블로그 스킨이나 프로그래밍 관련된 소스 등을 설명하거나 공개하는 글에는 드래그 금지가 걸려 있으면 어후야 정말 답답할 수 밖에 없죠. 소스를 일일이 다 키보드로 쳐서 복사할 수도 없는 노릇이니까요. 그래서 소스를 텍스트 문서에 담아 다운로드 받을 수 있게 하는 경우가 많은데요. 이 방법에도 문제가 있죠. 업로드한 파일이 사라지면 글 작성한 사람은 파일을 복구해야 합니다. 따박 따박 다시 키보드 두드려서 말입니다.


티스토리 본문 특정 영역만 드래그 해제

티스토리 본문 특정 영역만 드래그 해제


티스토리 본문 혹은 스킨의 특정 영역만 드래그가 가능하게 할 수 있습니다. 스킨 본문 혹은 전체를 드래그 금지 시켜 놓고 특정 영역만 드래그 혹은 소스 복사가 가능하게 할 수 있습니다. CSS에서 user-select로 간단하게 하는 방법이 있고, 프리즘(Prism) 같은 소스 코드 하이라이트를 이용하여 어렵게 하는 방법이 있는데요. 간단하게 하는 방법을 소개하겠습니다.


CSS로 특정 영역의 드래그만 해제 시키려면 우선 먼저 티스토리 관리 페이지에서 마우스 우클릭 드래그 금지 플러그인을 해제 시켜야 합니다. 마우스 오른쪽 클릭 방지인가 뭔가 하는 플러그인을 해제 시키면 됩니다.


드래그 금지 후 특정 영역만 드래그 해제 소스


플러그인을 해제 시킨 후 아래의 드래그 금지 후 특정 영역만 드래그 해제 소스를 html 편집 > CSS에 하단에 붙여 넣어 줍니다.


드래그 금지 후 특정 영역만 드래그 해제 소스


code,pre {
-webkit-user-select: text !important;
-moz-user-select: text !important;
-ms-user-select: text !important;
user-select: text !important;
}
body {
-webkit-user-select: none !important;
-moz-user-select: -moz-none !important;
-ms-user-select: none !important;
user-select: none !important;
}

위 소스를 그대로 CSS에 붙여 넣고 저장하면 code 태그와 pre 태그 영역은 드래그 금지가 해제 됩니다.


<code>불펌은 도둑질</code>

<pre>불펌의 불펌도 도둑질</pre>


예를 들면 위와 같이 code 태그와 pre 태그로 감싼 '불펌은 도둑질'과 '불펌의 불펌도 도둑질'만 드래그가 가능해집니다. 참고로 text는 텍스트 선택 가능이고, none은 텍스트 선택 안함입니다. auto는 디폴트 값으로 브라우저에서 허용할 경우에만 텍스트 선택이 가능합니다. all로 하면 클릭으로 텍스트를 선택할 수 있습니다.


프리즘에 드래그 금지 해제 적용


위쪽의 해제 소스 부분이 소스 코드 하이라이트 프리즘(Prism)을 이용한 것인데요. 언제 해제 될지 모르겠지만 해당 영역은 현재 드래그도 되고 copy를 눌러 해당 영역 내용을 클립보드로 복사할 수도 있습니다. 오래 전에 적용하였는데 이제야 user-select 사용 방법 하나를 소개하네요. 이 글도 발행 일정이 5월 중순은 되어야 발행되지 싶네요. 4월 30일 작성하였는데 말입니다. 여튼 언제 시간 되면 소스 코드 하이라이트 프리즘(Prism) 적용 방법도 설명하도록 하겠습니다. 티스토리 에디터가 업데이트 되며 의미가 없어졌지만 말입니다. 끝~


Copyright © 웹법사의 마법서재, 무단전재 및 재배포 금지.