보통은 CSS 내에서 특이성(specificity)에 의존할 수 있습니다. CSS에 익숙하지 않다면, 이는 다음과 같은 의미로 요약할 수 있습니다: 동일한 요소를 대상으로 하는 여러 스타일 중 더 구체적인 스타일이 우선 적용됩니다.
<div class="custom-container"
<a class="custom-link">link here</a>
</div>
따라서 변경하려는 컴포넌트의 해당 요소(또는 부모 요소) 어딘가에 고유한 클래스가 있는지 확인해야 합니다. 예를 들어 다음과 같은 경우:
위 예시에서는 .custom-link를 사용할 수 있거나, 요소에 직접 클래스가 없다면 .custom-container a처럼 부모 요소를 활용할 수 있습니다. 컴포넌트가 원래 .custom-link로 스타일을 정의했다면, a.custom-link로 더 구체적으로 지정하여 오버라이드되도록 할 수 있습니다.
컴포넌트 어딘가에 고유한 클래스가 없다면 플러그인 아웃렛 컨테이너를 사용할 수도 있습니다. 커스터마이징에서 플러그인 아웃렛이 사용되면 컨테이너에 커스텀 클래스가 추가됩니다. 다시 링크 스타일링을 예로 들면, .above-site-header-outlet.brand-header a와 같이 보일 수 있으며, 여기서 "brand-header"는 컴포넌트에서 추가된 템플릿의 이름입니다.
최악의 경우, 원하는 것을 스타일링할 쉬운 방법을 찾을 수 없다면 해당 컴포넌트를 만든 사람에게 클래스를 추가해 달라고 요청할 수도 있습니다.
이 설명이 이해하기 어렵다면, 스타일링하려는 컴포넌트의 구체적인 예를 들어 주시면 도움이 될 것입니다.