워드프레스 테마 수정 방법, Custom CSS를 활용해라!

오늘과 내일 이틀에 거쳐 워드프레스 테마 수정 방법에 대한 이야기를 해 볼까 합니다.

오늘은 그 첫번째로 CSS를 추가하고 편집하는 방법에 대해 알아볼 텐데요.. 워드프레스 테마의 경우 대부분 영문에 최적화 되어 배포가 되는 단점이 있습니다.

워드프레스가 막강한 장점들을 가지고 있지만, 실제 사용하면서 이런 부분이 현실적으로 가장 불편한 부분이기도 합니다.

외국은..

우리와는 다소 다른 웹 환경을 가지고 있고, 또한 선호하는 레이아웃이 좀 다릅니다. 우리에게는 너무나도 익숙한 댓글창도 통상, '토론' 창으로 만드는 경우가 많고 카테고리도 없는 경우가 많죠..

여기에, 폰트를 비롯한 여러가지 스타일들이 우리와는 다소 안맞는 경우들이 존재를 합니다. 따라서, 워드프레스 테마를 처음 설치하게 되면 가장 먼저 손봐야 할 부분이 바로 이러한 CSS이기도 합니다.

모든 워드프레스 테마는 테마 내에 CSS파일이 존재합니다. 경로는 아래와 같습니다.

wp-content/themes/해당테마 폴더의 style.css가 바로 CSS파일 입니다. CSS를 수정하려면 바로 이 파일을 수정하면 되는데요.. 전통적인 방법으로 해당 파일을 내려받은 다음에 수정해도 되지만 워드프레스에서는 관리자 화면에서 해당 파일을 수정할 수 있는 툴을 제공합니다.

1. 관리자 화면의 외모.

2. 테마 편집기.

3. 해당 스타일 시트를 수정한 다음에 저장하시면 style.css 파일이 바로 수정이 됩니다.

다만, 이러한 방법은 아래에서 이야기 하겠지만 권장하지 않습니다. 이는 테마 파일을 직접 수정하는 것이기 때문이죠.. 그 대신에 워드프레스에서 제공하는 사용자정의 CSS(Custom CSS) 기능을 활용해 보시길 권해 드립니다.

1. 경로는 외모 > CSS편집.

2. 신규로 CSS를 넣으시면 되겠습니다.

3. 이 방법도 나쁘지는 않으나, 문제는 테마가 업데이트 될 때마다 초기화 된다는 점입니다. 따라서, 테마 업데이트시 항상 백업한 다음에 다시 적용해야 하는.. 크지는 않지만, 약간의 불편함은 있습니다.

가장 좋은 방법은? 플러그인을 활용하는 방법입니다. 플러그인들 중에서는 이러한 Custom CSS 기능을 제공하는 플러그인들도 다수 존재를 합니다. 저같은 경우에는 Shortcodes 플러그인을 사용하기는 하지만, 꼭 이 플러그인을 사용할 필요는 없고, CSS만 적용할 것이라면 Simple Custom CSS 와 같은 가벼운 플러그인을 사용하는 것도 좋습니다.

Shortcodes 플러그인은 개인적으로 숏코드를 좀더 다양하게 사용하기 위한 목적이 더 크지 사용자정의 CSS를 사용하기 위한 것은 아니기도 합니다.

오늘은, 워드프레스 테마 수정 방법 첫번째로 CSS를 수정하는 방법에 대해 알아봤는데요..

테마를 직접 손보는 것은 아주 불가피한 경우가 아니라면? 권장하지 않습니다. 이는, 테마가 업데이트 되면 바로 초기화 되기 때문입니다. 오랜시간을 투자해서 미묘하게 워드프레스 테마를 수정해 놨는데 이게 초기화 되면 아주 짜증 지대로죠.. -_-

개인적으로 그래서.. 초보시절에는 몇번을 다시 수정하고 적용한 적이 있었네요.. 플러그인을 사용하면 될 것을 말이죠.. ;; 플러그인을 사용할 경우에는 테마와는 관계없이 설정이 그대로 유지가 되기 때문에 테마에 맞춰 추가로 약간의 손을 봐 주면 되고 코드는 그대로 남습니다.

오늘 CSS 수정 방법에 이어 내일은 테마 자체에 대한 수정 방법에 대한 이야기를 추가로 해 볼까 합니다. 테마 수정은 좀 조심스러운 부분이 있기는 하지만, 소위.. 하위테마(또는 자식테마)를 활용하시면 좀더 효과적으로 테마수정을 하실 수 있습니다.