User Guide
5-1. 글에 사용된 이미지의 별도 여백 설정하기
2020.01.12티스토리 반응형 스킨, 프라치노 공간은 블로그 글에 사용된 일부 이미지의 여백을 다르게 설정할 수 있습니다. 글을 편집할 때 원하는 이미지의 치환자를 찾아 짧은 코드를 편집하면 됩니다. 별도 여백을 설정할 이미지는 그룹화되지 않고, 가운데 정렬이어야 합니다. 글을 편집할 때 HTML 모드로 전환하고, 원하는 이미지의 치환자를 찾아보세요. 치환자는 아래와 비슷합니다: [##Image|kage@filepath/img.jpg|alignCenter|data-filename="img.jpg" data-origin-width="xxxx" data-origin-height="yyyy"|||##] 해당 치환자에서 alignCenter를 자신이 원하는 별도 여백의 코드로 대치하여 사용합니다. 대치 가능한 코드는 두 가지..
5. 글 별로 다른 모드 설정하기
2019.07.22티스토리 반응형 스킨, 프라치노 공간은 스킨의 전반적인 분위기나 글 목록의 모양새, 대표 커버 이미지 등을 글 별로 다르게 설정할 수 있습니다. 글을 편집할 때 원하는 기능의 코드를 추가하기만 하면 됩니다. 글을 편집할 때 HTML 모드로 전환하고, 글 맨 아래 줄에 아래의 코드를 추가하세요: fraccino-function을 자신이 원하는 기능의 코드로 대치하여 사용합니다. 대치 가능한 코드는 여러가지며, 아래부터는 대치하여 사용 가능한 코드를 설명합니다. 일반 스킨의 전반적인 분위기를 변경할 수 있습니다. fraccino-setas-day는 스킨의 분위기를 낮으로 설정합니다. fraccino-setas-dawn은 스킨의 분위기를 노을로 설정합니다. fraccino-setas-night는 스킨의 분위기..
4. 블로그 첫 페이지에 커버 설정하기
2019.07.22티스토리는 블로그의 첫 페이지를 꾸밀 수 있는 커버 기능을 제공합니다. 티스토리 반응형 스킨, 프라치노 공간은 커버를 완전하게 지원하며 다양한 종류의 커버를 사용하여 첫 페이지를 꾸밀 수 있습니다. 커버는 블로그 관리 페이지에서 ‘스킨 편집’으로 이동하고, ‘홈 설정’ 항목을 ‘최신 글’에서 ‘커버’로 바꾸면 설정됩니다. 원하는 커버 아이템을 추가하거나 삭제하여 첫 페이지를 꾸밀 수 있습니다. 스킨에 지원되는 커버 아이템은 아래와 같습니다: 사용자화한 콘텐츠가 적용된 첫 페이지 슬라이드형 꽉 찬 슬라이드형 3가지 크기의 갤러리형 포스터형 카드형 텍스트형 1. 사용자화한 콘텐츠가 적용된 첫 페이지 이 커버 아이템은 ‘홈 설정’ 항목이 ‘최신 글’로 설정되었을 때 첫 페이지의 느낌에 목록 구성만 달리 설정하..
3-16. 블로그에 사업자 정보 표시하기
2019.07.22티스토리 반응형 스킨, 프라치노 공간은 페이지의 맨 하단에 사업자 정보를 표시할 수 있습니다. 이것은 기업을 위한 블로그를 운영할 때 사용될 수 있습니다. 블로그 관리 페이지에서 ‘스킨 편집’으로 이동하고, ‘사업자 정보’ 항목을 살펴보세요. ‘사업자 정보’ 항목에는 다음과 같은 속성이 있습니다: 상호명 대표자 성명 주소 전화번호 이메일 사업자등록번호 통신판매신고번호 사이버몰 이용약관 URL 사업자 정보 표시하기 사업자 정보를 표시하려면 사업자등록번호가 입력되어 있어야 합니다. 각 속성에 발급된 사업자등록증과 통신판매업신고증의 내용을 입력하세요.
3-15-1. 스킨과 어울리는 애드센스의 스타일
2019.07.22티스토리 반응형 스킨, 프라치노 공간은 낮이나 노을, 밤의 전반적인 컬러를 바꿀 수 있습니다. 컬러를 설정했고 구글 애드센스(Google AdSense)를 사용한다면 스킨과의 조화를 위해 애드센스도 해당 컬러에 맞추어 설정해야 합니다. 각 모양새에 따른 설정값을 알아봅시다. 컬러가 낮일 때 스킨의 컬러를 낮으로 설정했다면 애드센스의 스타일은 아래와 같이 설정합니다. 테두리: #f4f4f4 텍스트: #222222 제목 / 링크: #349aff URL: #666666 배경: #f4f4f4 글꼴: 최적화 컬러가 노을일 때 스킨의 컬러를 노을로 설정했다면 애드센스의 스타일은 아래와 같이 설정합니다. 테두리: #e3d9cc 텍스트: #22201e 제목 / 링크: #2284d9 URL: #5b5752 배경: #e3..
3-15. 구글 애드센스 광고 설정하기
2019.07.22티스토리 반응형 스킨, 프라치노 공간은 구글 애드센스(Google AdSense) 광고를 간편하게 설정할 수 있는 방법을 제공합니다. 여기서는 프라치노 공간을 사용할 때 구글 에드센스 설정 방법 두 가지를 알아봅니다. 티스토리 내에서 사용할 수 있는 애드센스 광고는 ‘자동 광고’와 ‘텍스트 및 디스플레이 광고’, ‘일치하는 콘텐츠’입니다. ‘자동 광고’는 스킨 내에서 설정 가능하며, ‘텍스트 및 디스플레이 광고’와 ‘일치하는 콘텐츠’는 티스토리 플러그인을 통하여 설정 가능합니다. 1. 자동 광고 설정하기 구글 애드센스 페이지에서 ‘광고 - 자동 광고’로 이동하여 자동 광고를 설정합니다. 되도록이면 URL 그룹을 생성하여 사이트별로 광고를 설정할 것을 권장합니다. 참고로 ‘자동 광고 설정’ 링크를 클릭하면..
3-14. 네이버 이웃 버튼 설정하기
2019.07.22네이버 블로그는 티스토리의 ‘구독’과 비슷한 ‘네이버 이웃’ 기능을 제공합니다. ‘네이버 이웃’은 네이버 자사의 블로그뿐만 아니라 티스토리 등의 타사 블로그도 될 수 있으며, 이는 네이버 블로그 사용자도 티스토리 블로그의 최신 글을 확인할 수 있다는 것을 의미합니다. 티스토리 반응형 스킨, 프라치노 공간은 네이버 이웃 기능을 사용할 수 있습니다. 이 기능을 사용하면 여러분의 블로그에 네이버 이웃 맺기 버튼이 표시됩니다. 사전 작업하기 이제 여러분의 블로그에 네이버 이웃 맺기 버튼을 만들어 봅시다. 참, 시작하기 전에 준비해야 할 것이 있습니다. 네이버 블로그 설정 페이지로 이동해야 합니다. URL은 아래와 같으며 username은 여러분의 네이버 ID로 대치합니다. 네이버 계정이 없다면 먼저 계정을 생성..
3-13. SEO의 기본, 메타 태그 설정하기
2019.07.22HTML의 요소 중 하나인 메타(meta) 태그는 사이트의 정보가 포함되어 있는 태그로, 네이버(Naver), 구글(Google), 빙(Bing) 등의 검색 엔진은 메타 태그를 통하여 사이트의 정보를 알아냅니다. 검색 엔진은 고유의 검색 로봇이 있는데 사이트 검색을 돕기 위해 네이버 서치 어드바이저(Naver Search Advisor), 구글 서치 콘솔(Google Search Console) 등 엔진별로 도구가 제공되고 있습니다. 이때에도 사이트를 식별하기 위해 메타 태그가 사용됩니다. 네이버 블로그 등의 국내 블로그 서비스와는 달리 티스토리는 스킨의 HTML을 편집할 수 있고 메타 태그를 입력할 수 있습니다. 그렇기 때문에 티스토리 블로그는 다양한 검색 엔진 도구 등록, 다시 말해 사이트를 검색 엔..
3-12. 블로그 정보의 배경 설정하기
2019.07.22블로그 정보의 배경은 오른쪽 사이드바(사이드바 2: 블로그 정보 메뉴)에 고정된 맨 첫 번째에 보이는 블로그 정보 영역의 배경을 의미합니다. 블로그 정보 영역은 오른쪽 사이드바에 항상 표시됩니다. 티스토리 반응형 스킨, 프라치노 공간은 이 영역의 배경을 손쉽게 설정할 수 있습니다. 블로그 관리 페이지에서 ‘스킨 편집’으로 이동하고, ‘블로그 정보의 배경 (Jacket)’ 항목을 살펴보세요. ‘블로그 정보의 배경 (Jacket)’ 항목에는 다음과 같은 속성이 있습니다: 배경 컬러 배경 이미지 1·2. 배경 컬러 & 이미지 블로그 정보의 배경 컬러와 이미지를 설정할 수 있습니다. 컬러값을 지정하면 검은색의 배경이 입력된 컬러로 변경됩니다. 이미지를 업로드하여 배경을 설정할 수도 있습니다. 이때 업로드할 이미..
3-11. 사이드바의 일부 기능 설정하기
2019.07.22티스토리 반응형 스킨, 프라치노 공간은 사이드바의 기능을 켜거나 일부 모듈의 기능을 변경할 수 있습니다. 블로그 관리 페이지에서 ‘스킨 편집’으로 이동하고, ‘사이드바’ 항목을 살펴보세요. 사이드바 모듈을 설정하는 방법을 찾는다면 ‘사이드바 모듈 설정하기’ 가이드를 참조하세요. ‘사이드바’ 항목에는 다음과 같은 속성이 있습니다: 최근/인기 글 모듈 모드 첫 페이지로 이동 버튼 하위 카테고리 접기 공지 전체 보기 버튼 태그 전체 보기 버튼 1. 최근/인기 글 모듈 모드 ‘최근 글’과 ‘인기 글’ 모듈의 항목에 미리보기 이미지를 보이게 할 수 있습니다. 2. 첫 페이지로 이동 버튼 왼쪽 사이드바(사이드바 1: 일반 메뉴)의 맨 위에 집 모양의 아이콘으로 된 ’첫 페이지로 이동’ 버튼을 표시합니다. 3. 하위..
3-10. 고정형 사이드바의 블로그 로고 설정하기
2019.07.22프라치노 공간은 고정형 사이드바의 상단 영역 또한 자신의 로고 이미지로 표시할 수 있습니다. 블로그 관리 페이지에서 ‘스킨 편집’으로 이동하고, ‘고정형 사이드바 영역의 블로그 로고’ 항목을 살펴보세요. 이 항목에는 총 3가지 모드의 로고 이미지를 업로드할 수 있습니다: 기본 블로그 로고 이미지 노을 모드일 때 블로그 로고 이미지 밤 모드일 때 블로그 로고 이미지 1. 기본 블로그 로고 이미지 블로그 제목 영역에 블로그 로고를 표시하려면 이 속성에는 무조건 이미지가 업로드되어야 합니다. 업로드할 이미지는 최소 너비 1000픽셀 이상, 정사각형 비율의 투명도 지원 PNG 이미지를 권장합니다. 2·3. 노을, 밤 모드일 때 블로그 로고 이미지 프라치노 공간은 기본 모드인 ‘낮 모드’와 함께 ‘노을 모드’, ..
3-9. 고정형 사이드바 설정하기
2019.07.22티스토리 반응형 스킨, 프라치노 공간은 페이지의 너비가 1,420픽셀 이상일 때 사이드바를 측면에 고정시킬 수 있습니다. 블로그 관리 페이지에서 ‘스킨 편집’으로 이동하고, ‘고정형 사이드바’ 항목을 살펴보세요. ‘고정형 사이드바’ 항목에는 다음과 같은 속성이 있습니다: 사용 기본, 노을, 밤일 때 버튼, 호버, 배경 컬러 기본, 노을, 밤일 때 배경 이미지 배경 이미지 위치, 크기, 반복 사이드바 위치 사이드바 모듈 순서 1. 사용 고정형 사이드바를 사용할 것인지 설정합니다. 2. 기본, 노을, 밤일 때 버튼, 호버, 배경 컬러 고정형 사이드바의 배경 컬러 또는 모듈의 버튼, 버튼이 커서나 손가락이 링크나 버튼 위에 있을 때의 상황인 호버(hover)일 때의 컬러를 설정합니다. 스킨의 모드에 따라 컬러..