티스토리 댓글 및 방명록 디자인 유의사항 티스토리의 댓글 및 방명록을 디자인할때 겪을 수 있는 유의사항을 살펴봅니다. 댓글 및 방명록 스크립트 티스토리에서 댓글과 방명록 폼에 입력된 내용을 처리하는 스크립트는 아래와 같다. function addComment(caller, entryId) { var oForm = findFormObject(caller); if (!oForm) return false; var request = new HTTPRequest("PO.. 티스토리/스킨가이드 2016.01.05 11:00
티스토리 카테고리 클래스 추가 티스토리 스킨의 카테고리 목록형 구조에 클래스명이 새로이 추가되었습니다. 카테고리 디자인을 위해 복잡한 CSS 선택자를 이용하거나 스크립트로 클래스를 추가해 사용해왔는데 조금은 수월해질 듯 싶습니다. 카테고리 목록의 구조 아래는 [샆샾_category_list_샾샾] 치환자를 이용할 경우 생성되는 구조이다. 샾샾 부분은 ##으로 교체 <ul class="tt_category"> <li> .. 티스토리/스킨가이드 2016.01.04 11:00
티스토리 첨부 파일 디자인 티스토리의 첨부 파일은 파일형식에 따라 각각의 아이콘 이미지가 함께 제공되는데 아래가 대표적인 예이다. 이대로 사용해도 큰 문제는 없지만 반응형 디자인을 지원하는 경우, 모바일의 뷰포트의 크기에 따라 글자와 아이콘 이미지가 정렬되지 않는 경우가 있을 수 있다. 이 경우 vertical-align: middle 이 지정되어 있는 정렬 값을 변경해보자. .imageblock > a[href*="attachment"] > img { .. 티스토리/스킨가이드 2015.12.08 11:00
이미지 캡션(자막) 디자인 이미지 기본형 티스토리 이미지의 기본 형태는 아래와 같으면 자막이 작성되어 있는 경우에만 .cap1 구조가 등장한다. <p style="정렬값"> <span class="imageblock" style="반응형 이미지설정 값"> <img src="이미지 경로" style="반응형 이미지설정 값" width="이미지너비" height="이미지높이"> <span class="cap.. 티스토리/스킨가이드 2015.12.07 11:00
티스토리 최신글, 카테고리 썸네일 추출에 대한 이해 티스토리 스킨에는 갤러리 형태의 카테고리(검색결과) 및 최신글의 이미지를 출력하는 치환자가 공개되지 않았습니다. 물론, 티스토리에서 제공하는 모바일 스킨에는 이를 지원하고 있으나 모바일 스킨은 공개되지 않았기에 일반 스킨 제작자들은 다른 방법을 필요로 합니다. 티스토리 썸네일 치환자 업데이트! 티스토리에서 공식적으로 썸네일 치환자가 업데이트 되었습니다. http://www.tistory.com/guide/skin/step3#2-8-7 Aj.. 티스토리/스킨가이드 2015.11.03 11:00
티스토리 본문 너비와 사진 첨부로 삽입되는 이미지의 상관관계 티스토리 에디터의 사진 첨부 기능으로 이미지를 삽입할때 영향을 주거나 받는, 연관하여 스킨 제작시에 제한 받을 수 있는 점들에 대하여 살펴봅니다. 스킨 제작분들 이외에도 블로그를 시작하기 전에 알아두면 차후 스킨 변경시 이미지로 인해 겪는 문제를 덜 수 있습니다. 티스토리 본문 너비 이해 티스토리의 본문 너비라고 지칭하면 대부분 글쓰기 가로폭을 떠올린다. 이는 TISTORY 관리 → 글설정 → 글쓰기 환경의 글쓰기 가록폭 에서 설정 할 수 있으며,.. 티스토리/스킨가이드 2015.11.02 11:00
티스토리 반응형 이미지 제공 티스토리는 반응형 스킨을 위해 따로 무엇인가 지원하는 곳은 아니였습니다. 스킨공모전 이후에 새로운 스킨을 준비중이라는 티스토리 측의 말이 있었듯이 하나 둘 기본 시스템을 업데이트해 나가고 있습니다. 얼마전에는 날짜 표현방식이 변경되어 당황스런 일도 있었지만 이번에 발견한 것은 본문에 삽입되는 이미지와 관련된 정보입니다. 반응형 이미지 지원 그 동안 티스토리 스킨제작시에 에디터로 삽입되는 본문 이미지를 반응형 디자인에 맞게 수정하기 위해.. 티스토리/스킨가이드 2015.10.29 11:00
티스토리 메타 태그 생성 유의점 티스토리 스킨 제작중에 메타 태그에 대한 의문점이 남아 이에 대한 조사를 해보았습니다. 스킨 제작에 관심있는 분들에게 참고가 되었으면 합니다. meta http-equiv="x-ua-compatible" IE 브라우저 사용자들을 위해 최신의 문서모드로 렌더링 되도록 아래와 같은 코드 사용을 하곤 한다. <meta http-equiv="x-ua-compatible" content="ie=edge"> 이는 X-UA-Compatibl.. 티스토리/스킨가이드 2015.09.24 11:00
