티스토리 글쓰는데만 집중하세요! – 티스토리 무료 스킨 [fi스킨]

스킨 특징 및 장점 소개

itcider에서 무료로 fast itcider 스킨을 배포합니다. (티스토리 FI스킨)

FI스킨은 사용자와 티스토리 관리자를 위한 최고의 스킨입니다.

사용자를 위한 편의와 티스토리 관리자를 위한 편의를 모두 고려하였습니다. 빠르고, 설정하기 쉽습니다.

FI스킨은 3가지 목적으로 만들어졌습니다. 사용자의 편의와 빠른 로딩, 코딩을 몰라도 쉽게 설정할 수 있는 티스토리 무료 스킨이 그 목적입니다.

1. 사용자의 편의

FI스킨이 제일 중시하는 것입니다. 사용자의 편의를 중점적으로 스킨을 편집하고 제작하였습니다.

# 깔끔한 ui와 다크 모드



PC든 모바일이든 사용자가 사용하기에 직관적인 토글바 ui와 검색 아이콘을 탑재하였습니다. 컴퓨터를 잘 모르더라도, 웹 페이지에 대해서 잘 모르더라도 쉽게 사용할 수 있어야 합니다.

독자의 눈이 피곤하지 않도록 다크 모드 또한 지원합니다.

# 쉬운 공유와 링크 복사



더불어 사용자가 좋은 글을 발견하였을때 사용하기 좋은 복사하기와 공유하기 버튼이 기본적으로 탑재되어있습니다. 당연히 글 상단으로 바로 가는 버튼은 덤이고요.

# 사용자가 편한 자동 목차



자동 목차와 상단 그라데이션은 사용자가 글을 읽기에 전체적인 내용을 빠르게 이해하는데 도움을 줍니다.

2. 빠른 스킨

FI스킨이라는 이름에도 담겨있듯이, fast라는 단어는 FI스킨을 잘 나타냅니다.








일반적인 티스토리 스킨보다 점수가 높은 편입니다. 최대한 성능을 최적화하고자 하였으며, 더 빠른 스킨 로드를 위해서 포트폴리오 스킨을 개선하였습니다.

3. 코딩을 몰라도 되는 FI스킨

FI스킨은 티스토리를 처음 접하시는 분들이 사용하기 편하게 만들었습니다. 코딩을 몰라도 자신의 티스토리에 적용하고자하는 대부분의 기능이 이미 적용되어 있기 때문입니다. 아래 옵션들처럼 쉽게 기능을 켜고 끌 수 있습니다.

FI스킨 특징들

기능을 한 번 살펴보세요!



# 1 코딩이 필요없는 구글과 네이버 사이트 인증으로 쉽게 웹사이트를 등록할 수 있어요


# 2 블로그가 작동되지 않을때 사용하는 블로그 업데이트 기능으로 문제가 생겼을 때도 해결할 수 있어요


# 3 블로거에게 중요한 자동 광고 기능이 있어요.


# 4 우클릭 방지와 개발자 도구를 차단하는 옵션을 통해서 무단 복사를 막을 수 있어요

# 5 복사 시에도 자동으로 출처와 경고 문구가 표기되어서 무단 복사를 한 번 더 막을 수 있어요

# 6 도메인을 쓰시는 분들에게는 수익을 높이기 위해서 url 리다이렉트와 불필요한 링크 부분 삭제를 지원해요

# 7 눈이 편한 다크 모드를 지원해서 사용자가 편해요




# 8 검색창 설정과 배열도 내 마음대로 설정할 수 있어요

# 9 목차 설정과 목차 그라데이션도 쉽게 적용할 수 있어요!

# 10 목차 위와 아래에도 배너를 달 수 있어요



# 11 메인 페이지에서의 내용도 마음대로 켜고 끌 수 있어요

# 12 댓글창을 사용하고 싶지 않다면 댓글창을 끌 수 있어요

# 13 방명록이 필요없다면 방명록도 끌 수 있어요



# 14 더 빠른 로딩을 위해서 썸네일 기능 대신에 상단 그라데이션을 사용할 수 있어요

# 15 썸네일이 더 좋으시다면 썸네일도 가능해요!



# 16 제목 태그를 쉽게 꾸밀 수 있어요.


# 17 사용자에게 매우 유용한 도구 버튼들이 양 옆에 있어요


# 18 사이드바의 설정들과 메뉴들도 쉽게 끄거나 켤 수 있어요


# 19 스킨 하단의 카피라이트 문구를 켜고 끌 수 있어요!

# 20 스킨 하단의 카피라이트 문구를 블로그 주인이 원하는대로 선택할 수 있어요!

fast itcider 스킨을 사용하신다면 필요하신 것은 오직 가치있는 글과 사진 뿐입니다.
다른 것은 걱정하지 않으셔도 됩니다. 원하는 옵션들의 대부분이 Fi스킨에 있습니다.

스킨 적용 예시

https://fastitcider.tistory.com/

에서 보실 수 있습니다.

fi스킨의 기본 설정대로 설정되었습니다.

현재 itcider은 워드프레스용 wi theme를 사용중입니다.

스킨 업데이트 내역

fi스킨 v1

v1.0 fast itcider스킨 1차 배포

v1.1 jsdelivr 사용 티스토리 설정 개인화

v1.2 목차 설정 추가

fi스킨 v2

v2.0 티스토리 설정 옵션 변경 및 ui개선

v2.1 옵션 정렬 및 기본 설정값 설정

v2.2 썸네일 관련 속도 최적화 및 기능 업데이트 +영어버전 생성

fi스킨 v3 (v3부터 코드의 수정 가능)

v3.0 속도 개선 및 seo개선, 오류 수정, 디자인 변경 +영어버전 업데이트

v3.1 배너 기능, 그라데이션 및 화면 크기 설정 추가, 목차 기능 업그레이드, 복사 오류 수정, 관련글 및 메인 페이지 이미지 지연로드 적용, width 및 height적용

fi스킨 v4

v4.0 그라데이션 설정 간소화, seo개선, 본문 배너 기능 추가

v4.1 댓글 및 게시판 창, 버튼 둥글게 적용, jquery 수정 옵션 추가, 게시판 켜고 끌 수 있도록 변경

v4.2 fi스킨 seo 개선

fi스킨 v4.3 업데이트 (seo및 기능 개선)

fi스킨 v4.4 업데이트 (도구 아이콘 업그레이드 및 ui개선)

v4.5 이미지 로드 오류 해결, 주석 및 코드 간결화

fi스킨 v5.0

fi스킨 v5.0은 다크 모드가 추가되었습니다.

fi스킨 v5.1

fi스킨 v5.1은 다크 모드와 라이트 모드가 업그레이드되었으며, 목차를 자동 활성화하였습니다.

fi스킨 v5.2

fi스킨 v5.2는 다크 모드가 개선되었으며, 사용자의 편의가 개선되었습니다.

fi스킨 v5.3

fi스킨 v5.3은 다크 모드가 소폭 개선되었으며, 스킨 기본 옵션 관련해서 수정이 발생하였습니다.

fi스킨 v5.4

fi스킨 v5.4는 ie차단 페이지 관련 설정 및 데모 이미지가 업그레이드되었습니다. ie의 06월 15일 지원 종료와 함께 다른 브라우저 설치 유도 페이지로의 설정 옵션이 추가되었습니다.

fi스킨 v6.0

Fi스킨 6에서 이미지 로더 오류가 수정되었습니다.

fi스킨 v6.1

Fi스킨 6.1에서 seo가 개선되었습니다.

fi스킨 v7.0

Fi스킨 7.0에서 콘솔 오류와 web share 기능이 개선되었습니다.

fi스킨 v7.1

Fi스킨 7.1에서 seo 기능이 개선되었습니다.

fi스킨 v7.2

Fi스킨 7.2에서 cls가 개선되었습니다.

fi스킨 v7.3

Fi스킨 7.3에서 디자인이 대폭 개선되었습니다.

fi스킨 v7.4

Fi스킨 7.4에서 디자인 개선 및 대댓글 기능 활성화, breadscrumbs 기능이 추가되었습니다.

fi스킨 v7.5

Fi스킨 7.5에서 상단바 플로팅과 ux개선이 이루어졌습니다.

fi스킨 v7.6

Fi스킨 7.6에서 로딩바 개선과 수정시간 정보 추가 업데이트가 이루어졌습니다.

fi스킨 v7.7

Fi스킨 7.7에서 관리자 창 사용성 증대, 제목 꾸미기, 디자인 개선이 이루어졌습니다.

Fi스킨 7.7은 초기화 없이 업그레이드가 불가합니다.

fi스킨 v7.8

Fi스킨 7.8에서 댓글 및 방명록 디자인 개선, 관리자 설정 개선이 이루어졌습니다.

Fi스킨 7.8은 초기화 없이 업그레이드가 불가합니다.

fi스킨 v8.0

Fi스킨 8.0에서 자동 광고 및 자동 alt등의 기능이 추가되었습니다.

fi스킨 v8.1

Fi스킨 8.1에서 디자인 패치가 적용되었습니다..

fi스킨 v8.2

Fi스킨 8.2에서 댓글 디자인 패치가 적용되었습니다.

fi스킨 v9.0

Fi스킨 9.0에서 디자인 개선 및 리스트 기능이 추가되었습니다.

fi스킨 관련 보안 및 기타 개선 문의나 스킨 문의는 아래 댓글이나 sns로 문의주시길 바랍니다.

스킨 다운로드

아래의 링크에서 스킨을 다운로드하실 경우 itcider license에 동의하신 것으로 간주됩니다.

바로 다운로드하는 링크 ) https://github.com/itcider/fast_itcider/raw/main/fast-itciderv9-0.zip

깃헙 레포지토리 => 최신 버전을 보실 수 있습니다. ) https://github.com/itcider/fast_itcider

모든 Fi스킨 버전 링크 ) https://fi.itcider.com

스킨 다운로드 (영문판)


Fi스킨 영문판은 지원이 종료되었습니다. 그동안 애용해주신 모든 분께 감사의 말씀을 전하고자 합니다.

Fi스킨으로 변경하는 방법

다른 스킨 -> Fi스킨으로 업그레이드하기

fi스킨 설정 #0_1 fi스킨으로 변경하기

Fi스킨 -> Fi스킨으로 업그레이드하기 (중급자용)

Fi스킨 초기화 없이 업그레이드하는 방법

fast itcider 스킨 설정 방법 및 설정 팁들

Fi스킨 공식 문서는 아래 링크에서 보실 수 있습니다.

Fi스킨 설정 문서 모음

라이선스 및 사용 조건

 재배포 및 코드의 무단 사용이 불가하며, 주석 삭제 및 수정이 불가합니다. fi스킨의 문구(fi스킨 by itcider.com)는 삭제 불가합니다. itcider skin license를 위반하는 블로그는 fi스킨을 사용할 수 없습니다

fi 스킨의 라이선스는 itcider skin license를 따릅니다.

itcider skin license

이미지는 itcider image license를 따릅니다.

itcider image license

참조 소스 출처 및 제작자, 기여자

스킨 제작자

fi 스킨의 제작자는 itcider입니다. 원본 스킨(티스토리 포트폴리오)의 소유자는 tistory입니다. itcider가 수정하거나 추가한 소스나 리소스의 소유권 및 권리는 itcider에 있습니다.

오픈소스나 타 소스는 소스 개발자에게 권리가 있습니다.

위 코드를 공유해주신 모든 분들께 이 자리를 빌어 감사의 말을 전하고자 합니다.

위 코드 덕분에 사용자와 관리자 모두를 위한 Fi스킨이 탄생하고 발전할 수 있었습니다.

진심으로 감사합니다.

티스토리 포트폴리오 스킨

https://www.tistory.com/skin/xf_Portfolio

web share api

https://blog.naver.com/PostView.nhn?blogId=zgabriel&logNo=221846990627

https://wooncloud.tistory.com/12

css 및 메뉴얼

https://developer.mozilla.org

https://stackoverflow.com/

lazyload

https://marshallku.com/web/tips/%ED%8B%B0%EC%8A%A4%ED%86%A0%EB%A6%AC%EC%97%90%EC%84%9C-lazy-load-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0

https://blogpack.tistory.com/817

이미지 리소스

https://itcider.com/(itcider 자체 제작 이미지 포함)

(fi스킨 4.4이후부터 아래의 아이콘은 사용하지 않습니다.)

https://pixabay.com/vectors/hexagon-symbol-gui-internet-2307352/

