워드프레스 강좌 / Crayon Syntax Highlighter / 글 목록에서 코드 제거하는 방법

Crayon Syntax Highlighter은 워드프레스에서 사용하는 코드 하이라이트 플러그인입니다. 최근엔 업데이트가 별로 없지만, 사용에는 문제가 없습니다.

Crayon Syntax Highlighter를 사용하면 한 가지 문제가 발생합니다. 글 시작 부분에 코드가 있으면 글 목록에서 그 코드가 나온다는 것입니다. 글 목록에 텍스트만 출력되는 상황이라면 그리 보기 싫지는 않지만, 썸네일이 들어가거나 2열로 배열한다면 모양이 이상해질 수 있습니다.

CSS로 가려야 하나, 스크립트로 제거해야 하나 고민했는데, Crayon Syntax Highlighter가 오래되고 많은 사람이 사용하는 플러그인이다보니 해결책이 설정이 있었습니다.

Remove Crayons from excerpts에 체크하면...

바로 해결됩니다.

같은 카테고리의 다른 글
워드프레스 강좌 / 플러그인 / Korea SNS / 카카오톡 등 한국형 SNS 공유 플러그인

워드프레스 강좌 / 플러그인 / Korea SNS / 카카오톡 등 한국형 SNS 공유 플러그인

Korea SNS Korea SNS는 포스트 등을 SNS에 쉽게 공유(게재)할 수 있게 해주는 플러그인입니다. 가장 큰 특징은 카카오톡, 라인, 밴드, 네이버 블로그 등 한국에서 많이 사용하는 SNS를 지원한다는 것입니다. 현재 지원하는 SNS는 다음과 같습니다. Facebook Twitter Google Kakao Story Kakaotalk Link Naver Line Naver Band Naver Blog 설치 에서 Koran SNS로 검색하여 플러그인을 추가하고 활성화시킵니다. 설정 설정은 에서 할 수 있습니다. 어떤 ...

워드프레스 강좌 / Smush / 이미지 압축, 최적화 플러그인

워드프레스 강좌 / Smush / 이미지 압축, 최적화 플러그인

워드프레스에 이미지를 업로드하면 썸네일을 만듭니다. 예를 들어 image.png를 업로드하면 image-150x150.png 같은 파일이 만들어지는 것이죠. 문제는 한 개만 만드는 것이 아니라는 것입니다. 워드프레스 미디어 설정에 있는 세 가지 썸네일은 기본으로 만들고, 테마에서 요구하는 썸네일, 플러그인에서 요구하는 썸네일 등을 잔뜩 만듭니다. 따라서 이미지를 한 개 업로드해도 여러 개의 썸네일 때문에 디스크 용량을 ...

워드프레스 / 플러그인 / KBoard / 일대일(1:1) 상담 게시판 만드는 방법

워드프레스 / 플러그인 / KBoard / 일대일(1:1) 상담 게시판 만드는 방법

인터넷 쇼핑몰이나 서비스에 일대일 상담 기능이 있습니다. 질문자 입장에서는 나의 문의나 정보가 다른 사람에게 공개되지 않고, 판매자 입장에서는 제품 또는 서비스의 문제점이나 오류가 알려지는 것을 방지할 수 있다는 장점이 있습니다. 워드프레스에 일대일 상담 기능을 제공하는 플러그인이 여러 가지가 있는데, KBoard를 이용해서 구현할 수도 있습니다. 무료이기도 하고, 이미 KBoard로 게시판을 운영하고 있다면 ...

워드프레스 강좌 / 플러그인 / Content Cards / 링크를 네이버나 페이스북처럼 만들어주는 플러그인

워드프레스 강좌 / 플러그인 / Content Cards / 링크를 네이버나 페이스북처럼 만들어주는 플러그인

Content Cards 네이버 블로그에서 링크를 추가하면, 썸네일과 요약글이 있는 링크가 만들어집니다. 페이스북에도 비슷한 기능이 있습니다. 워드프레스 자체에는 이 기능이 없지만, Content Cards 플러그인을 이용하면 비슷한 효과를 낼 수 있습니다. 설치 WordPress.ORG에서 공유되는 플러그인이므로 워드프레스 관리자에서 설치할 수 있습니다. 링크 삽입하기 플러그인을 활성화하면 에디터에 아이콘이 하나 생깁니다. 그 아이콘을 클릭하여 링크를 추가합니다. 링크가 가리키는 문서에서 이미지와 제목, 글의 일부를 ...

워드프레스 강좌 / 블록 에디터 / 코드 입력하는 방법

워드프레스 강좌 / 블록 에디터 / 코드 입력하는 방법

