티스토리 #1 하단 썸네일 만들기

티스토리 #1 하든 썸네일 만들기를 알아보도록 하겠습니다. 티스토리 #1 스킨을 사용하시는 분들 중 밑에 글 하단에 썸네일로 미리보기가 되는 스킨이 있더라고요. 

이게 뭐라고 너무 부러운거 있지요. 그래서 한참을 뒤졌지만 쉬운 방법이 없더라고요.

그래서 #2 스킨에 있는 미리보기 소스를 찾아봤습니다. 

제가 css나 HTML 코드를 잘 몰라서 그냥 마구 글거와서 붙여보고 안되면 다른 곳에 붙여 보고 그랬습니다.

티스토리 #1 스킨을 사용하시는 분들 중 하단에 다른 글 미리보기를 만드시고 싶으신 분들은 아래 그림과 같이 작업을 하시면 됩니다.

티스토리 #1 하단 썸네일 만들기

1. #1 스킨 편집으로 들어간 다음에 태그 소스를 찾습니다. ctrl+F 눌러서 <s_tag_label>을 찾습니다.

그리고 아래 하단에 아래 코드를 입력해 줍니다. 텍스트 파일을 다운 받아서 내용을 복사하시면 됩니다.

하단 쎔네일 HTML.txt

2. 만약 미리보기 화면에 타이틀과 날짜가 나타나는데요. 이 부분을 없애고 싶으시면 1번과 2번 라인 모두 지워주면 됩니다.  그러면 미리보기 썸네일에 제목과 날짜가 나타나지 않습니다.

3. 붙여 넣기를 하면 나오긴 하지만 뭔가 잘 안 맞을 것입니다. css 작업을 해줘야 하는데요. 이것도 그냥 파일을 받아서 CSS로 이동을 한 다음 맨 하단에 복사하여 넣으시면 됩니다.

하단 썸네일 css.txt

 

4. css 중 1번은 미리보기 이미지가 어둡게 나오는데요 이 부분을 none로 변경르 해주면 검정화면이 사라지고  본 이미지로 나타납니다. 

2번은 타이틀 색입니다. "color:#fff"로 되어 있는데요. 다른 색으로 변경하고 싶으면 #fff에 다른 값을 넣어주면 됩니다. 바로 아래에 있는 date_related 부분의 color는 날짜를 나타내는 부분으로 원하는 색으로 변경시켜 주시면 됩니다.

티스트로 #1 하단 썸네일 마치며 

머리가 나쁘면 손발이 고생한다는 말이 딱 맞는거 같습니다. 아직도 해결 못한 부분이 있는데요.

이미지 사이즈가 185x200인데 위에 사이즈를 200x200으로 변경하면 될 것 같은데 변경을 해봐도 안되더라고요.

알고 계신분 있으면 댓글에 방법을 알려주셨으면 좋겠습니다. ^^