티스토리 스킨 | JB SKIN 157

40,000

  • 티스토리 반응형 스킨
  • 버전 : 0.1.0
  • 최근 업그레이드 : 2018.03.07
  • 데모 블로그
카테고리:

설명

특징

반응형 웹 디자인

  • 반응형 웹 디자인으로, 접속하는 기기의 웹브라우저의 크기에 맞게 레이아웃이 변합니다.
  • PC와 모바일에서 디자인의 일관성을 유지할 수 있습니다.
  • 유튜브 동영상을 반응형으로 삽입할 수 있는 기능을 포함하고 있습니다.

쉬운 애드센스 광고 삽입

  • 본문 상단 오른쪽, 본문 하단 등에 반응형 애드센스 광고를 쉽게 넣을 수 있습니다.
  • 본문 중간에 광고를 게재할 수 있는 도구를 포함하고 있습니다.

IE 호환성

  • IE9 이상에서는 반응형으로 작동합니다.
  • IE8에서는 고정폭으로 나옵니다. (IE의 요소 검사 기능으로 확인한 것으로, IE8로 접속하면 다르게 보일 수 있습니다.)

지원

  • 스킨 수정에 대한 지원은 공식적으로 하지 않습니다. 단, 간단하게 해결할 수 있는 것은 도와드립니다.
  • 문의는 이메일로 해주세요.

업그레이드

  • 스킨을 업그레이드하면 메일로 알려드립니다. 추가 비용 없이 최신 버전을 사용하실 수 있습니다.
  • 업그레이드한 스킨은 이전 버전과 디자인, 기능이 달라질 수 있습니다.

라이센스

  • 구입하신 스킨은 한 개의 티스토리 계정에 사용하실 수 있습니다. 즉, 티스토리 계정 한 개로 만들 수 있는 블로그에는 다 사용하실 수 있습니다.
  • 여러 계정에 사용하시려면 계정의 개수만큼 구입하셔야 합니다.
  • 팀블로그의 경우 팀블로그 개설자만 구입하시면 됩니다.
  • 구입하신 스킨을 판매, 양도, 대여, 배포하시면 안됩니다.
  • 구입하신 스킨을 수정하여도 판매, 양도, 대여, 배포하시면 안됩니다.

교환/반품/환불 불가

  • 티스토리 스킨은 디지털 파일이므로 복제가 가능하여 교환/반품/환불이 되지 않습니다.
  • 각 스킨마다 데모 블로그가 있으니 충분히 살펴보고 주문하시기 바랍니다.

설명서

스킨 등록

티스토리 관리자에서 스킨을 등록합니다. (스킨 등록하는 방법)

설정

모바일웹 연결 설정

[꾸미기 – 모바일]에서 티스토리 모바일웹 자동 연결을 [사용하지 않습니다.]로 설정한 후 [변경사항 저장]을 클릭합니다.

화면 출력 설정

[꾸미기 – 스킨 편집]을 클릭합니다.

  • [홈 화면 꾸미기]를 [사용 안함]을 설정합니다.
  • [홈 화면 글 수]를 정합니다. 첫화면에 그 개수만큼 글이 표시됩니다.
  • [글 목록 글 수]를 정합니다. 카테고리, 태그 등을 클릭했을 때 그 개수만큼 글이 표시됩니다.
  • [글 목록 형태]는 [목록+내용]으로 설정합니다.
  • 설정을 마쳤으면 오른쪽 위의 [저장]을 클릭합니다.

블로그 아이콘 표시 플러그인 비활성화

[플러그인 설정]에서 블로그 아이콘 표시 플러그인을 비활성화합니다.

스킨 수정하는 방법

티스토리 강좌 | 스킨 수정하는 방법을 참고하세요.

상단 배경 이미지 변경하는 방법

상단 배경 이미지는 CSS에 있는 다음의 코드로 만듭니다.

