1976s

이 블로그는 웹 개발, 프로그래밍, IT 활용법을 다루며, 실용적인 팁과 정보를 제공합니다.

# Side Menu
  • recentPost

  • popularPost

  • Archive

  • recentComment

기억의문서/작업물

워드프레스 무료 테마 GeneratePress 개인 커스터마이징 하기 - 글(본문) 부분

2023. 6. 29., 1976s

이번이 마지막 부분이 되겠습니다. 이번에는 크게 변경되는 부분은 없고 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부분

워드프레스 무료 테마 GeneratePress 개인 커스터마이징 하기 - 사이드바 부분

워드프레스 무료 테마 GeneratePress 개인 커스터마이징 하기 - list 부분

반응형

What are you looking for?

Tag List
Total categories: | Searchable posts: