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

워드프레스에 글을 작성할 때 보통은 비주얼 모드를 사용하지만, 텍스트 모드로 들어가서 코드를 직접 수정하는 경우도 많습니다. 그런데, 텍스트 모드에서 코드를 보면 흰색 바탕에 검정 글자여서 읽기가 쉽지 않습니다.

이 문제를 해결해주는 플러그인이 HTML Editor Syntax Highlighter입니다.

코딩 강좌 등 하이라이트 된 코드를 방문자에게 보여주고 싶은 것이라면 Enlighter 플러그인을 사용하세요.

플러그인을 설치하고 활성화한 후 텍스트 모드로 들어가면 하이라이트된 코드를 볼 수 있습니다.

설정 아이콘을 클릭하면...

코드를 보거나 편집할 때 도움이 되는 기능을 볼 수 있고, more를 클릭하면...

좀더 많은 설정을 볼 수 있습니다.

텍스트 모드를 애용한다면 아주 유용한 플러그인입니다.

같은 카테고리의 다른 글

워드프레스 강좌 / 플러그인 / DW Question & Answer / 질문과 답변 게시판 플러그인

워드프레스 강좌 / 플러그인 / DW Question & Answer / 질문과 답변 게시판 플러그인

게시판 형식은 여러 가지가 있습니다. 그 중 하나가 Q&A 형식의 게시판입니다. 질문을 남기면 답변을 달고, 질문자는 여러 답변에서 원다는 답을 채택하는 시스템입니다. Stack Overflow, 네이버 지식인과 비슷하다고 할 수 있습니다. 워드프레스에도 그런 형식의 게시판을 만들 수 있는 플러그인들이 있습니다. 그 중 하나가 DW Question & Answer입니다. 설치하고 사용하는 방법을 알아보겠습니다. 설치와 설정 워드프레스 ...

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

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

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

워드프레스 강좌 / 워드프레스, 테마, 플러그인 업데이트 하는 방법

워드프레스 강좌 / 워드프레스, 테마, 플러그인 업데이트 하는 방법

업데이트 워드프레스는 워드프레스 코어, 플러그인, 테마, 번역 네가지 범주로 업데이트 됩니다. 기능 추가/개선을 위한 업데이트라면 업데이트를 하지 않거나 미룰 수 있지만, 보안 관련 업데이트는 바로바로 해주는 것이 좋습니다. 업데이트는 워드프레스 관리자에서 할 수도 있고, FTP 등을 이용하여 파일 교체 방식으로 할 수도 있습니다. 워드프레스 관리자에서 하는 게 편하므로, 특별한 이유가 없다면 관리자 ...

워드프레스 강좌 / GS Logo Slider Lite / 파트너, 고객사 로고 슬라이더 만드는 플러그인

워드프레스 강좌 / GS Logo Slider Lite / 파트너, 고객사 로고 슬라이더 만드는 플러그인

기업 홈페이지에 가면 파트너 또는 고객사 로고가 가로 방향으로 흘러가는 것을 볼 수 있습니다. 이를 보통 로고 슬라이더라고 합니다. 로고 슬라이더는 직접 코딩하거나 공개된 오픈 소스를 이용하여 만들 수 있는데, 워드프레스라면 플러그인으로 쉽게 구현할 수 있습니다. 플러그인 추가 화면에서 logo slider로 검색하면 상당히 많은 플러그인이 나오는데, 사용법은 비슷합니다. 가장 먼저 나오는 ...

워드프레스 강좌 / 미디어 업로드 폴더 변경하는 방법

워드프레스 강좌 / 미디어 업로드 폴더 변경하는 방법

워드프레스에서 이미지나 파일 등을 업로드하면 /wp-content/uploads 폴더에 저장됩니다. 사이트를 방문했을 때 글에 있는 이미지의 경로만 조사해도 워드프레스로 만든 것이라는 것을 알 수 있습니다. 일반적으로는 그럴 필요가 없지만, 특별한 경우에는 미디어 업로드 폴더를 변경해야 할 때가 있습니다. 그 특별한 경우가 무엇인지는 떠오르는 게 없네요..^^ 방법은 여러 가지가 있는데, 코드를 건드릴 필요가 없는 방법을 ...

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

워드프레스 강좌