버튼 색 하나를 바꾸는 방법이 워드프레스에는 최소 세 가지 있습니다. 테마 설정에서 고르기, 커스터마이저의 “추가 CSS” 에 규칙을 쓰기, 자식 테마의 CSS 파일에 쓰기. 셋 다 화면은 똑같이 바뀝니다. 다른 것은 그 결정이 어디에 저장되는가이고, 그것이 6개월 뒤의 비용을 정합니다.
두 가지 저장소
테마 설정과 추가 CSS 는 데이터베이스에 저장됩니다. 자식 테마의 CSS 파일은 파일로 저장됩니다. 이 차이가 실무에서 만드는 결과는 생각보다 큽니다.
특히 “추가 CSS” 패널을 임시 메모장처럼 쓰는 습관이 문제를 만듭니다. 처음에는 규칙 두어 줄이지만, 급할 때마다 한 줄씩 늘어나 200줄이 됩니다. 그 200줄은 어떤 파일에도 없고, 새로 합류한 사람은 CSS 파일을 아무리 뒤져도 원인을 못 찾습니다. 화면과 코드가 어긋난 상태이고, 이런 상태에서는 아무도 자신 있게 고치지 못합니다.
판단 기준 — 다음 사람이 찾는 자리
세 저장소를 이렇게 나누면 대부분의 경우가 정리됩니다.
테마가 전용 설정을 제공하는 항목은 그 설정을 씁니다. 로고나 기본 색처럼 테마가 여러 곳에서 참조하는 값은, CSS 로 덮어쓰면 놓치는 자리가 반드시 생깁니다 — 예를 들어 메일 템플릿이나 관리자 미리보기처럼 눈에 잘 안 띄는 화면입니다.
반대로 설정이 없는 디자인 결정은 전부 자식 테마 CSS 로 내려보냅니다. 여백 척도, 제목 크기 단계, 카드 모서리 반경 같은 것들입니다. 이런 값은 한 파일에 모여 있어야 나중에 브랜드가 바뀔 때 한 자리만 고치면 됩니다.
이미 쌓여 있다면
추가 CSS 에 이미 긴 규칙이 쌓여 있다면 옮기는 작업 자체는 간단합니다. 전부 복사해 자식 테마의 CSS 파일 끝에 붙이고, 화면을 비교한 뒤 원래 자리를 비웁니다. 한 번에 옮기고 즉시 확인하는 것이 중요합니다 — 절반만 옮기면 두 곳에 같은 규칙이 남아 나중에 어느 쪽이 이기는지 헷갈리게 됩니다.
옮기면서 얻는 부수 효과가 하나 더 있습니다. 200줄을 한 화면에서 읽으면 같은 값을 다르게 쓴 곳이 눈에 들어옵니다. 그것이 다음 연재에서 다룰 디자인 토큰의 출발점입니다.
구조를 정리하는 관점의 글은 테마 · 플러그인 아카이브에 있고, 정리와 업그레이드를 한 번에 맡기고 싶다면 최적화 지원 사업이 그 작업을 포함합니다.
다음 회차
CSS 로 안 되는 변경도 있습니다. 마크업 자체를 바꿔야 하는 경우인데, 그때 쓰는 것이 템플릿 오버라이드입니다. 다음 회차에서 그 규칙과 대가를 다룹니다.