워드프레스를 운영하면서 GeneratePress를 많이 추천받으셨을 거에요. 저도 워드프레스는 제너레이트프레스를 쓰지만 무료로 사용하다보니 디자인에 한계가 있어 답답했답니다. 제가 이용하면서 정말 답답했던 무료 테마의 generatePress 썸네일 위치 조정하는 방법을 알려드릴게요.
메인화면에서 GeneratePress 썸네일 위치 조정하기
제너레이트프레스로 섬네일이 뜰 때 상단에 크게 뜨는 게 기본 모드였어요. 아래 사진에서 왼쪽에 있는것이 기본 모드 오른쪽에 있는것이 제가 원하는 모드였는데 Marketer테마로 변경하고 싶었어요. 아무리 서치해도 안나왔는데 드디어 찾아서 적용을 완료하고 기록하기 위해 포스팅합니다.
일단 섬네일을 변경하려면 해 야할 작업이 php코드 수정과 css수정입니다. 코드를 수정할 때는 반드시 백업을 하시고 진행하셔야 합니다. 그렇지 않으면 워드프레스코드가 꼬여서 저세상 갈 수도 있으니 코드는 항상 미리 저장해 두세요. 저도 미리 백업하고 메모장에 코드를 저장한 후 작업했습니다.
content.php 수정하기
코드를 수정하기 위해서는 외모-테마파일편집기로 들어가셔야 합니다. 타마파일에서 content.php로 들어갑니다. 코드들을 일단 메모장에 복사해주세요. ctrl+F를 눌러 </header>를 검색합니다. 그리고 그 아래 바로 아래의 코드를 넣어줍니다.
<div class ="entry-main"> 그리고 ctrl+F를 눌러 </div>를 찾습니다. 그 아래에 </div> 코드를 한번 더 넣어주세요. 그럼 아래와 같은 코드가 될 거예요. div코드를 넣고 닫아준 것까지 하시면 php코드 수정은 끝납니다.
추가 CSS 수정하기
이번에는 css를 수정할거예요. 아래 코드를 복사해서 추가 css에 넣어주시면 끝! 정말 간단하죠?
/* list */
.entry-main{display:flex;column-gap:20px;margin:2rem 2rem 0 0}
.post-image{flex:0 0 auto;width:33.33333333%}
.entry-summary{flex:0 0 auto;width:66.66666667%;margin-top:0!important;font-size:15px}
코드복사가 안되어 불편하신 분들을 위해 메모장에 코드를 넣어놨으니 필요하신 분들은 다운받아서 넣어보세요.^^
아래 자료를 찾았던 링크 알려드릴게요. 좋은 내용이 많아 저도 자주 들어가는 곳입니다.
작성자님 감사합니다!