[티스토리] 코드블록만 "복사", "붙여넣기" 허용하기

티스토리 코드블록만 복사, 붙여넣기 허용하기

개발 관련 티스토리 블로그 글 작성 시 코드블록을 통해 코드를 공유하는 글을 작성하게 됩니다. 본문 내용은 "복사", "붙여넣기"를 방지하고, 코드블록 안의 코드만 "복사", "붙여넣기"가 가능하게 하는 방법입니다.

 

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;
}

 

 

플러그인 설정

티스토리 플러그인에서 마우스 오른쪽 방지 플러그인을 해제합니다. 이미 해제된 상태라면 따로 설정이 필요하지 않습니다.

 

티스토리 플러그인 마우스 오른쪽 클릭 방지 설정

위와 같은 상태가 "마우스 오른쪽 방지" 기능이 해제된 상태입니다.

 

 

CSS 편집

아래의 사진과 같은 경로로 티스토리 CSS 편집의 가장 하단부에 코드를 추가하면 됩니다. 

티스토리 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, 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;
}

 

본 블로그도 해당 설정이 완료된 상태라, 코드블록만 "복사", "붙여넣기" 가능합니다.

 

같이 보면 좋은 글

티스토리 네임카드(프로필) 숨기는 방법

프로그램 설치 없이 WebP 이미지로 변환하는 방법

티스토리 블로그 이미지 SEO 최적화 방법