티스토리 뷰

개발자 이야기/개발

티스토리 기존 주석을 Bigfoot으로 교체

이상주의를 품은 현실주의자 몽땅™ 2016.09.30 16:01

티스토리에서 글을 쓸때 주석[각주:1]을 많이 사용하는데, 기본으로 제공되는 주석는 모바일에서 문제있다.. 그래서 티스토리 모바일 전용 스킨에서는 개선해 놓은 사항이 많은데 문제는 내가 모바일 스킨을 안쓴다는것이다. 문제점은 3가지 정도 있다. 첫번째는 주석을 터치하면 말풍선이 나오는데 없어지지 않는다. 원인을 분석해본건 아니지만 마우스 오버가 되어 있지 않은 상태에도 없어지지 않는다. 두번째는 화면 양쪽에 주석이 있을경우 말풍선이 짤린다. 화면을 축소하면 볼 수 있겠다 생각했지만 축소해도 잘려서나온다. 아마 viewport를 제한해서 그런것 같다.[각주:2] 이것이 세번째 문제이다. 내가 모바일 전용 스킨을 사용하지 않으니 당연히 개선된 사항을 반영할 수 없고 모바일과 PC에서 동일한 콘텐츠를 제공할 수 없게된다. 그래서 스스로 주석을 개선하기로 마음먹었는데 이미 많은 plugin이 나와 있었다.

그중에 하나가 Bigfoot(이하 빅풋)이다. 일단 이름에서도 알 수 있듯이 큰 주석을 자랑한다. 이전 주석보다 글자 크기도 크고 주석을 나타내는 말풍선도 크다. 물론 주석을 표시하는 Sign도 크다. 공식 홈페이지에서 파일을 받고 티스토리 스킨 편집에서 편집을 해주면 되는데, 생각보다 쉽다. js파일과 css 파일을 업로드 시켜주고 HTML 소스에 추가해주면 되는 아주 간단한 설치 방법이다. 추가로 아래처럼 지정해주면 이전과 똑같이 작동한다.

<script type="text/javascript">

$.bigfoot({

actionOriginalFN: "ignore"

});

</script>

원래는 점 3개로된 마커였는데, 숫자로된 버전도 지원한다. 의아하게도 공식 사이트에서 받은 css와 js는 디자인 오류가 생길 수 있다. 그래서 워드프레스 사용자가 만든 css와 js를 사용하면 된다.

  1. 각주 [본문으로]
  2. PC에서는 스킨 디자인을 파괴하면서도 출력되지만 모바일은 안된다. [본문으로]
댓글
댓글쓰기 폼