워드프레스에서 글 작성할 때 코드를 붙여넣으면, 들여쓰기가 제대로 표현되지 않거나 코드를 실행해버리는 등 원하는 모양으로 나오지 않는 경우가 있습니다. 그럴 경우 그대로 붙여넣지 말고 코드 블록으로 붙여넣습니다. + 아이콘을 클릭하고 를 클릭합니다. 그리고 코드를 붙여넣습니다.

워드프레스 강좌 / 플러그인 / Ad Inserter / 애드센스 광고 쉽게 삽입할 수 있게 해주는 플러그인

워드프레스 강좌 / 플러그인 / Ad Inserter / 애드센스 광고 쉽게 삽입할 수 있게 해주는 플러그인

Ad Inserter 워드프레스로 만든 사이트 또는 블로그에 애드센스 광고를 넣는 방법은 여러 가지입니다. 그 중 Ad Inserter 플러그인으로 광고를 삽입하는 방법을 소개합니다. Ad Inserter는 광고를 삽입하게 해주는 플러그인으로, 애드센스 광고를 본문 위, 본문 중간 등에 쉽게 넣을 수 있게 해줍니다. 설치 WordPress.ORG에서 공유되는 플러그인이므로 워드프레스 관리자에서 바로 설치할 수 있습니다. 본문에 애드센스 광고 넣기 본문 상단 설정은 ...

워드프레스 강좌 / 멀티사이트 만드는 방법

워드프레스 강좌 / 멀티사이트 만드는 방법

서브 도메인과 서브 디렉토리 멀티사이트를 만드는 방법에는 서브 도메인 방식과 서브 디텍토리 방식이 있습니다. cmsfactory.net이라는 도메인이 있을 때, abc.cmsfactory.net 이 서브 도메인이고 cmsfactory.net/abc 가 서브 디렉토리입니다. 서브 도메인 방식으로 멀티사이트를 만드는 것은 언제든 가능하지만, 서브 디렉토리 방식으로 멀티사이트를 만드는 것은 처음 설치했을 때만 가능합니다. 기존 URL과 멀티사이트의 URL이 충돌할 수 있기 때문입니다. 운영 중인 사이트에 멀티사이트를 추가하려고 하면 다음처럼 ...

워드프레스 강좌 / 글 / 고전 편집기 / 화면 옵션

워드프레스 강좌 / 글 / 고전 편집기 / 화면 옵션

워드프레스 관리자 페이지의 메뉴는 왼쪽에 있습니다. 플러그인이나 테마를 설치하면 메뉴는 더 늘어납니다. 왼쪽의 메뉴를 클릭하면 오른쪽에 관련 내용이 나옵니다. 그런데 보여줄 수 있는 모든 내용이 다 나오지는 않습니다. 화면 크기가 한정되어 있다보니 자주 사용되거나 중요한 내용만 나오기도 합니다. 숨겨진 내용은 오른쪽 위의 에서 보이게 할 수 있습니다.(반대로 화면에 있는 내용을 숨길 ...

워드프레스 강좌 / 플러그인 / Crayon Syntax Highlighter / 코드 문법 하이라이트 플러그인

워드프레스 강좌 / 플러그인 / Crayon Syntax Highlighter / 코드 문법 하이라이트 플러그인

Crayon Syntax Highlighter 프로그래밍을 주제로 하는 블로그나 사이트라면 수많은 코드를 글에 포함하게 됩니다. 코드는 <pre> 태그나 <code> 태그를 이용하여 고정폭 글꼴로 나타낼 수도 있으나, 단색으로 나타내므로 읽는게 불편합니다. 워드프레스에는 이런 불편을 해소해주는 Syntax Highlighter 플러그인이 많습니다. 그 중 사용하기 편하고 다양한 기능을 가진 플러그인이 Crayon Syntax Highlighter입니다. Crayon Syntax Highlighter는 꽤 오랫동안 업데이트가 되지 않고 있어서 ...

워드프레스 강좌 / 플러그인 / Rocket Font / 한글 글꼴 웹폰트로 설정하게 해주는 플러그인

워드프레스 강좌 / 플러그인 / Rocket Font / 한글 글꼴 웹폰트로 설정하게 해주는 플러그인

한글 글꼴 워드프레스 테마는 주로 영어권에서 개발합니다. 영어권이 아닌 곳에서 개발을 해도 영어 사용을 기준으로 개발합니다. 그래서 데모 사이트도 대부분 영어로 되어 있습니다. 여기서 문제가 발생합니다. 영어로 되어 있을 때는 아주 보기 좋은데, 한글로 바뀌면 이상해지는 경우가 많습니다. 멋진 디자인과 타이포그래피에 반해서 테마를 구입했는데, 한글을 사용하는 순간 기대했던 결과가 나오지 않는 ...