728x90
반응형
누군가 내 글을 무단으로 복사해서 사용할 것이 걱정되어 우클릭 및 드래그 금지까지 다 막아놓았었다.
[맨 처음 시도했을때 - 모든 드래그와 우클릭 막기 ]
- 블로그 관리 > 스킨편집 > html 편집에서 <body 태그 뒤에 attr 세개를 추가하였다.
<body oncontextmenu='return false' ondragstart='return false' onselectstart='return false'>oncontextmenu="return false" 우클릭 방지
ondragstart="return false" 드래그 방지
onselectstart="return false" 선택 방지
이렇게 했더니 블로그가 전체적으로 우클릭과 드래그를 막을 수 있었다.
한동안 이런 상태로 사용하고 있었으나, 문득 코드 부분에 있는 소스는 복사 가능했으면 하는 생각이 들었었다.
그 후 이것저것 찾아보다가 <code>태그에만 JQuery를 이용해서 우클릭 및 드래그가 가능하게 수정하였다.
$("code").attr("oncontextmenu","event.cancelBubble=true");
$("code").attr("ondragstart","event.cancelBubble=true");
$("code").attr("onselectstart","event.cancelBubble=true");위에 함수를 넣었더니 코드 부분만 드래그 및 우클릭이 가능했다.
성공인가 하고 좋아했지만 코드부터 드래그를 하면 본문내용까지 드래그가 가능한 문제가 생겼다.
[현재 적용상태]
현재 적용상태는 css에서 값을 수정하는 방법이다.
1. 위에 설정한 부분들은 다시 삭제한 후 진행한다.
2. 티스토리 블로그 플러그인 설정에서 마우스 오른쪽 클릭 방지 플러그인을 해지한다.
해당 플러그인을 눌러 해지 하면 된다.
3. 블로그 관리 > 스킨편집 > html 편집 > 상단에 CSS 클릭 하여 아래 내용을 붙여넣는다. 위치는 CSS맨 마지막에 붙여넣고 적용눌러서 적용시킨다.
/*블로그 복사 금지 및 특정영역 허용*/
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;
}
이렇게 하면 <code> 태그 내의 내용만 드래그 앤 우클릭이 가능한 상태가 된다.
728x90
반응형
LIST
'기타 > 티스토리 블로그' 카테고리의 다른 글
| 포토샵 없이 썸네일 메이커(Thumbnail Maker) 만들어 주는 사이트 (1) | 2022.04.07 |
|---|---|
| 파비콘(favicon.ico) 아이콘 생성해서 티스토리 블로그에 등록하기 (0) | 2022.03.23 |
| [Google Search Console] 티스토리 블로그 구글 서치 콘솔 등록하기 (0) | 2022.01.15 |