분류 전체보기(44)
-
[Customizing Tistory Poster Skin - 3] 티스토리 모바일 스킨 수정
오늘은 간단한 내용을 들고 왔다. 바로 티스토리에서 기본으로 제공하는 모바일 스킨 적용을 OFF 하는 방법! 나는 주로 노트북이나 PC를 통해서 블로그를 했던 터라, 모바일 기기에서 보여지는 내 블로그를 확인 못하고 있었다 ㅋㅋ 우연히 모바일로 내 블로그에 접속했는데, 내가 웹에서 수정했던 그 스킨이 아닌 것을 확인했다. 알아보니, 티스토리에서는 기본적으로 모바일용 스킨을 따로 제공하던 것. 요 기본 모바일 스킨을 적용하지 않아야, 내가 웹에서 수정한 스킨을 모바일에서도 그대로 띄워준다 !! 그 방법은 매우 쉽다. '블로그관리->꾸미기탭의 모바일 선택' 로 이동하면 아래와 같은 모습을 확인할 수 있다. 중앙에 보이는 이미지가 티스토리에서 제공하는 기본 모바일 스킨으로, 사용자가 간단히 배경 사진정도를 수..
2019.06.11 -
[Customizing Tistory Poster Skin - 2] 티스토리 홈커버 슬라이더 페이지 개별화
이전 글에서 소개 했듯이 티스토리에서 홈커버는 블로그의 홈화면 스타일이다. 나는 Poster 스킨에서 제공하는 홈커버 스타일들 중에, '슬라이드' 커버가 마음에 들어서 이 스킨을 기본으로 코드를 조금씩 수정해 사용할 것이다. 그런데 기본 스킨이 제공하는 슬라이드 커버는 각 슬라이드 페이지 마다 동일한 디자인을 갖도록 코드가 작성되어 있다. 예를 들면, 기본 스킨은 각 슬라이드 페이지마다 배경사진이 있고, 글의 카테고리, 글의 제목, 간단 소개, 자세히보기 버튼 으로 구성되어 있도록 코드가 작성되어있다. 아래 그림은 티스토리에서 제공하는 poster 스킨 적용예시 블로그에서 가져온 슬라이드 페이지이다. 이해에 도움이 되도록 사진을 가져와봤다. 나는 이 슬라이드 커버를 내 블로그의 소개 슬라이드로 사용하고자..
2019.06.04 -
[Customizing Tistory Poster Skin - 1] 티스토리 스킨 코드 구조 분석
스킨을 수정하려면, 스킨 코드를 어느정도는 이해해야한다. 따라서 이 글에서는 티스토리에서 배포하는 스킨들의 기본 구조를 소개하고자 한다. Skin 코드 구성_____ 먼저 티스토리에서 배포하는 스킨들은 모두 동일한 코드 구성을 갖는다. 이러한 스킨 코드 구성을 먼저 알아보자. 맘에드는 스킨의 코드를 하나 다운받아 보면, 아래 그림과 같은 디렉토리로 구성되어 있음을 확인할 수 있다. 스킨 구성에 중요한건 1) index.xml, 2) skin.html 그리고 3)style.css 요 세 가지 파일이다. (html/css에 익숙치 않은 분들은 그냥 skin.html이 스킨을 정의하는 파일 이란 것만 알고 넘어가도 좋다.) 1) index.xml은 스킨에 대한 정보 (제작자 정보, 지원 커버 스타일 목록 ....
2019.06.04 -
[Customizing Tistory Poster Skin - Prologue] 티스토리 입문
PROLOGUE_____ 블로그를 제대로 시작해보고자, Tistory에 입문했다. 평소 네이버 블로그의 페이지 구성을 맘에 들어하지 않아서, 페이지 구성에 자유도가 높은 Tistory를 선택했다. 물론 자유로운 페이지 구성을 위해서는 웹디자인에 대한 지식이 필요하다. 그런데 나는 이전에 대학원에 있을 때, 연구실 홈페이지 관리를 담당하면서 HTML, CSS 등에 대한기초는 익혀뒀다. 그래서 바로 Tistory를 통해 내 블로그를 개설했당 :) . 블로그를 개설 했으니, 이제 내 맘대로 페이지를 구성해 볼 차례다! 일단은 티스토리에서 내놓은 신상 스킨이 여러 개 제공되고 있었다. 그 중 'Poster' 스킨이 맘에 들어서 이 스킨을 내 입맛대로 조금씩 수정해서 사용하려 한다. 따라서 이번 포스트에서는 내..
2019.05.30