본문 바로가기

티스토리스킨/반응형 2단 스킨

티스토리 반응형 스킨 117 - 반응형 2단 심플리트3 버전3 배포합니다.

반응형

--------------------------------------------------------------------------

2021.06.14

SNS 아이콘을 미사용으로 할 경우 모바일에서 사이드바 메뉴가 펼쳐지지 않는 버그 패치

스킨 압축 파일을 다시 다운로드 받아 script.js 파일만 다시 업로드하면 됩니다.(웹브라우저 캐시 소거하면 즉시 확인 가능)

--------------------------------------------------------------------------

2021.06.10

스킨 이용자 요청으로 기능들이 추가된 v3.1 버전이 배포되었습니다.

추가된 기능들에 대한 안내는 다음 링크를 참고하시기 바랍니다.

 

> 반응형 2단 심플리트3 버전 3.1 안내

 

--------------------------------------------------------------------------

 

 

블로그 운영에 필요한 여러가지 고급 기능들이 추가된 버전입니다.

버전3 부터는 인터넷 익스플로러가 지원됩니다.

자바스크립트 호환성을 개선해서 옵션으로 켜서 사용하는 몇가지 기능(레이지로드, 구글 번역)을 제외하고 인터넷 익스플로러11를 잘 지원합니다.

 

버전2 사용자는 버전3로 업그레이드하는 것을 추천합니다.

 

 

 

 

 

117_Simplit3_v3.zip 다운로드

 

 

3.0으로 업그레이드 되면서 개선, 추가된 주요 사항은 다음과 같습니다.

 

  1. 인터넷 익스플로러 11 호환성 개선 - 레이지로드, 구글 번역 기능을 제외하고 인터넷 익스플로러11 지원합니다. 레이지로드와 구글 번역 기능은 옵션을 켜도 인터넷익스플로러에서는 동작하지 않습니다.
    인터넷 익스플로러 호환성을 위해 스킨에서 사용하는 자바스크립트 파일이 "script.js", "noiescript.js" 2개로 분리되었습니다. 2개 모두 업로드해야 합니다.
    인터넷 익스플로러11 지원



  2. 반응형 모바일 레이아웃 보기 강화 - "목록", "썸네일 한행에 1개", "썸네일 한행에 2개" 3가지 모드중 한가지를 선택해서 글 목록이 출력되도록 옵션 추가.
    모바일 글목록 타입 옵션


    데스크탑과 타블렛 레이아웃은 목록, 썸네일 한행에 2개, 썸네일 한행에 3개 지원.



  3. 검색 최적화 추가 지원 - 글목록의 이미지에 alt 속성에 글 제목이 표시되도록 개선되었습니다.
    글 목록 썸네일 alt 속성 값 표시



  4. 자동 목차 생성 기능 추가 - 글 안의 제목 스타일을 수집해 자동으로 다단 목차를 글 맨 위에 생성합니다.

    자동목차 생성 옵션

    자동 목차



  5. 사이드바 표시 구글 번역 기능 추가 - 다국어 번역 기능 지원. 인터넷 익스플로러 미지원. 인터넷 익스플로러 구형 엣지 브라우저 자체의 문제로 구글 번역 기능 미동작.
    사이드바 구글 번역 사용 옵션

    기본 구글 번역 기능
    깃발 아이콘으로 표시되는 구글 번역 기능(주요 9개 언어만 지원)


  6. 글링크, 내용 복사 기능 추가 - 글의 하이퍼링크 태그를 자동으로 복사해주는 기능 및 글 내용을 복사해 갈 수 있는 기능 버튼 추가 옵션 추가. 퍼가기를 허용하는 글 내용을 HTML, 또는 텍스트로 바로 퍼갈 수 있도록 기능 버튼을 표시할 수 있는 옵션이 추가 되었습니다.

    기능 버튼 옵션
    글 제목 옆에 HTML복사, 텍스트복사, 하이퍼링크복사 3가지 기능 버튼을 선택적으로 표시


  7. 스무스스크롤 구현 - 화면 스클롤을 할 때 우측 하단에 표시되는 페이지 탑으로 가기 버튼을 클릭하면 부드럽게 스크롤 되면서 페이지 탑으로 이동하는 옵션이 추가되었습니다. 인터넷 익스플로러는 미지원.


  8. 스크롤 인디케이터 지원 - 화면을 스크롤 할 때 어느 정도 스크롤 했는지 알 수 있도록 블로그 최상단에 스크롤 프로그레스바가 표시됩니다. 옵션으로 켜거나 끌 수 있습니다.

 

스크롤 프로그래스바 지원

 

그밖에 블로그 기능과는 관련이 없지만 사소한 버그 몇 가지가 패치되었습니다.

 

버전2의 주요 기능은 다음 글을 읽어보시기 바랍니다.

>티스토리 반응형 스킨 117 - 반응형 2단 심플리트3 버전2

 

 

반응형

