본문 바로가기

수익형 블로그 챌린지/티스토리 꾸미기10

북클럽 스킨 커버 아이템 활용과 썸네일 정사각형 변환 티스토리로 블로그를 시작하는 많은 이들이 북클럽(Book Club) 스킨을 가장 많이 선호합니다. 그 이유는 아무래도 무료로 주어지는 직관적이고 깔끔한 레이아웃을 사용할 수 있다는 점과 사이드바 활용 등에 최적화된 스킨이기 때문입니다. 오늘은 북클럽 스킨 커버를 활용한 홈 설정에 대해 알아보겠습니다. 북클럽 스킨 커버 아이템 기본적으로 북클럽 스킨 편집으로 들어가면 ‘최신글’과 ‘커버’ 아이템 두 가지 홈 설정을 정할 수 있습니다. 특히 기본설정인 ‘최신글’ 과는 다르게 ‘커버’ 형식을 활용한다면 별도의 편집 없이도 간단하게 본인의 개성을 살린 특별한 블로그로 완성할 수 있습니다. 커버 아이템에는 기본리스트, 섬네일리스트, 뉴스레터, 커버 갤러리 1,2, 이벤트배너로 총 6가지 종류가 있고 각 기능을 홈.. 2023. 2. 9.
티스토리 목차 만드는 가장 쉬운 방법 블로그에 목차를 추가하면 전체적인 내용을 서두에서 볼 수 있다는 장점이 있다. 또한 글의 내용이 길면 길어질수록 목차 링크를 이용해서 가독성을 높여줄 수 있을 뿐만 아니라 구글이 원하는 검색 노출에도 도움이 된다. 이번 포스팅에서는 티스토리 서식을 이용한 본문 목차 추가하는 방법에 대해 소개하고자 한다. 본문 목차 추가하는 방법 서식 1. 출발 링크 서식 2. 도착 링크 목차 링크 확인하는 방법 본문 목차 추가하는 방법 예를 들어 위의 목차 제목을 누르면 해당 항목으로 이동되는 것을 확인할 수 있다. 블로그 관리 홈 > 콘텐츠 > 서식 관리로 이동해서 ‘서식 쓰기’ 버튼을 클릭한다. 총 2개의 서식을 작성해야 하는데 첫 번째는 목차 부분이고(출발 링크), 두 번째는 그 목차의 이동 위치이다(도착 링크)... 2023. 1. 6.
티스토리 글 제목 배경 이미지 수정하기 몇 가지 간단한 편집으로도 티스토리 블로그 가독성을 높여줄 수 있다. 이글에서는 다음 세 가지 사항을 적용시켜보려고 한다. 글 배경 크기 및 제목 위치 변경 배경 이미지 수정 전체 글 리스트에서 제목 부분 수정 글 배경 크기 및 제목 위치 변경 블로그관리 홈→스킨 편집→html 편집→CSS로 들어간다. 이곳에서 Ctrl + F를 눌러 .post-cover 로 검색해주고 height: 340px; 이 부분을 200px; 로 변경하고 '적용'버튼을 눌러준다. 배경 크기가 줄어들었지만, 제목 위치를 가운데로 맞추기 위해 다음과 같이 해준다. ‘CSS’에서 .post-cover .inner 를 검색해서 padding-bottom: 78px 부분을 30px; 으로 변경 후 ‘적용’ 버튼을 눌러준다. 이제 제목 위.. 2022. 12. 10.
누구나 할수있는 티스토리 날짜 없애기 편집 블로그 포스팅을 하는 데 있어서 가끔 최신 글이 아니어서 검색 결과에서 제외되는 경우가 있다. 특히 정보성 관련 글은 시간이 지나도 변하지 않는 주옥같은 글인데도 불구하고 단지 작성된 날짜 기준으로 밀려난다면 너무나 억울한 상황일 것이다. 그런 점을 미연에 방지하고자 아예 포스팅 작성 날짜를 없애는 방법에 관해서 설명하려고 한다. 포스팅 발행날짜 없애기 블로그 관리 홈→꾸미기→스킨 편집→html 편집으로 들어간다 그다음 컨트롤+F 키를 눌러 ‘##_article_rep_simple_date_##’ 이라고 검색을 한다. 그리고 다음과 같이 두 군데에 앞에는 ''룰 붙여준다. 437행은 블로그 홈 화면에 보이는 날짜에 대한 수정이고, 450행은 있는 본문에 나오는 날짜를 없애주는 편집이다. 그리고 적용을 눌.. 2022. 12. 7.
간단 티스토리 꾸미기 - 본문 드래그 색상 변경 아주 간단한 수정으로 본문 내용을 드래그했을 때 강조할 수 있는 방법이 있다. 이는 독자가 글을 읽을 때 가독성을 높여주고 무의식적으로 글씨를 드래그하면서 읽을 때 재미를 더해 준다. 드래그 색상 바꾸기 (텍스트 블록) 이는 ‘텍스트 블록’이라고도 표현하는데, 간단한 CSS 수정 방법으로도 적용이 가능하다. 티스토리 블로그 관리 홈 → 꾸미기 → 스킨 편집으로 들어가서 오른쪽 상단에 html 편집으로 들어간다. CSS를 클릭해서 아래의 코드를 다음과 같이 적당한 곳에 붙여 넣으면 끝이다. ::selection { color:black; background:#FFD8D8; } Color: 드래그 시 글자색 Background: 드래그 시 배경색 드래그했을 때 나타나는 백그라운드 색상은 네이버 색상 코드표에.. 2022. 11. 8.
티스토리 북클럽 블로그 이름 편집 티스토리 사용 시 블로그 이름은 첫인상을 안겨주기 때문에 정말 중요하다. PC 화면에서는 대부분 제목이 잘 보이는 데 반해 모바일로 보면 글씨 자체가 잘리거나 너무 크게 나와서 보기에 안 좋을 수가 있다. 하지만 이 부분도 CSS 편집을 통해서 간단하게 수정이 가능하다. 북클럽 스킨 사용 시 블로그 제목 편집 방법 위 화면에서 보이는 거와 같이 블로그 제목이 너무 크게 자리 잡고 있다. 이때 기본적으로 적용된 폰트의 서식이 마음에 들지 않을 경우 구글 검색을 통해서 (구글 웹폰트) 원하는 폰트로 수정시킬 수 있다. 블로그 관리 홈 → 꾸미기 →스킨 편집으로 들어가서 html 편집 → CSS를 눌러준다. 화면에서 보이는 거와 같이 22번째에 웹 폰트 관련된 내용들을 확인할 수 있다. 이곳에다가 앞서 구글 .. 2022. 11. 4.
스크롤바 하나로 나도 전문 블로거! 최근 HTML/CSS를 활용한 티스토리 꾸미기를 시도해보는 재미에 푹 빠져있다. 특히 다른 분들의 티스토리에 들어가면 초보인 나의 페이지와 다른 점들이 하나씩 눈에 뜨이게 발견되는데, 그 부분이 무엇인지 검색해보고 하나씩 적용해 나가는 중이다. 오늘은 글을 읽을 때 상단에 나타나는 스크롤바를 만드는 과정에 대해서 알아보려고 한다. 스크롤바 만들기 글을 읽을 때 스크롤바 기능을 추가하면 가독성을 높여준다고 한다. 사실 이 스크롤바의 정식 명칭은 프로그레스 바 (Progress bar)라고 하고 자바스크립트 효과라고 한다. 소스는 쉽게 인터넷으로 구할 수 있어서 편집하는 데에는 그리 오래 걸리진 않는다. ≪소스≫ 편집 방법 꾸미기→스킨 편집→HTML에서 사이의 공간 아무 데나 붙여 넣기만 하면 끝이다. He.. 2022. 10. 28.
스킨 썸네일 정사각형으로 바꾸기 북클럽’(Book Club)으로 스킨을 정하고 커버 아이템을 ‘뉴스레터’ 방식으로 설정하고 나면 썸네일 화면이 약간 잘려 나오는 모양으로 화면에 보이는 것을 확인할 수 있다. 그렇다면 어떻게 하면 세로형인 썸네일 화면을 정사각형으로 만들 수 있을까? 처음에는 방법을 몰라서 썸네일에 들어가는 사진 파일을 요리조리 수정해보았지만, 항상 이런 식으로 편집하다 보니 일관성이 없어서 많이 답답해 오던 와중에 굉장히 쉽게 해결할 수 있다는 걸 알게 되었다. 그것도 너무나 쉽게. 썸네일 정사각형으로 수정 관리→스킨 편집으로 들어가서 ‘html 편집’ 버튼을 클릭해 준다. 그리고 ‘CSS’에 들어가서 컨트롤+f 키를 눌러 찾기 목록에서 .list-type-thumbnail .post-item .thum img 을 검색.. 2022. 10. 27.
구글 최적화 - 구글이 좋아하는 사진이 있다고? 구글이 좋아하는 사진은 반드시 있다. 그 말은 페이지 로드하는 시간이 길어질수록 구글은 싫어한다는 것이다. 그렇다면 어떻게 하면 평균 페이지 로드 시간을 줄일 수 있을까? 바로 이미지 사이즈를 줄이는 작업이다. 업로드하는 사진 사이즈를 줄이는 방법은 두 가지가 있는데 한번 습관을 길들여놓으면 글을 업로드할 때마다 습관처럼 반복되는 작업이라 크게 부담이 없다. 사진 이미지 편집 1. 포토스케이프 (PhotoScape X) PhotoScape X for Mac and Windows 10 History There is a mouse issue in macOS ( Mojave 10.14.0 ~ 10.14.3 and Catalina 10.15 ). A fix for this will be available sho.. 2022. 10. 26.
기본중의 기본, 티스토리 초기 세팅 블로그를 개설하고 맨 처음 해야 할 일은 기본 세팅이다. 이것은 사람마다 미미한 차이가 있지만, 수익을 내기 위한 대다수 사람이 하는 기본 세팅 방법으로 맞추는 데 그 목적이 있다. 그러므로 처음 세팅은 일단 이렇게 해놓고 추후 하나씩 변경해 나가면 되겠다. 초기 설정하기 일단 북클럽 스킨 선택 후 블로그 관리 홈으로 들어간다. 콘텐츠 → 설정에서 상업적 이용 및 콘텐츠 변경을 전부 ‘비허용’으로 바꿔준다. 이렇게 함으로써 다른 이가 내 글을 무단으로 사용하지 못하도록 막을 수가 있다. 댓글·방명록 → 설정에서 댓글은 ‘로그인 한 사용자만’, 그리고 '승인 후'로 변경하고, 방명록 작성도 ‘비허용’으로 한다. 꾸미기 → 스킨 편집 홈 화면에서 글 수를 ‘8개’로 바꾸고 밑으로 내려서 리스트 타입을 ‘뉴 .. 2022. 10. 25.
반응형