블로그 글을 작성하다 보면 내용에 따라 적절한 외부 링크를 첨부해야 할 때가 있다. 링크를 첨부하면 방문자는 관련된 더 많은 정보를 볼 수 있어서 오리지널 본문 글 내용도 신뢰를 얻고 SEO 평가도 높이는 데 도움 되는 면이 있다.
워드프레스 본문에 링크 넣는 법
1. 본문 ‘Type / to choose a block or’ 부분에 복사한 RUL 붙여 넣기 – Embed URL 창이 나오면 아래 ‘Covert to link’ 버튼 클릭 – URL 생성 (구텐베르크)
2. 에디터 위 링크 아이콘 클릭 – URL 붙여넣기 – URL 생성 (클래식 에디터)
3. 대체 문구가 있을 때 본문에 입력 (바로가기 등) – 링크 아이콘 클릭 후 URL 붙여 넣기 – URL 생성 (구텐베르크, 클래식 공통)

워드프레스를 처음 시작할 때 적응이 되지 않는 부분이 있다면 본문, 태그, 사이드바 모든 클릭 가능한 링크 요소가 모두 색깔이 똑같이 지정되는 점이다.
링크는 색깔이 있어야 방문자 눈에 띄는 건 맞지만, 사이드바 외 나머지 요소 색깔이 과도하다고 느낀다면 간단한 설정을 통해 바꿀 수 있다.
* GeneratePress 테마 프리미엄 버전에서 적용될 수 있습니다.

먼저 워드프레스 대시보드 – Customize – Colors로 오면 블로그 내 모든 요소의 색깔을 편집할 수 있다.

– 설정 창 위쪽 Global Colors에서 마지막 아이콘(accent) : 블로그 모든 클릭 요소 색깔
– Body 목록의 Link 첫 번째 아이콘 (Initial Color) : Body 영역의 모든 클릭 요소 색깔
– Body 목록의 Link 두 번째 아이콘 (Hover Color) : 마우스를 가져갈 때 나오는 색깔
Global / Initial 아이콘 어느 쪽이든 색깔을 바꾸면 본문(Body) 영역 링크에 적용된다.

위처럼 색깔 변경은 잘 적용되는데 본문 링크에만 색깔을 주고, 사이드바는 검정색으로 바꾸려면 다른 목록 설정이 필요하다.

왼쪽 설정 창 메뉴 중 Content – Link 색을 변경하면 본문(Content) 영역의 링크 색상을 변경할 수 있는데 사이드바 링크 색깔도 변경해 보자.

설정 창 왼쪽의 Sidebar Widgets – Link 색깔을 설정하면 사이드바 색깔이 변경된다. 예시로 첫 번째 Initial 아이콘 색은 검정으로, Hover 색은 파란색으로 설정했는데 잘 적용된 모습이다.
단, 사이드바 아이템이 widget 요소로 만든 경우 위처럼 색깔을 바꿀 수 있는데, 만약 사이드바를 Element 요소로 만들었다면 Element 편집 화면에서 각 요소 클릭 후 Block 탭에서 바꾸면 된다. (아래 사진과 같음)

필요한 블록 요소를 선택한 다음 Block 탭 – Colors – Link 색깔을 같은 방식으로 변경하면 쉽다.
참고로 위는 Element Query Loop로 만든 관련 글 목록인데, Customize 설정 외 다른 색을 지정하려면 개별 Element 요소 색을 설정하면 된다.
관련 글
워드프레스 위젯 사이드바 설정 방법
Query Loop로 Post Grid 관련 글 목록 만드는 방법
워드프레스 본문 페이지 링크 글자 highlight 효과 적용 방법