티스토리 꾸미기, 링크 포스트가드 제목 2줄로 변경하는 방법 (feat.라꼬스킨)

오늘은 외부링크든 내부링크든 포스팅에 추가하실 때
제목이 길어서 잘리는 부분을 해결하는 방법을 알려드리려고 합니다.
별로 어렵지 않으니 차근히 따라와 주세요~

 

티스토리 링크 포스트가드 제목 2줄로 변경하는 방법

 

티스토리에서 링크를 넣고 엔터를 치면 저렇게 포스트 가드가 생성이 되는데요.
제목이 길면 잘려서 보이지 않죠. 그래서 위와 같이 2줄로 제목이 노출되게 바꿔보겠습니다.

 

 

모바일 버전도 제목이 2줄로 보이는 게 훨씬 괜찮아 보이죠?

참고로 제가 사용하는 라꼬스킨 CSS 편집이니
다른 스킨을 사용하시는 분은 수정이 다를 수 있는 부분 참고해서 봐주세요.

 

그럼 이제 수정을 시작해 볼게요.

 

1. 포스트가드 여백 줄이기

제목을 두줄로 바꾸기에 앞서 제목 위의 여백을 줄여줘야 합니다.
안 그러면 글자가 중앙에 오지 않아요.

 

 

1. 블로그 설정에서 스킨 편집 클릭

 

 

2. CSS 클릭

3. CSS 창에서 Ctrl+F 하여 "figure[data-ke-type" 찾기

4. 검색된 21개 중 첫 번째 부분에서 제가 밑줄로 표시한 부분을 찾아주세요.

5. padding: 33px 부분의, "33"을 "20"으로 수정

6. 적용 클릭

 

잘 되셨다면 이제 제목을 2줄로 바꿔주도록 할게요.

 

2. 포스트가드 제목 2줄로 바꾸기

 

1. CSS 창에서 Ctrl+F로 "p.og-title" 찾기

2. 검색된 2개 중에 두 번째 부분을 수정할 거예요.

3. 밑줄 친 부분을 찾아주세요.

 

 

4. 제가 밑줄 친 부분 뒤에 "margin: 0px; overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;line-height: 1.2em; white-space: normal; max-height: 55px;"를 추가해 줍니다.

5. 적용 클릭

 

추가할 텍스트가 너무 길어서 아래 텍스트 파일로 넣어놓았습니다.
찾으실 텍스트도 함께 적어놓았으니 필요하신 분은 사용해 주세요.

 

티스토리-링크-포스트가드-제목-2줄로-수정-라꼬스킨.txt

0.00MB

 

생각보다 어렵지 않게 바꿀 수 있으니 차근히 따라 해 보시기 바랍니다.

포스트가드 제목이 안 보이면 어떤 내용인지 안 보여 답답할 수 있기 때문에
웬만하면 다 보이게 수정하는 게 방문자분들에게 도움이 되는 부분이라고 생각합니다.
그럼 다음에도 유용한 정보로 찾아뵐게요. 감사합니다.

 

 

티스토리 블로그 라꼬 스킨 PC 모바일 뷰, 글자 높이 간격(본문 문단) 수정하기

초보 블로거 멘탈이 흔들리는 이유, 과정을 즐길 수 있는 사람인가?

블로그 포스팅 가독성 높이는 법 5가지, 잘 읽히는 글쓰기가 수익을 높인다

블로그 부업 강의 내돈내산 후기, 후회되는 점 그리고 얻은 것들