태터데스크 관리자

도움말
닫기
적용하기   첫페이지 만들기

태터데스크 메시지

저장하였습니다.

티스토리 반응형 스킨 작업을 진행했습니다.


기존에 사용하는 스킨은 기본 스킨을 사용하고 있었습니다. 


기본 스킨을 사용한 이유는 

첫번째, 제일 직관적인 인터페리스를 가지고 있기 때문입니다.

두번째, 주로 웹에서 스크랩 용도로 사용하기 때문에, 굳이 반응형 스킨이 필요하지 않은 이유도 있었습니다.


티스토리 스킨 개발에 관심이 있는데, 반응형으로 변경하지 않는 것은, 개발자로서 문제가 있다고 생각해서, 

기존 기본 스킨을 반응형으로 변경 작업을 진행하도록 결정했습니다.



< 현재 웹에서 블로그 모습 >




기존 스킨에서 최소한의 작업으로 반응형 스킨을 수정을 하려고 계획을 잡았습니다.


문제가 되는 부분은 

첫번째, 사이드바를 어떻게 처리해서 배치.

두번째, 최대한 여백을 줄여서, 컨텐츠 영역을 넓게 뽑아내는 한다는 점.

두번째, 기존 adsense 배너가 반응형 배너가 아니고, 반응형으로 변경시에, adsense 배너를 재배치 해야 하는 점.



아래와 같이 모바일에서 반응형 스킨 작업을 완료했습니다.


< 현재 웹에서 블로그 모습 >


 


기존 디자인을 유지하면서, 불필요한 여백을 제거하고, 애드센스 배너는 반응형으로 교체했습니다.



하단 배너는 1개만 노출하도록 수정하고, 사이드바를 하단에 배치하는 방식으로 변경했습니다. 




이렇게 커스터마이징된 기본 디자인을 가지고, 동일한 구조로 보여지는 반응형 스킨 작업을 완료 했습니다.










댓글을 달아 주세요

[ 티스토리 ] 블로그 글의 최종 수정일 가져오기

http://tonks.tistory.com/122

티스토리에서, 글을 "공개"하거나, "발행"했을 때 그 글의 마지막 수정된 날짜를 가져오는 방법이다. 이라는 태그를 이용하는 방법이다. 태그의 "property" 속성값이 "article:modified_time"이라면, 그 태그의 "content" 속성에 저장된 숫자를 가져와서, 자바스크립트의 "new Date()" 함수를 이용하여, 그 숫자들을 날짜 형식으로 바꿔준다. 참고로, "비공개..

 

 

 

 

댓글을 달아 주세요

티스토리 블로그 활용법 - 블로그에 홈페이지와 같은 디자인을 입히는 이유 : 천추의 IT 이야기

http://chunchu.tistory.com/191

아이패드 어플 추천 아이폰 어플 추천, 안드로이드 어플 추천 아이티 블로그

 

 

 

 

댓글을 달아 주세요

티스토리 반응형 스킨 현명한 선택일까? :: 살아서 숨쉬자

http://tkdlzhdl.tistory.com/158

여러분들은 티스토리를 운영하는 목적이 무엇인가요? 아마도 개인의 공간으로 활용하시는분은 1%도 안된다고 생각합니다. 네이버 블로그보다 자유도가 높아서? HTML수정이 가능해서? 물론 이런이유도 있겠지만 결국은 HTML수정이 가능한 이유로 한다는 것은 구글 애드센스 광고를 삽입해서 수익을 내기 위해 운영하는 것이겠죠. 결국 최종 목적은 수익입니다. 저 또한 똑같은 이유입니다. 수익을 많이 낼 수 있는 방법은 방문자..

 

 

 

Financial Freedom - 티스토리 반응형 스킨을 선택한 이유와 그 종류. :)

http://financialfreedom.kr/690

많은 티스토리 블로거들이 최근 들어서 반응형 블로그 스킨을 설치하고 계신듯 합니다. 모바일 유입자가 많아지면서 그에 대응하고자 하는 분들이 대부분인것 같은데, 저 같은 경우에는 예전부터 그냥 글 자체에 애드센스 광고나 필요한 스크립트 들을 삽입하는 형식으로 해왔기 때문에 모바일에 대한 대응도 그럭저럭 되고 있는 편입니다. 물론 글마다 계속 삽입해야한다는게 번거롭기는 하지요. 아무리 서식으로 만들어두어서..

 

 

 

댓글을 달아 주세요

티스토리 메타 태그 생성 유의점 :: WEBDIR

http://webdir.tistory.com/474

티스토리 스킨 제작중에 메타 태그에 대한 의문점이 남아 이에 대한 조사를 해보았습니다. 스킨 제작에 관심있는 분들에게 참고가 되었으면 합니다. meta http-equiv="x-ua-compatible" IE 브라우저 사용자들을 위해 최신의 문서모드로 렌더링 되도록 아래와 같은 코드 사용을 하곤 한다. 이는 X-UA-Compatible, IE=edge, 호환성 보기에서 설명했듯이 웹서버에 지정해..

 


티스토리 description 태그 제거 

기본적으로 상단에 있는 description 태그는 삭제를 해야 한다. 그래야지 문서 중간에 있는 올바른 description 태그가 정상적으로 보이게 된다.

댓글을 달아 주세요

설정 > HTML/CSS 편집


style.css에서 상단에 아래행 추가한다.


@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);


그리고, body에 font에 'Nanum Gothic' 을 추가해 준다.




* 스킨에 따라서 약간의 설정이 달라 질 수 있습니다.

댓글을 달아 주세요

애드센스(adsense)에 티스토리(tistory) 도메인을 등록하려고 하면 "아직 웹사이트가 없습니다."


URL에는 경로(예: example.com/경로) 또는 하위 도메인(하위도메인.example.com)이 포함될 수 없습니다.

여기서 "하위 도메인이 포함될 수 없습니다."가 문제가 됩니다. devhelp.tistory.com에서 devhelp부분이 하위 도메인에 해당이 됩니다.

그래서 추가로 도메인 구입을 해야 합니다.



티스토리 환경설정 > 기본정보 > 주소설정을 보면 2차주소를 선택해서 도메인을 설정을 해야 합니다.


gabia 도메인 구입


도메인을 구입한 다음에 바로 2차 주소에 도메인을 입력한다고 연결이 되지가 않습니다.

아래 티스토리 링크에서 2차주소를 개인도메인과 연결하는 방법을 알려주고 있습니다.


[블로그정보] 개인 도메인(2차 블로그 주소) 설정하기


설정을 하고 2차주소를 입력을 하면 정상적으로 저장이 됩니다. 

위 링크를 통해서 정상적으로 설정을 안하면 2차도메인이 설정이 안됩니다.


다시 애드센스로 가서 도메인을 입력하면, 정상적으로 등록이 됩니다.




댓글을 달아 주세요