티스토리 #2 반응형 스킨에 대해, 개인화해가기

skin.html 파일과 style.css 파일을 편집하기 전에 주의:

1. 고치기 전에 스킨과 스타일 파일 편집창을 열어 ctrl-a 로 전체선택해 ctrl-c 로 복사한 다음, 윈도우 메모장을 열어 붙여넣기할 것. 그래서 skin.2019-10-22-1.txt 라는 식으로 저장할 것. 고치다 스킨이 깨졌는데 뭐때문인지 모르면 그걸로 원상복구한 다음 재시도. 다 고친 다음에도 그날의 완성본 파일을 같은 방식으로 다른 이름으로 백업.

2. 편집은 티스토리의 편집화면에서 해도 무방하지만, 은근히 불편하고 단축키가 다르게 먹기도 하기 때문에, 자기 컴퓨터에서 손에 익숙한 편집기에 붙여넣어 거기서 고친 다음에 티스토리에 붙여넣기하고 적용하는 것도 괜찮음.

1.    

블로그를 깔끔하게 보이기 위해 본문 퍼블리시 일시를 날짜만 표시하고 시간을 없애고 싶을 때는, skin.html 파일에서 2019. 10. 31. 00:00 를 검색해 그 부분을,

<script type="text/javascript">

document.write('2019. 10. 31. 00:00'.substr(0,10))

</script>

이걸로 고쳐주면 된다. 간단함. "날짜 일시"로 구성된 문자열을 "날짜"만 잘라내 쓰기.

2.    

태그를 본문 끝에서 글제목 아래로 끌어올리기

글 본문은 여기.

태그든 다른 엘레멘트든 본문을 표시하는 내용은 다 이 위나 아래에 붙어 있음. 

그래서 그 글의 태그를 표시하는 내용

이걸 area_title DIV태그 안으로 넣으면 깔끔하게 제목 아랫줄로 감. 요즘은 SNS와 신문기사가 모두 태그를 본문 하단에 두어서, 내용을 다 읽은 다음에 더 보고 싶으면 클릭하세요하는 것 같다. 내 경우는 그냥, 글 내용을 읽기 전에 가늠할 수 있도록 요약어처럼 생각해서 제목 하단에 두는 걸로 했다.

3.    

팀블로그가 아니니까 글마다 글쓴이 이름은 필요없어서 대신 블로그 이름이나 글 주소를 넣고 싶다면,

alberto 부분을 이를테면 pcgeeks.tistory.com 이라고 고치면 된다.

아니면 조금 더 신경써서, 지금 본문을 보고 있는글 URL을 표시하고 싶다면,

이렇게 하면 주소가 나온다. 그래서 여기까지 몇 가지 고친 결과는 이렇다.

4.    

글주소를 읽어낼 수 있기 때문에 기능을 더할 수 있다. 예를 들어,

자기 블로그를 로그인하지 않은 상태에서 보고 있다가 그 글을 편집하고 싶어졌다면, 보통은 관리자로그인버튼을 눌러 로그인해서 글목록창에 들어가서 해당 글을 찾아 수정버튼을 누를 것이다. 그냥 바로 로그인해 편집하고 싶다면, 본문 어딘가에 비로그인상태에서도 보일 클릭할 링크를 하나 만들어둘 수 있다.

이를테면, 앞엣것을 이렇게 고쳐주자.