친효애드온 : 관련글 모듈 (마크3)
지난번 친효애드온 관련글 마크2를 만들면서 영감을 얻었습니다. 생각난김에 바로 코딩을 시작했고 그 결과 훌륭하게 완성시켰습니다. 본문 끝 부분에 관련글을 넣을 때 사용하시면 되는 모듈 입니다. 친효스킨과 잘 어울립니다. 뿐만 아니라 타 스킨에서도 잘 적용이 될 것입니다. 현재 이 글의 맨 아래에 보시면 관련글이 있는데 해당 스타일대로 출력 됩니다. 참고하시기 바랍니다.
CSS 세팅
먼저 스타일부터 정의합니다. 자신의 스킨 편집모드에 있는 CSS 항목으로 들어가셔서 아래의 첨부파일안의 모든 내용을 빈 공간을 확보하여 그대로 붙여넣기를 해줍니다.
어디에 붙여넣기를 하는지 자세히 안내해 드리겠습니다.
이렇게 빈 공간을 엔터로 확보하신다음 저곳에 붙여넣기 하시면 됩니다. 위의 스크린샷 이미지는 예시 입니다. 사용하시는 스킨에 따라 다를 수 있습니다. 중요한건 중괄호 {} 의 안쪽에 공간을 확보해서는 안 됩니다. 중괄호 밖에서 빈 공간을 만드셔야 합니다. 이렇게 하시면 CSS 세팅은 모두 끝납니다. 간단하지요?
HTML 사용 방법
HTML 부분은 따로 세팅은 하는게 없습니다. 단지 관련글을 첨부할 때 HTML 편집 모드에서 수동으로 글을 수정해줘야 합니다. 어떻게 수정하는지 안내해 드리겠습니다. 여기에서는 새로운 글쓰기 에디터를 기준으로 안내합니다.
먼저 이전 글 넣기 기능으로 지금까지 썼던 글 중에서 본문과 관련 있는 글을 넣습니다.
저는 현재 이렇게 두 개의 글을 관련글로 넣으려고 합니다. 그러면 현재 글쓰기 에디터에서는 이렇게 보여지게 됩니다. 이제 HTML 편집 모드로 들어갑니다.
방금 이전 글 넣기 기능으로 넣은 글의 태그가 보입니다. 정확히 빨간색으로 표시한 부분의 태그들을 다음의 태그로 감싸주시면 됩니다.
이렇게 말입니다.
<div class="rgyTextBox3">
이전 글 넣기 글 목록
</div>
결국 이런 형태가 완성 됩니다. 어렵지 않습니다. 그러면 직접 테스트를 해보시기를 바랍니다. 성공을 응원하겠습니다. 끝.
"친절한효자손 취미생활" 을 검색!
