친효스킨의 본문 끝자락에 들어가는 관련글(참고글) 모듈 입니다. 벌써 마크5로서 다섯번째 버전입니다. 기본 스타일은 모두 같지만 마우스를 올리면 나타나는 CSS 애니메이션 효과들이 모듈마다 다릅니다. 본인이 원하는 모듈을 골라서 사용하면 됩니다. 먼저 관련글 모듈을 적용하는 방법에 대해서 숙지하시기 바랍니다. 본문에서는 CSS 파일과 간단한 설명만 언급하고 있습니다.
그리고 아래는 예시 입니다. 마우스를 올려 보시기 바랍니다. 스마트폰에서는 아마 확인이 잘 어려울 겁니다.
짧은 글의 제목이든, 아주 긴 글의 제목이든 상관 없이 애니메이션이 동작 됨을 알 수 있습니다. 친효스킨에 맞춰서 마찬가지로 모듈도 반응형으로 제작되었습니다. 따라서 다른 스킨에서도 사용 가능합니다.
CSS 세팅하기
아래의 파일을 받아서 스킨편집 > CSS 부분에 공백란을 만들고 붙여넣기를 해주시면 됩니다.
친효애드온 - 관련글 마크5 CSS.txt
HTML 사용방법
이전 글 넣기로 글을 불러와도 되고 수동으로 링크를 만들어도 상관 없습니다. 티스토리 글쓰기에서 HTML 모드로 전환 후 아래와 같이 div 로 수동으로 감싸주기만 하면 됩니다. 관련글 마크5 모듈은 클래스명이 rgyTextBox5 입니다.
<div class="rgyTextBox5">
<p><a href="URL주소">글 제목</a></p>
<p><a href="URL주소">글 제목</a></p>
</div>
이렇게 파란색 부분처럼 감싸주시면 됩니다. 본문 아래의 관련글에는 마크5 버전의 관련글 모듈이 적용되어 있습니다. 한 번 마우스를 올려보세요. 그러면 유용하게 사용해 주시기 바랍니다. 끝.