BookClub에 없는(?) 이전글 다음글 플러그인 고정으로 삽입하기입니다. 티스토리 스킨을 만지작거리다 보니 가장 고쳐쓰기 편한 것인 북클럽 테마였습니다. 그런데 가만히 보니 이전글 다음글 관련한 플러그인이 없는 것 같았습니다. 어쩌면 있는데 제가 못 찾는 것일 수도 있습니다.
그래서 whatever 테마에서 가져와서 넣었습니다. 현재글(지금 읽고 있는 글)은 표현할 필요가 없을 듯하여 display: none;를 style에 추가하였습니다.
<!-- 이전글/다음글 -->
<div class="article-page">
<p class="title-footer">'블로그 Tips'의 다른글</p>
<ul>
<li>
<s_article_prev>
<a href=""><span>이전글</span><strong></strong></a>
</s_article_prev>
</li>
<li style="display: none;"><span>현재글</span><strong>BookClub에 없는(?) 이전글 다음글 플러그인 고정으로 삽입하기</strong></li>
<li>
<s_article_next>
<a href=""><span>다음글</span><strong></strong></a>
</s_article_next>
</li>
</ul>
</div>
폰트 크기가 엉성해서 css도 일부 추가하였습니다. 뭔가 중복으로 조잡스럽게 들어가는 느낌이지만 어깨너머로 배운 짭실력이라 이렇게 밖에는 도움을 드리지 못해 살짝 죄송합니다.
/* article-page - 상세페이지 이전다음글 */
.article-page {
padding: 20px 20px 0px 20px;
border-top: 1px solid #e8e8e8;
padding-bottom: 0px !important;
margin-bottom: 0px;
}
.article-page .title-footer {
margin-bottom: 15px;
}
.article-page ul {
list-style: none;
margin: 0 0 45px 0;
padding: 0;
}
.article-page ul li {
position: relative;
margin-bottom: 7px;
padding: 0;
font-size: 14px; /* 이전글다음글 폰트 크기 */
}
.article-page ul li span {
padding-right: 10px;
}
.article-page ul li a {
color: #ff5a00;
text-decoration: none;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.article-page ul li a:hover {
text-decoration: underline;
}
정확히 어디서부터 어디까지가 필요한 부분인지 몰라서 몽땅 넣었습니다. 혹시 아시는 분 있으시면 댓글로 알려주시면 큰 도움이 될 것 같습니다.
참고로 관련글 더보기 테이블의 제목이 길어서 두줄로 넘어가는 경우에는 글자수를 줄여주는 소스를 사용하면 됩니다. 제목에서도 사용한 것인데, 따로 게시물을 만들어서 포스팅하기에는 내용이 너무 적어서 한꺼번에 공개합니다.
#content .another_category th {
padding: 2px 0 !important;
font-size: 0.875rem !important;
/* 글자수 길이 조절해서 숨기기 시작 */
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
/* 글자수 길이 조절해서 숨기기 끝 */
}
반응형
댓글