티스토리 블로그 특정 부분만 드래그 허용하기

티스토리 블로그를 운영하시다 보면 내가 쓴 글을 누군가가 그대로 복사해서 붙여 넣기 한 체로 글을 올리는 경우를 간혹 보게 됩니다. 내용이 비슷한 글도 아니고 정말 말 그대로 똑같은 글인 거죠. 당장은 내 글이 누군가가 퍼갈 정도로 잘 쓴 글이 아니더라도 언젠가 내가 열심히 쓴 글들이 다른 블로그에 똑같이 포스팅되어 있다면, 심지어 그 글이 내 글보다 노출 순위가 높다면 정말 황당할 겁니다. 이를 막기 위해서 많은 분들이 마우스 우클릭 방지나 드래그 금지를 설정해놓습니다. 

 

하지만 이러한 설정이 소스코드를 올리거나 단순히 눈으로 보고 따라서 작성하기에 힘든 내용을 포스팅할 때에는 오히려 독이 되는 경우가 있습니다. 나는 소스코드를 복사하려고 왔는데 금지되어 있으면 스트레스만 받고 바로 블로그를 나가게 되는 거죠. 오늘은 이럴 때 내가 원하는 부분만 드래그를 허용하는 방법에 대해 알려드리고자 합니다. 

 

내 블로그 글의 본문 전체를 드래그 금지하는 방법

1. 먼저 플러그인 설정에 "마우스 오른쪽 클릭 방지 플로그인"을 사용 중이라면 해제해주시기 바랍니다. 내 블로그에 접속한 후 관리 - 플러그인 - 마우스 오른쪽 클릭 방지 - 해제 순으로 진행하시면 됩니다.

2. 관리 - 스킨 편집 - html 편집에 들어가서 CSS 편집창을 클릭합니다.

3. 다음과 같은 코드를 CSS창 맨 밑에 복사, 붙여 넣기 한 후 적용을 눌러줍니다.

 

/*블로그 글 드래그 금지 및 특정 부분 허용*/
code, pre, blockquote {
-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편집

 

4. 이제 글쓰기로 들어가신 후에 우측 상단에 보시면 기본모드∨로 되어있는 곳을 클릭해서 HTML을 클릭합니다.

5. 내가 복사를 허용하고자 하는 텍스트의 처음과 끝에 <code>와 </code>를 넣습니다. 예를 들어보겠습니다.

 

html-code-사용법

 

이 글은 드래그 및 복사가 가능합니다.

 

6. 미리보기를 통해 글이 복사가 되는지 확인하시면 끝납니다.

 

※ 참고 : 위에 복사했던 코드를 보면 code는 코드 블럭, pre는  HTML 블럭, blockquote는 인용구의 드래그를 허용해주기 때문에 글쓰기 상단에 보면 이모티콘 왼쪽에 "(큰따옴표) 모양의 인용이나, ···모양의 더보기를 누르면 나오는 코드 블럭, HTML 블럭으로 글을 작성 시에 해당 글의 내용도 드래그가 가능해집니다.(단, HTML 블럭을 이용할 때는 HTML 삽입 창에서 드래그를 허용하고자 하는 글 양쪽에 <pre>과 </pre>를 입력해줘야 합니다. 사용법은 사진으로 보여드리겠습니다.)

 

HTML블럭-사용법

 

오늘은 내 티스토리 블로그 글의 특정 부분만 드래그를 허용하는 방법에 대해서 알아봤습니다. <code>와 </code>를 사용하여 여러 문단을 한꺼번에 묶을 경우에는 수정할 때마다 <code><code></code></code>와 같이 에러가 뜰 수 있기 때문에 가급적이면 하나의 문단마다 사용해주시는 편이 좋습니다. 알려드렸던 방법들 또한 드래그를 허용한 영역 사이에 있는 텍스트에 대해서는 허용이 되어있지 않더라도 드래그가 가능한 부분부터 끌어서 함께 드래그가 가능하기 때문에 완벽한 것은 아니지만 그래도 전부 허용하는 것보다는 블로그 운영에 도움이 될 거라고 생각합니다. 감사합니다.