Please Enable JavaScript!
Gon[ Enable JavaScript ]

반응형

티스토리 블로그 글 목록에 있는 날짜 삭제나 디자인 변경하기

 

환경 : Internet Explorer 11

 

티스토리에서 검색이나 카테고리 메뉴를 클릭했을 때 제목앞에 있는 날짜의 표현형태나 위치를 변경하는 방법에 대해 알아 보겠습니다.

 

티스토리 카테고리나 검색을 하게 되면 제목앞에 올린 날짜와 시간이 표시 됩니다. 티스토리에서 이부분을 담고 있는 변수는 ##_list_rep_regdate_## 입니다. 이것을 옮기거나 자바스크립트로 변경하시면 되겠죠.

 

[블로그] 티스토리 블로그 글 목록에 있는 날짜 삭제나 디자인 변경하기

 

1. 날짜 위치 변경

 

리스트에 표현되고 있는 날짜위치를 뒤로 변경하기 위해 티스토리 관리자 페이지로 로그인합니다. 그리고 HTML/CSS 메뉴를 눌러 페이지로 이동합니다. 그런후 Ctrl + F 단축키를 눌러 S_list 검색합니다 

[블로그] 티스토리 블로그 글 목록에 있는 날짜 삭제나 디자인 변경하기

 

S_list 를 검색하시면 skin.html 페이지에서 근처에 아래 태그들을 찾을 수 있습니다. 아래 부분을 잘라내기 해서 ##_list_rep_rp_cnt_## 뒤로 옮깁니다.그럼 화면에 있던 날짜가 제목 뒤로 이동하게 될 겁니다.

 

<span class="date"></span>

 

[블로그] 티스토리 블로그 글 목록에 있는 날짜 삭제나 디자인 변경하기

 

을 잘라내기 해서 위치를 바꾼 후 Skin.html 을 저장합니다. 그리고 블로그로 돌아와서 제대로반영되었는지 확인합니다.

[블로그] 티스토리 블로그 글 목록에 있는 날짜 삭제나 디자인 변경하기

 

 

이번에는 날짜가 들쑥날쑥해서 가독성이 떨어지므로 오른쪽으로 붙여서 정렬해 보겠습니다. Span 태그 요소에 스타일을 적용합니다.  Right padding 값을 줘서 오른쪽으로 정렬 시킵니다.

 

<span class="date" style="float:right; padding-right:15px;">

</span>

 

[블로그] 티스토리 블로그 글 목록에 있는 날짜 삭제나 디자인 변경하기

 

2. 년도/월 로 표시 하기

 

이번에는 날짜 표시형태를 변경해 보도록 하겠습니다. strDate=''.substr(0,7); 이면 년도만 표시하게 됩니다. 전체 날짜에서 어떻게 잘라내느냐에 따라 표시하는 형태가 틀려 지겠죠. 변수값을 아래 코드로 교체합니다.

 

<span class="date">

<!-- 년도/ -->

<script type="text/javascript">

           strDate=''.substr(0,7);

           document.write(strDate)

</script>

</span>

 

[블로그] 티스토리 블로그 글 목록에 있는 날짜 삭제나 디자인 변경하기

 

날짜 표현 방식을 변경하기 위해 자바스크립트 소스를 넣고 skin.html 을 저장합니다. 그리고 블로그로 돌아와서 년도와 월만 표시되는지 확인해 봅니다.

[블로그] 티스토리 블로그 글 목록에 있는 날짜 삭제나 디자인 변경하기

반응형
Posted by 녹두장군1
,