내 워드프레스에 방문자 수를 늘리기 위한 방법 중 하나는 내부링크를 사용하는 것입니다. 즉 워드프레스 내에 있는 여러 글을 링크로 연결하면 특정 글로 유입된 방문자가 다른 글을 보게 될 가능성이 커지죠. 그렇다고 아무 글이나 링크로 연결할 수 없기 때문에 다른 글에 대한 링크를 생성하는 좋은 방법 중 하나는 관련 있는 글에 대한 링크를 만드는 것입니다. 물론 관련 글 목록을 작성하는 여러 방법이 있지만 제가 사용한 방법도 괜찮은것 같아서 공유 드립니다.
개요
저는 코드를 재활용하는 방법을 사용해서 관련 글 목록을 입력 했습니다. 아래 이미지를 한번 보시죠.
만약 A, B, C 3개의 글 하단에 동일한 관련 글 목록을 넣는다고 생각했을 때 일반적으론 똑같은 코드가 A, B, C 하단에 들어가겠죠. 그런데 만약 관련 글의 스타일을 변경한다거나 특정 글의 주소가 바뀌면 어떻게 해야 할까요? A, B, C 세 개의 글을 모두 수정해야 합니다. 지금은 3개의 글만 예시로 들었지만 만약 10개의 글이 묶여있는 관련 글 목록이면 변경이 쉽지 않습니다.
이런 문제 때문에 특정 주제에 대한 관련 글 목록은 한번만 작성하고, 그렇게 작성한 코드를 A, B, C 하단에 중복해서 적용하면 특정 내용이 변경됐을 때 한번만 수정해도 관련 내용을 모든 글에서 변경할 수 있습니다. 이것을 가능하게 하는 플러그인이 정말 많이 있는데, 저는 WPCode 라는 플러그인을 사용했고, 이 글에서는 WPCode의 사용법에 대해 설명드리진 않습니다. 설치와 사용법에 대한 설명은 여기 글을 참고해주세요.
스타일 시트 작성
공통 코드를 작성해서 그 코드를 여러 글에 똑같이 적용한다고 말씀드렸죠. 그런데 그 공통 코드도 디자인 적인 부분과 디자인 외적인 부분을 나눠서 관리합니다. 디자인 적인 부분은 스타일 시트라고 이야기 하는데요, 저의 경우 아래와 같이 스타일 시트를 작성 했습니다.
div > ul {
margin-block-start: 14px !important;
}
li > a {
font-size: 0.9rem;
text-decoration: none;
}
p.related-article {
color: #a31a04;
margin-bottom: 0px !important;
font-size: 18px;
font-weight: bold;
}위에 작성한 스타일 시트는 제가 사용한 예 입니다. 정답이 있는건 아니고 본인의 활용에 맞게 수정해서 사용하시면 됩니다. 사실 관련글 목록에 대한 스타일 시트를 꼭 작성할 필요는 없지만 이렇게 따로 분리해서 작성해두면 나중에 일괄적으로 디자인 변경할 때 좀 더 편히 작업할 수 있습니다.
관련 글 코드 입력
<p class="related-article">관련 글</p>
<ul>
<li><a href="주소1">제목1</a></li>
<li><a href="주소2">제목2</a></li>
<li><a href="주소3">제목3</a></li>
</ul>디자인 외적인 부분은 위와 같이 작성 했습니다. 관련글 이라는 타이틀 아래에 <ul> 태그를 이용해서 관련글 목록을 생성 했습니다. 코드에 보면 related-article 이라는 클래스가 있는데, 이 클래스는 조금 전에 스타일 시트에서 작성한 스타일 클래스 입니다.
관련 글 목록 삽입
WPCode 에서 작성한 관련 글 목록을 삽입하는 방법이 몇 가지 있는데요, 그 중 위에 자료에서 보이는 것 처럼 Shortcode를 이용하는 방법이 있습니다. Shortcode를 선택하면 [ wpcode id=”1336″ ] 같은 코드가 생성되고요, 이 코드를 글의 원하는 위치에 붙여넣기 하면 방금 작성한 글 목록이 그 자리에 출력됩니다. WPCode에서 특정 글이나 코드를 작성한 이후에는 상태를 Active로 바꾸고 Update 버튼을 눌러주는거 잊지 마세요.
맺음말
글을 작성하고 보니 HTML이나 CSS 그리고 WPCode 플러그인에 대한 이해가 조금은 있어야 글을 이해하기 쉬워보입니다. 물론 모른다고 해서 못하는건 아니지만 저의 표현력의 한계 때문에 상세히 설명드리지 못한 부분이 조금은 어렵게 다가오지 않을까 라는 걱정이 듭니다. 혹시 설명드린 내용에 대해 추가 설명이 필요한 분은 언제든지 댓글로 알려주세요. 최대한 자세히 설명 드릴게요.
- 워드프레스 플러그인 WPcode 활용방법
- 워드프레스에서 표(테이블) 예쁘게 꾸미기
- 워드프레스 글 하단에 관련 글 목록 입력하기
- Ad Inserter 이용해서 애드센스 배치하기
- 애드센스 수동 배치할 때 주의할 점 – 중복코드 제외하기