Comments

  • ~~~~~~~~ 감사감사

  • 오래전부터 사용중입니다.
    웬만한 유료보다 훨씬 좋습니다.

  • 감사합니다. 잘 사용하겠습니다. !!

  • 소중한 스킨 감사합니다.
    카테고리가 많아질 경우 줄바꿈 되면서 다른 영역을 침범하게 되는데 고정이 아닌 가변형으로 수정하려면 어느 부분을 고쳐야 할까요?

    • 헤더 영역에 표시되는 카테고리가 멀티라인이 지원되도록 패치되었습니다.
      스킨을 다시 다운로드 받아서 재적용 해보시기 바랍니다.
      style.css 파일만 변경되었으므로 css만 재적용해도 됩니다.

    • 감사합니다.^^

      하나만 더 여쭤볼게요.^^;

      카테고리 태그의 적색 배경색이 너무 강한 것 같아 수정하고자 합니다.

      혹시 css의 어느 부분에 숨어 있을까요?
      쭉 훝어 봤는데 css초보라 찾기가 어렵네요.

    • 카테고리 태그라는게 사이드바의 태그를 말하는게 아닌가 싶은데...
      대부분이 스킨 색상은 옵션 설정에서 변경할 수 있습니다.
      스킨 옵션의 "색상" 섹션을 보시면 됩니다.

      117 스킨의 기본 적용 색상중

      진한 빨강으로 반전되어 채워진 색상은
      강조 반전 배경 색상/강조 반전 텍스트 색상 옵션의 색상을 변경하면 스킨 전체에 반전 색상으로 표시되는 항목들에 공통으로 변경됩니다.

      마우스 호버를 했을 때의 색상은 하이라이트/테마 색상을 변경하면 됩니다.

      태그의 태그 키워드 배경색도 하이라이트/테마 색상과 연동됩니다.

      태그 키워드 배경색이 마우스 호버되었을 때 배경 색상을 강제로 조정하고 싶으면
      skin.html의 168행의
      [샵샵_var_highlight-color_샵샵] 치환자를 원하는 실제 색상으로 대체하면 됩니다.

      background-color: [샵샵_var_highlight-color_샵샵];


  • 안녕하세요. 덕분에 블로그 하는 게 즐거워져서 너무 감사드립니다. 현재 이 블로그에 사용하고 계신 스킨이 너무 맘에 드는데 이것도 혹시 배포해주실 수 있으신가요?

    • 제 블로그의 스킨은 44 민트페이퍼를 불필요한 것을 다 걷어내고 쓰는 것입니다.
      구 스킨이고 스킨 개발 테스트용으로 수정해서 쓰는 것입니다.

      현재 v3 로 배포하는 117 스킨의 기능들을 모두 이식해서 v3버전으로 배포할 예정입니다.

  • 마고21동창회보(mago21.tistory.com)에 본 스킨을 적용시켜 봤습니다.
    상단 왼쪽 메뉴 가운데 'mail'을 클릭하니 '존재하지 않는 페이지입니다.'라는 메시지가 뜹니다.

    • 메일주소앞에 mailto: 를 덧붙여야 합니다.
      링크 클릭은 웹브라우저에 프로토콜 핸들러가 등록되어 있어야 동작합니다.
      일종이 기본 메일 서비스 등록 같은 것입니다.
      모바일에서는 링크를 클릭하면 메일앱이 실행됩니다.
      혼동이 있을 수 있을 것 같아 패치 스킨에는 mailto: 가 기본 입력되어 있도록 수정하겠습니다.

    • 또 배웠습니다.^^

    • 상단 페이스북, 메일 아이콘
      색상을 바꾸고 싶습니다.

    • style.css 에서 facebook 을 검색하면
      facebook
      facebook-square
      클래스 2개가 나옵니다.
      속성으로

      color: #a00;

      처럼 컬러 속성을 추가해주면 아이콘 색상이 변경됩니다.

      스킨 원본기준으로는 2879행에 있습니다.

    • 감사합니다.

  • 익명 2021.06.08 13:20 댓글주소 수정/삭제 댓글쓰기

    비밀댓글입니다

  • 스킨이 너무 좋은데
    커버에 리스트말고 다른커버를 추가해주실 순 없을까요?

    • 추가하는건 어려운게 아닐텐데 커버 쓰는 사용자가 극소수입니다. 커버를 따로 씌울수 있는 방법을 찾아보겠습니다.

  • 그래도 커버가 알고보면 꽤 쓸모있고 블로그의 첫화면을 장식해주는데...

  • 안녕하세요. 좋은 스킨 배포해주셔서 정말 감사합니다. 그런데 문제점이 하나 있더라구요. 유튜브 링크 넣으면 모바일에서 영상이 안뜨네요. pc에서는 뜨는데 모바일 에서는 공백으로만 나옵니다. 이것만 해결되면 정말 완벽한것 같아요.

    • 스킨은 글 내용에 관여하지 않습니다.

      티스토리 에디터의 유튜브 영상 붙여넣기, 또는 유튜브의 아이프레임 방식 링크 붙여넣기 모두 티스토리에서 잘 적용되고 모바일에서도 잘 재생됩니다.(해당 스킨 포함)

      유튜브 링크를 어떤 방식으로 붙여넣었는지 모르겠는데 잘못 붙여넣으신 것으로 보입니다.

    • 아 그래요 ?? ^^ 스킨변경후에 영상링크를 넣은게 아니라 , 기존 포스팅에 있던 영상들이 스킨변경하고 보니 다 뜨지 않아서요. 다시 한번 해볼게요.

    • 스킨 적용후에 영상이 표시가 안되는 블로그 url 을 알려주세요 확인해보겠습니다.

    • 익명 2022.08.03 18:36 댓글주소 수정/삭제

      비밀댓글입니다

    • 저는 잘보입니다.
      원격기기에서도 확인해봤는데 문제없이 블로그 안에 있는 모든 유튜브 영상 나옵니다.
      윈도우용 크롬, 파이어폭스 엣지, 맥 사파리, 아이패드 사파리, 크롬 확인해봤습니다.

      웹 브라우저 캐시를 한번 소거해보시기 바랍니다.
      캐시가 남은 경우 이전 스킨 데이터로 인해 블로그가 정상적으로 보이지 않는 경우가 있습니다.

      앞서 말씀드린대로 스킨단에서는 글 내용에 대해 특별히 건드릴 일이 없습니다.





❌ 닫기