1976s
이 블로그는 웹 개발, 프로그래밍, IT 활용법을 다루며, 실용적인 팁과 정보를 제공합니다.
# Side Menu
-
recentPost
-
popularPost
-
Archive
-
recentComment
기억의문서/작업물
워드프레스 무료 테마 GeneratePress 개인 커스터마이징 하기 - 글(본문) 부분
2023. 6. 29.,
이번이 마지막 부분이 되겠습니다. 이번에는 크게 변경되는 부분은 없고 CSS만 추가하시면 될것 같습니다.
3번째 list 부분에서 추가
리스트의 카테고리와 댓글부분을 밑으로 되어 있는 것이 마음에 들지 않아
body.home footer.entry-meta,
body.category footer.entry-meta{margin-top:3em;display:flex}
body.home footer .cat-links,
body.home footer .tags-links,
body.category footer .cat-links,
body.category footer .tags-links{margin-right:1rem}
이 부분의 css를 추가 했습니다.
자 이제 글 본문에 들어 가죠. 사실 글 본문에는 크게 변겨이 없고 글 하단에 이전글과 다음글 부분을 변경했습니다.
이전글,다음글
기존의 이전글,다음글 입니다. 처음에는 있는 줄도 모르고 있었네요. '<', '>' 만 없으면 그냥 글로만 보여 집니다. 이 부분을
/* main */
.site-main .post-navigation{display:flex;margin-top:3rem;font-size:22px;gap:20px;border-top:1px dotted #ccc;padding-top:2rem}
.site-main .post-navigation .nav-previous,.site-main .post-navigation .nav-next{display: flex;flex-direction:column;}
.site-main .post-navigation .nav-previous:before,.site-main .post-navigation .nav-next:before{font-size:14px;font-weight:600;color:var(--contrast);text-transform:uppercase;font-family:'Poppins',sans-serif;opacity:.4}
.site-main .post-navigation .nav-previous:before{content:'< Previous';}
.site-main .post-navigation .nav-next{text-align:right}
.site-main .post-navigation .nav-next:before{content:'Next >';}
.site-main .post-navigation .gp-icon{display:none;}
.page-header-image-single{display:none}
@media (max-width:768px){
.site-main .post-navigation{flex-direction: column;}
.site-main .post-navigation a:hover{font-weight:400}
}
위 코드를 넣으면
이렇게 변경 됩니다.
마치며
나머지는 글자 크기 변경 등이라 쉽게 여기까지 할수 있으시면 쉬울것 같습니다.
관련글
워드프레스 무료 테마 GeneratePress 개인 커스터마이징 하기 - font부분
반응형