생활정보 연구소
티스토리 블로그 복사금지 설정 및 특정영역 복사허용 방법 본문
그동안 블로그를 운영하면서 화날때 있으셨나요? 전 심혈을 기울여서 제 시간 쪼개서 힘들게 작성한 포스팅을 복붙해서 그대로 올리는 분들 보고 얼마나 화나던지. 당해보니 정말 열받더라고요. 바로 신고해서 삭제하도록 했죠.
그러다보니 티스토리에서 제공하는 오른쪽클릭 방지 플러그인까지 사용했습니다. 아무래도 오른쪽 클릭이 안되니 저의 글을 무단 불펌하는 사례는 많이 줄어들었습니다. 문제는 정보를 얻으러 제 블로그를 찾아온 구독자분들이 불편했습니다.
블로그를 하다보면 소스코드나 중요한 내용 등은 복사하기를 허용해야 되는데 마우스 오른쪽클릭을 방지해 놓으니 좋은 내용도 공유를 할 수 가 없었습니다. 오른쪽 클릭 방지는 지식 공유에 암적인 기능이라는 글도 봤었죠ㅎ저도 어느정도 인정하지만 저의 창작물이 무단으로 사용되는 것을 보니 너무 힘이 빠지더라구요.
이 부분만 복사가 가능해요
제가 원하는건 전체글을 복사 금지하고 제가 원하는 부분만 쉽게 복사를 허용할 수 있는 방법이었습니다. 그런데 아무리 구글링을 해봐도 어렵고 사용하기가 불편해서 포기했었죠.
이번에 정말 마음 단단히 먹고 열심히 알아보고 연구해서 결국 방법을 찾았습니다. 아래 순서대로 티스토리 스킨의 CSS를 변경하면 쉽게 복사 금지 설정이 가능하고 원하는 구문만 복사를 허용할 수 있습니다. 티스토리 복사 금지 설정 및 특정 영역 복사 허용 방법 자세히 알아보겠습니다.
불펌 방지 설정하기
1. 티스토리 마우스 오른쪽클릭 방지 플러그인 해제
혹시 마우스 오른쪽 클릭방지 플러그인을 사용하고 계신다면 해제해 주세요. 티스토리 관리모드에서 가능합니다.
마우스 오른쪽클릭 방지 플러그인
마우스 오른쪽클릭 방지 플러그인 해제
2. 스킨변경
스킨변경
3. 스킨편집
스킨편집
4. html 편집
html 편집
5. CSS에 불펌방지 코드 붙여넣기
html이 아니라 CSS탭에 가장 아래부분에 코드를 붙여넣어 주세요. 그리고 오른쪽 상단에 적용버튼을 눌러주시면 설정 끝!
불펌방지 소스 붙여넣기
티스토리 불펌 방지 및 특정영역 복사허용 코드 (복사 가능)
12345678910111213 /*181224 블로그 불펌방지 및 특정영역 허용*/code {-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;} cs
간단하게 설명하자면 body 부분의 마우스 오른쪽클릭과 드래그 등을 금지하고 code 태그를 쓰면 복사를 허용한다는 코드입니다. 본문은 복사가 안되지만 위의 코드는 복사 가능합니다.
사용방법
티스토리에서 포스팅 작성시 html 편집기 모드에서 원하는 구문 사이에 <code> ... </code>를 넣으면 그 구문은 복사가 가능합니다.
1 | <code> 복사 허용하고 싶은 구문 </code> | cs |
티스토리 html 에디터
위와 같이 html 편집기에서 code 코드 태그를 삽입 하면 이렇게 복사 허용하고 싶은 구문
특정 부분만 복사를 허용할 수 있습니다.
응용하기
1. 다른 태그도 설정 가능해요.
<code> 대신 <blockquote>와 같은 태그도 가능합니다. 소스코드의 code를 blockquote로 바꾸면 blockquote 태그가 쓰여진 곳만 복사가 가능해 지는 것입니다. 복사가능 태그를 code, blockquote 처럼 동시에 여러개로 지정할 수도 있습니다.
2. 나만의 명령어로 바꿀 수 있을까?
code나 blockquote는 이미 html에서 지정된 명령어들입니다. 그러다 보니 복사 가능영역은 폰트가 다르게 나옵니다. 만약 나만의 명령어를 만들어서 그 명령어에 블로그 스킨과 같은 폰트를 입력해 놓으면 어색함 없이 표현할 수 있을 거 같은데요. 아니면 code 명령어를 기본폰트와 같은 폰트로 나오도록 수정하는 방법도 있을 거 같습니다. 이 부분은 좀 더 고민을 해봐야겠습니다.
마치며..
이렇게 별짓을 다해도 완벽하게 불펌을 막을 수는 없습니다. 구글링 잠깐만 해도 웹페이지 복사하는 방법이 수십가지 나오니까요. 그런 방법을 몰라도 이미지 텍스트 변환프로그램도 많고 정 안되면 그대로 타자치면 되는거니까요. 일차적인 방지책이라고 보시면 됩니다. 제가 알아본 방법 중에 가장 간편한 방법이고 저도 유용하게 사용하고 있답니다.
갓쇼님이 중요한 내용을 피드백해주셨습니다. 소중한 피드백 감사합니다. 이 포스팅에서 설명한 방법은 텍스트는 잘 되는데 이미지는 적용이 안됩니다. 이미지 불펌금지 방법은 아래 링크를 참조바랍니다. 이미지 설정방법은 정말 간단하니 텍스트, 이미지 둘다 설정해 두시면 좋을거 같습니다.
정성글에는 공감❤ 댓글📝 팍팍!
-
철이쓰 2018.12.25 16:30 신고 일부 허용도 할 수가 있군여..몰랐습니당..
-
강가이버 2018.12.25 22:07 신고 기껏 검색했는데 소스코드처럼 복사가 필요한자료에 복사금지가 되어 있으면 저도 짜증이 많이 나더라구요ㅠ다행히 방법을 찾았습니다.
-
갓쇼 2019.01.19 01:06 신고 너무 유용한 정보네요 감사합니다^^. 혹시 사진도 복사 못하게 할 수 있나요??
-
강가이버 2019.01.19 03:08 신고 소중한 댓글 정말 감사합니다. 확인해보니 제가 설명한 코드만 적용하면 이미지는 복사가 가능하더라구요. 몰랐습니다ㅠㅠ그래서 이미지 불펌금지 설정하는 방법도 업데이트해놨습니다. 도움이 되셨음 좋겠네요~
-
네이버블로거 2019.02.10 04:19 안녕하세요! 먼저 유용한 정보 감사드려요. 저는 네이버 블로그를 쓰는 중인데 강가이버님의 글을 보고 활용하니 네이버에도 부분 복사 허용을 적용 할 수가 있었어요!! 혹시 이에 대한 포스팅을 해도 괜찮을까요?? 출처는 물론 꼭 남기겠습니다.
-
강가이버 2019.02.10 04:27 신고 출처남겨주시구요. 네이버에 응용하는 방법 포스팅 좋은 정보가 될거같네요. 이미지와 내용 그대로 가져가시지만 않으면 괜찮습니다. 구경가게 나중에 링크도 남겨주시면 감사요~참고로 이미지는 안될수도 있어요. 좋은주말 되세요.
-
네이버블로거 2019.02.10 04:40 ㅜㅜ 여러가지 실험해보고 있는데 네이버에서는 확실히 사용이 제한적이네요ㅜㅜ 나중에 포스팅하면 링크 꼭 남겨드릴게요! 감사합니다~
-
방문자 2019.08.16 13:49 css 적용했는데 드래그는 되는데 복사가 안되네용... ㅠㅠ 어떻게 해야될까요..
-
강가이버 2020.03.29 16:34 신고 위에 소개한 방법대로 했을 때 제 스킨에선 되던데요, 다른 스킨에선 어떻게 될지 저도 잘 몰라서요ㅠ
-
hyeonggi.kim 2020.03.27 14:35 신고 유용한 정보 감사합니다!
제 블로그에서도 이 글 소개해도 괜찮을까요?
당연히 출처는 남기겠습니다! -
강가이버 2020.03.29 16:32 신고 네 출처남겨주시기 바래요.
-
개발여행 2020.05.17 19:07 신고 덕분에 좋은 정보 얻고 갑니다
감사합니다!
-
강가이버 2020.09.14 04:00 신고 방문 감사합니다~~좋은 하루 되세요~
-
LEA 레아 2020.08.23 03:47 신고 와 너무 감사합니다 독학으로 블로그 직접 하나 하나 디자인중인데 복금을 아무리 해봐도 모바일에선 무소용이라서 난감했는데 이거 너무 좋아요!
-
강가이버 2020.09.14 04:01 신고 오 블로그를 디자인중이시라니!!능력자시네요..유용하게 쓰시면 좋겠네요~댓글 감사합니다^^
-
2020.10.22 02:56 비밀댓글입니다