https://pixabay.com/vectors/link-hyperlink-chain-linking-6931554/

티스토리 치환자

https://tistory.github.io/document-tistory-skin/common/basic.html

우클릭 및 저작권 보호

https://gist.github.com/ab-c-d/7aa98987589466eee696952e154c98e1

jquery 목차

https://www.codingfactory.net/12114

다크 모드 참고

https://aistudy9314.tistory.com/15

breadcrumbs 참고

https://avada.tistory.com/1847

티스토리 플로팅 바

https://velog.io/@kimheewon/%EC%8A%A4%ED%81%AC%EB%A1%A4-%EA%B0%90%EC%A7%80%ED%95%98%EC%97%AC-%ED%97%A4%EB%8D%94-%EB%B3%B4%EC%9D%B4%EA%B1%B0%EB%82%98-%EC%88%A8%EA%B8%B0%EA%B8%B0

https://webdir.tistory.com/481

티스토리 수정시간 참고

https://tonks.tistory.com/122

https://www.codingfactory.net/10686

로딩바

https://github.com/tobiasahlin/SpinKit

자동 광고 기능

https://sangminem.tistory.com/699

https://sangminem.tistory.com/305

애드센스 재로딩 기능

https://sangminem.tistory.com/575

자동 alt 삽입 기능

https://sangminem.tistory.com/376

fi스킨 기여자 (라이브블로거님, pagekr님)

https://urliveblogger.blogspot.com/

https://pagekr.com/

https://pagekr.net/

Fi스킨과 비슷한 워드프레스 테마도 궁금하신가요?

itcider가 만든 블로그스팟(구글 블로그)용 테마도 구경하고 가세요!

5개의 댓글들이 있습니다. “티스토리 글쓰는데만 집중하세요! – 티스토리 무료 스킨 [fi스킨]”

  1. 스킨 등록하고 사용해보려하는데요
    저는 우측에 카테고리 목록이랑 최신댓글 같은
    이런 것들이 없네요.
    우측 상단에 세줄 작대기에 카테고리가
    포함되어있던데 이걸 지금 관리자님 홈페이지처럼
    화면 우측에 노출시키려면 어떤 메뉴를 만져야하는지요?
    아무리 살펴봐도 모르겠습니다 ㅠㅠ;

    응답
    • 안녕하세요 잇G님.
      소중한 댓글 감사합니다.

      말씀해주신 부분은 현재 댓글을 남겨주신 웹사이트인 https://itcider.com에서의 사이드바를 말씀해주시는 것 같습니다.
      현재 보고 계신 웹사이트는 워드프레스로 만들어졌으며, itcider에서 제작한 Wi theme가 적용되었습니다. 따라서 티스토리에서는 동일한 스킨이 존재하지 않습니다.

      말씀해주신 itcider에서 만든 Fi스킨에서의 사이드바는, 우상단의 토글바에서(작대기 3개) 클릭을 할 경우, 나오는 부분을 사이드바라고 지칭합니다.
      이 부분은 티스토리 설정에서 [사이드바] 부분에서 설정이 가능합니다.
      https://itcider.com/953/

      응답
  2. fi 8.1 스킨을 적용하고
    스킨편집에서 사이드바 설정을 모두 활성화 해도
    사이드바가 활성화되지가 않습니다 ㅠㅠ

    우측상단에 세줄표시에
    카테고리 메뉴들이 들어가있네요
    이걸 우측 사이드바에 표시되도록
    어떻게해야할까요?

    스킨편집메뉴에 있는 설정들을 하나씩 다 꺼보고
    켜보고 테스트해봐도 안되네요 ㅠ;

    응답
  3. 스킨 편집에 있는 광고 2개 사용하기가 혹시 어떤 기능인지 여쭤봐도 되겠습니까. 전면 광고가 2개 나온다는 말씀이신가용?

    응답
    • 안녕하세요
      소중한 댓글 감사합니다!

      스킨 편집에 있는 광고 2개 사용하기는 데스크톱만 왼쪽 오른쪽으로 광고가 각각 1개씩 총 2개가 삽입되는 기능입니다.
      왼쪽 50 / 오른쪽 50과 같이 글 화면에 광고를 송출하는 기능입니다.

      좋은 하루 보내세요~!

      감사합니다.

      응답

댓글 남기기