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

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

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

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

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

바로 해결됩니다.

같은 카테고리의 다른 글

워드프레스 / 우커머스 / 상점 페이지, 카테고리 페이지 등에서 진열되는 상품 수 설정하는 방법

워드프레스 / 우커머스 / 상점 페이지, 카테고리 페이지 등에서 진열되는 상품 수 설정하는 방법

기본적인 설정 방법 를 변경하면 진열되는 상품의 개수도 바뀝니다. 만약 이 방법이 통하지 않거나, 포스트와 다른 개수로 정하고 싶다면 아래의 방법을 이용합니다. 우커머스에서 제공하는 코드 우커머스에서는 아래의 코드를 functions.php에 추가하면 된다고 합니다. 15를 적절히 수정합니다. function new_loop_shop_per_page( $cols ) { $cols = 15; return $cols; } add_filter( 'loop_shop_per_page', ...

워드프레스 강좌 / Shortcode로 애드센스 광고 본문에 삽입하는 방법

워드프레스로 만든 사이트에 애드센스 광고를 다는 방법은 여러 가지입니다. 사이드바에 넣고 싶다면 위젯 설정에서 사용자 정의 HTML을 이용하면 됩니다. 본문 상단이나 하단에 넣고 싶다면 플러그인을 사용하는 게 편합니다. 만약 본문 중간 원하는 위치에 광고를 넣고 싶다면 어떻게 할까요? 그 때는 쇼트코드(Shortcode)를 이용하는 게 편합니다. 테마의 functions.php에 다음 코드를 추가합니다. 애드센스 광고 ...

워드프레스 강좌 / 플러그인 / HTML Editor Syntax Highlighter / 에디터 텍스트 모드 코드 하이라이트 플러그인

워드프레스 강좌 / 플러그인 / HTML Editor Syntax Highlighter / 에디터 텍스트 모드 코드 하이라이트 플러그인

워드프레스에 글을 작성할 때 보통은 비주얼 모드를 사용하지만, 텍스트 모드로 들어가서 코드를 직접 수정하는 경우도 많습니다. 그런데, 텍스트 모드에서 코드를 보면 흰색 바탕에 검정 글자여서 읽기가 쉽지 않습니다. 이 문제를 해결해주는 플러그인이 HTML Editor Syntax Highlighter입니다. 코딩 강좌 등 하이라이트 된 코드를 방문자에게 보여주고 싶은 것이라면 Enlighter 플러그인을 사용하세요. 플러그인을 설치하고 활성화한 후 텍스트 ...

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

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

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

워드프레스 강좌 / 플러그인 / Search Meter / 검색어 키워드 통계 플러그인

워드프레스 강좌 / 플러그인 / Search Meter / 검색어 키워드 통계 플러그인

Search Meter 워드프레스는 검색 기능을 갖고 있습니다. 키워드를 입력하면 해당 키워드를 가진 콘텐츠를 보여줍니다. 하지만, 그 키워드가 무엇인지, 얼마나 검색했는지 관리자에게 알려주는 기능은 없습니다. 방문자가 어떤 키워드로 검색했는지 알고 싶다면 플러그인의 도움을 받아야 합니다. 대표적인 플러그인은 Search Meter입니다. WordPress.ORG에서 공유되는 플러그인이므로 워드프레스 관리자에서 설치할 수 있습니다. 설치하고 활성화합니다. 키워드 보기 에서 키워드를 볼 ...

워드프레스 강좌 / 데모 콘텐츠 추가하는 방법

워드프레스 강좌 / 데모 콘텐츠 추가하는 방법

워드프레스를 공부하거나 테마를 만들 때, 빈 워드프레스 사이트보다는 콘텐츠가 어느 정도 있는 것이 편합니다. 테스트를 위한 콘텐츠를 만드는 방법은 몇 가지가 있는데, 그 중 한가지 방법은 WordPress.ORG에 있는 Theme Unit Test를 이용하는 것입니다. 이를 이용하여 콘텐츠를 추가하는 방법을 알아보겠습니다. Theme Unit Test 다운로드 Theme Unit Test 사이트에 접속합니다. 화살표가 가리키는 링크를 클릭하여 XML ...

워드프레스 강좌 / 플러그인 / Google Site Kit by Google / 구글 서비스 통계 보여주는 플러그인

워드프레스 강좌 / 플러그인 / Google Site Kit by Google / 구글 서비스 통계 보여주는 플러그인

사이트나 블로그를 구글 검색 엔진에 등록하려면 Search Console을 이용합니다. 접속 통계는 Google Analytics를 이용하죠. 수익을 얻고 싶다면 구글 애드센스 광고를 게재합니다. 각 서비스의 분석 결과를 보려면 각 사이트에 접속을 해야 하는데, 꽤 귀찮은 작업니다. 만약 워드프레스로 사이트나 블로그를 만들었다면 Google Site Kit by Google 플러그인을 설치하세요. 워드프레스 관리자에서 주요 분석 자료를 ...

워드프레스 강좌 / 플러그인 / List Category Posts / 다양하게 글 목록 출력시켜주는 플러그인

워드프레스 강좌 / 플러그인 / List Category Posts / 다양하게 글 목록 출력시켜주는 플러그인

워드프레스 기본 위젯에 최근 글 위젯이 있습니다. 최신 글 목록을 보여주는 위젯으로 제목 또는 제목과 날짜를 출력해줍니다. 워낙 단순한 기능의 위젯이라 불편한 점이 좀 있습니다. 요약글을 보여주지도 못하고, 썸네일을 출력할 수도 없습니다. 글쓴이를 보여주거나 특정 카테고리의 글만 출력하지도 못합니다. 이를 해결해주는 플러그인 중의 하나가 List category posts입니다. 원하는 카테고리의 글을 원하는 양식으로 ...

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

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

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

워드프레스 / 우커머스 / 잡다한 정보들

상품 페이지 라이트박스 제거 functions.php에 다음 코드 추가 add_filter( 'woocommerce_single_product_image_thumbnail_html', 'wc_remove_link_on_thumbnails' ); function wc_remove_link_on_thumbnails( $html ) { return strip_tags( $html, '<img>' ); } 우커머스 스타일 제거 functions.php에 다음 코드 추가 add_filter( 'woocommerce_enqueue_styles', '__return_empty_array' ); 관련 상품 제거 CSS에 다음 코드 추가 .single-product .related.products { display: none; } Database Pending 작업 실행하는 방법 예약된 데이터베이스 작업이 진행되지 않는다면 강제로 실행할 수 있습니다. ...