들어가기 전에2014/05/20 - 반응형이 가능한 블로그에서 알아 보았듯이티스토리는 반응형으로 만들 수 있다. 그러나 티스토리를 간단히 반응형으로 만들 수 있는 반응형 스킨이 있다. 그런데 티스토리에는 스킨이별로 없어 독창적인 블로그가 별로 없다는 점을말 하려고 한다. 블로그 프로그램인워드프레스로 만든 독창적이고 멋진 웹사이트를 많이 봐서 티스토리에서 본 블로그가 독창적인 것이 아쉬워서 그런 것이니이 글을너무 부정적으로 받아들이지 말기 바란다. 들어가기위에서 말했듯이 티스토리는 반응형 블로그를 만들 수 있으나많은 반응형 스킨이 없어서 독창적인 반응형 블로그를 만드는데는 한계가 있다. 여담으로 많은 반응형 스킨이 없으니 티스토리에 반응형 스킨을 적용한 블로그를 보면 거의 다 비슷하다. 티스토리에서 인기있는 반응..

들어가기 전에 이 글에서 반응형을 만들 수 있는 블로그를 내가 아는 범위내에서 적어보려 한다. 간단히 반응형을말하자면 아래 그림처럼 사이트가스마트폰, 태블릿PC, 노트북, 데스크탑컴퓨터 등 어떤 기기에 상관없이 최적화된 화면을 보여준다. 더 자세히는2013/07/06 - 반응형 블로그(티스토리)에 대한 이해를 보기 바란다. 들어가기 반응형을 만드려면2014/05/18 - 아는 사람만 반응형 스킨을 사용해야 할 것 같다에서도 말했듯 기본적으로 CSS3의 미디어쿼리를 지원해야 한다. 미디어쿼리를 깊게 들어가면 머리 아프니 넘어가고 아래에서는 어떤 블로그에서반응형 블로그를 만들 수 있는지만 설명하려고 한다.다음과 네이버 블로그우리나라 사람들은 다음과 네이버 블로그를 가장 많이 사용한다. 그렇다고 당연히 반응형으로 만들수 있는 것이라고 생각한..

들어가기 전에 네이버 블로그 등 다른 블로그와 다르게티스토리를 하면 반응형 블로그를 만들 수 있다. 이것때문에 티스토리를 하지 말기 바란다. 왜냐하면 아래에 설명할 어려운 점이 많기 때문이다.이 글에서는 티스토리에서 반응형 블로그를 만드는 것에 대해 설명할 것이 아니라티스토리에서 반응형 스킨을 사용하는데 여러가지 문제가 있다는 것을 설명하고자 한다.참고로 반응형 티스토리에 대해서는 아래 글을 보기 바란다.2013/08/18 - 반응형 티스토리 만들기 : 스킨 내려받기 등들어가기 1. 미디어쿼리는 익스플로러 8 이하는 지원하지 않는다. 스마트폰, 태블릿PC 등모바일 기기 사용이 많으므로 요즘 반응형 사이트가 대세인데 우리나라에서 익스플로러 7,8 사용자가 많아 반응형 블로그를 만드는데 많은 어려움이 있다.아래 그림은 이 블로그 ..

들어가기 전에 우연히 네이버 블로그의 모바일 페이지를 보다가 적용된 모바일 스킨이 좋아서 이 글을 적게 되었다. 그래서 티스토리도모바일 페이지 스킨변화에 대한 바람을 적으려 한다. 참고로 아래 그림은 네이버 블로그 앱(어플)이 아닌 모바일 브라우저로 네이버 블로그를 방문햇을 때 보여지는 모바일 페이지다. 들어가기 앱(어플)과 반응형 사이트를 많이 접하여 위나 아래 그림에서 볼 수 있는가로선 사각형 아이콘을 클릭하면 메뉴가 나온다. 보통가로선 사각형 아아콘을 터치하면무엇인가가 나온다는 생각이 의연중에 있는 것 같다. 그러니 위 네이버 블로그 모바일 페이지를 방문했을 때 가로선 아이콘을 클릭해서 메뉴가 나오게 했다. 위 네이버 블로그에 적용된 스킨을 보니티스토리 모바일 페이지스킨도 가로선 사각형 아이콘이 있었..

이 글에서 적으려는 것 티스토리는 스킨을 만들어 쉽게 공유와 적용할 곳이 없는 아쉬움을 적고자 한다. 네이버 블로그 등 국내 가입형 블로그에서 블로그를 했던 사람은 티스토리에서 스킨 공유와 적용이 힘들다는 것이 있었을 것이다. 본론으로 네이버 블로그와 이글루스는 스킨을 만들면 쉽게공유하고 블로그에 쉽게 적용할 수 있다. 첫번째로네이버 블로그에서는 블로그에서 스킨을 만들어 공유하면 그 스킨을 아이템 팩토리라는 페이지에 공유된다. 말로 하면 설명이 어려운데 네이버 블로그를 하면 알 것이다. 그리고 모든 네이버 블로거가 그 스킨을 사용할 수 있다. 아래에서는 네이버 블로그가 아닌 이글루스에 대해서 다룬다. 두번째로 이글루스에서는 아래와 같다.비록 이글루스는기능에 있어서네이버 블로그나 티스토리와 비해서 적지만 ..

.iconicmenu { position: relative; height: 45px; overflow: hidden; } .iconicmenu, .iconicmenu * { -moz-box-sizing: border-box; box-sizing: border-box; } .iconicmenu input[type="checkbox"] { /* checkbox used to toggle menu state */ position: absolute; left: 0; top: 0; opacity: 0; } .iconicmenu > label { /* Main label icon to toggle menu state */ z-index: 1000; display: block; position: absolute; width: 40px; height: 40px; float: left; top: 0; left: 0; background: white; text-indent: -1000000px; border: 6px solid black; /* border color */ border-width: 6px 0; cursor: pointer; -moz-transition: all 0.3s ease-in; -webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in; /* transition for flipping label */ } .iconicmenu > label::after { /* inner stripes inside label */ content: ""; display: block; position: absolute; width: 100%; height: 18%; ..

이 글에서 적을 것이 글에서는 티스토리를 하다가 티스토리에서 카테고리 펼치기는 왜 치환자가 아닌 자바스크립트로 해야 하는지에 대한 내용이다.여담으로 얼마전에 카테고리를 치환자가 아닌 자바스크립트로 해야 하는 이유를 알았다. 4년 동안자바스크립트를 사용해야 하는 이유를 몰랐다.그리고 이 글에서 티스토리에서 카테고리 펼치는 치환자와 자바스크립트에 대해 알 수 있다.참고로 여기 글과 이 블로그의 치환자에서 ## 뒤와 앞의 공백은 없다. 왜냐하면, ## 뒤와 앞에 공백이 없으면 치환자를 인식하기 때문이다. 그러니 실제 치환자는 공백이 없다는 것을 알기 바란다.왜 그럴까티스토리서 카테고리 펼치기 치환자는 [## _category_list_ ##]을 사용할 수 있다. 하지만 이것을 사용하면 단점이 카테고리를 접지 못하고 또한 관리에 있는 카테고리 ..