본문 바로가기

[물질세계]/소셜미디어

마크쿼리 스킨에 반응형 티에디션 적용

올해 초에 마크쿼리 스킨을 적용하여 블로그 스킨을 반응형으로 바꾸었다. 반응형 스킨을 사용하면 데스크탑이나 모바일 플랫폼 어디에서나 화면폭에 맞춰 블로그 폭과 폰트 크기를 조절해 준다. 특히 모바일에서 블로그의 가독성이 월등하게 좋아진다.

그런데 반응형 스킨을 적용하면 티스토리의 티에디션을 사용하지 못하는 것이 문제였다. 티에디션이 블로그에 어떤 포스팅이 있는지 요약해서 보여주고 다른 글로 유인하는 기능을 갖고 있는데, 티에디션을 사용할 수 없으니 블로그가 항상 최근 포스팅만 보여줘서 아쉬움이 있었다.

그런데 반응형 스킨에도 티에디션을 적용할 수 있게 방법을 찾아 공유하는 능력자 분이 계셨다.

Readiz 블로그 주인장 분은 티스토리에서 반응형 스킨을 제대로 쓸 수 있는 방법을 계속 올려주고 계신다.

이 사이트에는 마크쿼리 Skeleton skin과 별도로 FastBoot 이라는 반응형 스킨도 공개되어 있는데, 이번에는 FastBoot을 적용하지는 않고 반응형 티에디션을 구현하는 방법만 골라 적용해 보았다.

적용 후 Desktop Browser에서의 모습


Mobile (G Pro) 화면



모바일 화면에서도 티에디션이 알아보기 쉽게 나오는 것을 볼 수 있다.



Readiz 블로그에는 티스토리 블로그에서 반응형 스킨을 제대로 쓰는 방법이 계속 올라오고 있다 있다. 반응형 스킨에 관심이 있는 블로거라면 많은 도움을 얻을 수 있을 것이다.

아래는 Readiz 블로그 운영자님이 반응형 스킨 제작에 몰두하는 이유로 적어 놓은 글입니다.

”현재 티스토리 측에서 제공하는 모바일 페이지는 너무 단점이 많습니다. 수정도 불가능하구요. 이를 혁파하기 위해 나온 것이 반응형 스킨입니다. >반응형 스킨을 티스토리의 새로운 표준으로 만들어서 티스토리의 혁신성을 유지시키고자 하는 것이 제 요즘 목표입니다.”

티스토리 스킨 개선을 위해 애쓰시는 Readiz 블로그 운영자님 고맙습니다.

  • 안녕하세요? 마크쿼리 검색하다가 우연히 방문하게 되었습니다.
    제가 이번에 스킨을 수정했는데 상단 메뉴바가 접히질 않아서 고전 중이거등요.
    초보라서 너무 답답한 마음에 초면인데 조언 좀 부탁드려도 될까요?
    제 블로그는 http://dallante.tistory.com 이에요.
    늦더라도 가능하시다면 기다리겠습니다.

    • 안녕하세요. 링크 남기신 블로그는 가보았습니다. 그런데 저도 스킨이나 마크쿼리 고수가 아니라 그냥 조금 변형해서 쓰는 정도라 민들레yo님 블로그에 일어난 문제의 원인은 잘 모르겠네요. 다시 원래의 스킨으로 복구하신 후에 마크쿼리의 html과 css 화일을 수정할 때 단계별로 스킨을 백업을 하면서 진행해 보시면 어떨까요. 아니면 마크쿼리 제작자분의 커뮤니티 게시판에 질문을 하시는 것이 좋을 것 같습니다.