배경 이미지를 변경하고 싶다면, 배경으로 사용할 이미지를 [파일 업로드]에서 업로드한 후, jb-background-header-02.jpg를 업로드한 이미지 이름으로 바꾸면 됩니다.

참고로, 블로그 가로폭은 768px이고, 글자가 밝은 색이므로 어두운 색의 이미지를 사용하는 게 좋습니다.

메뉴

상단 메뉴는 블로그 메뉴입니다. [꾸미기 – 메뉴]에서 메뉴를 구성하세요.

SNS 공유하기

본문 밑에 현재 포스트를 SNS에 공유하는 기능을 포함하고 있습니다.

사용하고 싶지 않다면 [꾸미기 – 사이드바]에서 SNS Share 모듈을 제거합니다.

최근 글 목록 썸네일

HTML에 다음과 같은 코드가 있습니다.

1을 0으로 바꾸면 최근 글 목록에 썸네일이 나옵니다. (스크립트를 이용하는 것이어서, 글 개수가 많으면 속도가 느려질 수 있습니다.)

애드센스

애드센스 광고를 쉽게 넣을 수 있도록 만든 것일 뿐, 애드센스 정책을 위반하지 않는다는 보장을 하지는 않습니다. 사용자 본인의 책임 하에 활용하셔야 합니다.

사이드바를 이용한 광고 게재

[플러그인]에서 [배너 출력] 플러그인을 활성화합니다.

[꾸미기 – 사이드바]에 다음처럼 애드센스 광고 게재를 위한 사이드바가 있습니다.

광고 위치는 다음과 같습니다.

  • AdSense CTR : PC에서는 본문 상단 오른쪽, 모바일에서는 본문 상단에 나옵니다.

AdSense CT, AdSense CTR, AdSense CB 모듈은 빈 모듈입니다. [-] 버튼을 클릭해서 제거한 후 광고를 넣으세요. (광고를 안 넣어도 제거하시는 게 좋습니다.)

[HTML 배너출력]을 원하는 곳으로 드래그한 후, [편집]을 클릭하여 반응형 애드센스 광고 코드를 넣습니다.

본문 중간에 광고 넣기

콘텐츠 내 자동 삽입 광고를 만드세요.

광고 코드에서 <ins>…</ins> 부분만 줄바꿈을 없앤 후, HTML에 있는 다음 코드에서 작은 따옴표 안에 있는 코드를 자신의 광고 코드로 바꾸세요.

글 작성/수정 화면에서 HTML 모드로 들어간 후, 적당한 곳에 다음의 코드를 넣으면, 그 자리에 콘텐츠 내 자동 삽입 광고가 나옵니다.

코드를 여러 번 넣으면, 코드를 넣은 곳마다 광고가 나옵니다.

반응형 유튜브

수동

유튜브 동영상을 iframe으로 넣을 때, iframe을 다음처럼 div로 한번 감싸면 16:9 비율을 유지하면서 본문 가로 크기에 맞게 영상 크기가 변합니다.

만약 4:3 비율의 영상이라면 다음처럼 합니다.

자동

스킨에는 유튜브 동영상이 있으면 자동으로 16:9 비율을 유지한 채 영상 크기가 본문 가로 크기에 맞게 변하도록 하는 기능을 포함하고 있습니다.

만약 이 기능을 해제하고 싶다면, HTML에 있는 다음의 코드에서

yes를 no로 바꾸세요.

이 글을 공유하기

상호 : 제이비 팩토리 사업자등록번호 : 189-03-00944 대표 : 주재범 TEL : 031-388-9261(874) (문의는 메일로 해주세요.) E-MAIL : jb.jbfactory@gmail.com 주소 : 경기도 안양시 동안구 시민대로 230, D동 874호 통신판매업신고번호 : 제2017-안양동안-0574호 사업자정보공개 호스팅서비스 : (주)가비아 구매안전서비스 : (주)케이지이니시스 이용약관 개인정보처리방침