STUDY20

• 

  색 조합 찾아주는 사이트, 많은 사람들이 사용한 트랜디한 색상을 찾고 싶다면 티스토리 스킨의 색상을 변경하는 것만으로도 블로그 분위기에 변화를 줄 수 있습니다. 최근 연보라색을 메인 컬러로 사용하다가 좀 더 화사한 색상으로 변경하고 싶었습니다. 색을 이리저리 변경하다 보니, 생각보다 중구난방이 되는 것 같다는 생각이 들었는데요. 색 조합을 어떻게 하는 것이 조화로울지 고민이 되신다면 무료 컬러 배색 사이트를 이용하는 것도 대안책이 될 수 있습니다. 목차 무료 색 조합 사이트, 어울리는 색상 찾아보기 ↑ https://www.colordrop.io/popular ColorDrop 사이트에서 [Popular]를 클릭하여 인기순으로 색조합을 확인해볼 수 있습니다. #17223b, #263859 , #6b778d, #ff6768 조합이 인기 색상이었는데요. 화사한 색상으로 블로그 스킨을.. STUDY 2022. 6. 1.

• 

  프리텐다드(Pretendard) 폰트 웹폰트 적용, 티스토리 스킨 편집하기(미넴스킨 수정) 프리텐다드(Pretendard) 폰트 웹폰트 적용, 티스토리 스킨 편집하기(미넴스킨 수정) 미넴 스킨에서 기본적으로 옵션으로 제공하고 있는 폰트 3종(기본, 이롭게바탕체, 리디바탕) 외에 다른 폰트를 적용하고 싶으신 분도 계실 수 있습니다. 웹폰트라고 하여 개성있고 가독성이 좋은 무료 웹폰트를 이용하여 원하는 폰트를 티스토리에 적용할 수 있습니다. 일전에 무료 웹폰트를 모아둔 사이트 '눈누'를 이용하여 넥슨 고딕체를 티스토리에 적용한 적이 있습니다. 눈누라는 사이트는 다양한 무료 웹폰트를 이용할 수 있어서 알아두시면 유용합니다. 이번에는 미넴 스킨의 기본 폰트인 Noto Sans DemiLight 대신, 프리텐다드(Pretendard)라는 무료 웹폰트를 적용하는 과정을 정리해보았습니다. 목차 프리텐다드 .. STUDY 2022. 5. 31.

• 

  미넴 스킨에서 h2 h3 h4 밑줄과 색상 CSS HTML 수정 편집 하기 미넴 스킨에서 h2 h3 h4 밑줄과 색상 CSS HTML 수정 편집 하기 최근 이용 중인 미넴 스킨은 이미지 alt 자동 작성, TOC 자동 작성 등 원하는 다양한 기능이 포함되어있는 무료 티스토리 스킨입니다. 업데이트도 빠르고 피드백도 빠르기 때문에 무료 스킨임에도 유료 스킨처럼 만족도가 높은데요. 미넴스킨 2.5.8 버전의 본문의 제목 태그인 h2, h3, h4 디자인을 변경해보고 싶었습니다. 👉미넴 스킨 2.5.8 버전 다운받는 곳 바로가기 미넴 스킨 h2, h3, h4 수정 편집할 곳 위치 찾기와 변경 보통 스타일을 변경하려면 css를 수정하는 것이 일반적입니다. 그러나 티스토리 편집창의 css를 여기 저기 찾아봐도 h2, h3, h4 부분을 css 찾을 수 없었습니다. html에서 h2, h3.. STUDY 2021. 10. 7.

• 

  css를 더 쉽게 수정하기, HTML 편집 프로그램 Visual studio code 다운 후기 css를 더 쉽게 수정하기, HTML 편집 프로그램 Visual studio code 다운 후기 티스토리 블로그를 시작하고 나서 스킨에 관심을 갖게 되고 다양한 무료 스킨과 유료 스킨을 보면서 나도 개성있는 나만의 스킨을 만들고 싶다라는 생각이 들었습니다. 무료 스킨 중에서도 좋은 기능과 디자인의 스킨이 많아서 사용하고 있고 만족하는 부분이 있지만, 글자 크기나 제목 색상 등 디테일한 부분을 수정하는 데에도 html이나 css를 수정하려면 기초적인 지식이 필요합니다. html css 자바스크립트 등 아는 것이 없기 때문에 차차 배워나가면서 알게 된 부분을 정리해보려고 하는데요. 처음에는 메모장에서 일부 수정하거나 티스토리 스킨 편집창에서 수정하고 적용하고 새로고침하는 방식으로 했습니다. 그러다보니 어떤 .. STUDY 2021. 10. 5.

• 

  링크 URL 뒤에 이모티콘이나 어썸 폰트 아이콘 붙이는 방법 (::after css를 활용) 링크 URL 뒤에 이모티콘이나 어썸 폰트 아이콘 붙이는 방법 (::after css를 활용) 웹사이트나 블로그에서 URL 링크를 표시하는 방법으로 색상을 강조하거나, 링크 밑줄을 보이게 하는 방법이 있습니다. 링크 이모티콘이나 아이콘을 활용하는 방법도 있는데요. 티스토리 관리자 페이지에서도 확인할 수 있습니다. 링크 표시를 좀 더 직관적으로 확인할 수 있게 링크 뒤에 어썸 폰트 또는 이모티콘(이모지)를 자동으로 붙이는 방법을 찾아보았는데요. 티스토리 블로그에 적용하면서 그 과정에 대해서 정리해보았습니다. ::after를 이용하여 링크 뒤에 이모티콘, 아이콘, 어썸 폰트 적용하기 (css) 이전 글에서 ::before를 활용하여 앞쪽에 장식하는 요소를 붙이는 방법에 대해서 작성하였습니다. 비슷하게 ::af.. STUDY 2021. 9. 22.

• 

  ::before를 활용하여 강조 표시 안내 티스토리 글상자 박스 만들기 (어썸폰트) ::before를 활용하여 강조 표시 안내 티스토리 글상자 박스 만들기 (어썸 폰트) 글을 작성하다 보면 이전 글의 내용이 부족한 부분이 있어서 글을 수정하거나 날짜가 지나 업데이트를 해야 하는 상황에 놓일 때가 있습니다. 혹시라도 잘못된 내용을 전달될 수 있기 때문에 글 내용이 업데이트되었다는 것을 알리기 위해서 강조 표시를 하는 안내용 글상자 서식을 만들어보았는데요. 이전에 작성한 글을 수정하면서 이러한 글상자 서식을 작성해보았습니다. 구글 검색 센터 글에서 이러한 서식으로 글을 강조하는 부분이 있어서 p 태그 앞에 ::before 값을 설정하여 한번 비슷하게 만들어보았습니다. 혹시 필요하신 분이 있으실 수 있을 것 같아 ::before를 활용한 티스토리 글 박스 서식 사용 방법에 대해서 정리해보았습.. STUDY 2021. 7. 31.

• 

  미넴 스킨 모바일 글 간격과 글자 크기 css 변경하는 방법 미넴 스킨 모바일 글 간격과 글자 크기 css 변경하는 방법 너무 자주 티스토리 스킨을 바꾸는 것은 아닌가 싶기도 합니다만 다양한 기능과 괜찮은 디자인의 무료 티스토리 스킨이 많다보니 하나씩 적용하고 있다는 생각도 듭니다. 무료 스킨으로 유명한 고래스킨, 어포스트 스킨에 이어 미넴스킨까지 한번 적용하고 제 입맛에 맞게 몇가지 css를 변경해보았습니다. 미넴 스킨 장점과 사용하게 된 이유 스킨 다운로드는 무료로 현재 배포중으로 미넴 스킨 링크에서 다운받으실 수 있습니다. 개인적으로 생각해본 미넴 스킨의 장점은 다음과 같습니다. 꾸준한 업데이트 자동목차 기능 있음 (사이드바도 지원) 다크모드 지원 이미지 alt 속성 사진 제목 구글 광고 설정이 쉬움 (메인 구글 일치하는 광고, 사이드바 구글 일치하는 광고,.. STUDY 2021. 7. 20.

• 

  어포스트 스킨 자동 목차 크기 간격 수정하기 (티스토리 스킨 목차 변경) 어포스트 스킨 자동 목차 크기 간격 수정하기 (티스토리 스킨 목차 변경) 목차를 수동으로 직접 포스팅마다 삽입하여 만드는 방법이 있고, 자동으로 만들 수도 있습니다. 무료 티스토리 스킨 어포스트 스킨은 h2, h3 태그를 추출하여 자동으로 목차를 지원하는 기능이 있어 편리하게 이용 중입니다. 이번 포스팅에서는 현재 사용 중인 어포스트 스킨에 적용한 목차 간격, 크기 조절 css 수정하는 방법을 공유하려고 합니다. 자동목차는 TOC(Table of contents)로 SEO 최적화에 긍정적인 영향을 주는 요소로 티스토리 toc.js로 검색해보시면, 다양한 TOC 적용 방법을 확인하실 수 있습니다. 어포스트 스킨 목차 css 수정하기 어포스트 스킨에서 제공하는 자동목차 간격과 글자 크기를 변경하였습니다. 스.. STUDY 2021. 7. 5.

• 

  어포스트 스킨 변경 후 다음 구글 검색 누락 해결 어포스트 스킨으로 변경하고 첫 글을 6월 19일에 작성하였습니다. 그 이후 4일이지난 22일까지 노출이 다음 검색과 구글 검색 두 곳 모두에서 노출이 없었습니다. 다음은 티스토리 개설 직후 바로 노출이 발생하였었던 곳이기 때문에 스킨 변경 후 다음 구글 검색 누락 문제가 발생한 것 같다는 생각이 들었습니다. 결과적으로 스킨 변경 후 다음 검색 또는 구글 검색 노출이 다시 되도록 하였는데요. 문제 해결 과정을 정리해보았습니다. 어포스트 스킨 변경 후 다음 구글 검색 누락 해결 먼저 다음과 구글에서 자신의 블로그 글 제목을 검색하였을 때 검색 결과가 있는지 확인했을 때 검색 누락이 되는지 확인합니다. 티스토리 다음 검색 누락 문의하기 티스토리 글이 다음 검색 누락 된 것이 확인되었다면 다음 고객센터에서 문의.. STUDY 2021. 6. 26.

• 

  어포스트 티스토리 스킨 적용 후기, SEO 최적화가 잘된 스킨을 찾는다면 어포스트 티스토리 스킨 적용 후기, SEO 최적화가 잘된 스킨을 찾는다면 최근 스킨을 '어포스트' 스킨으로 바꾸면서 여러 모로 만족하고 있는데요. 이번 포스팅에서는 어포스트 스킨 적용한 후기를 작성해보았습니다. 블로그를 시작하고 나서 한동안 열정적으로 글을 썼었지만, 이후 글을 쓰는 것이 망설여졌습니다. 가장 큰 이유는 사용하던 스킨이 마음에 들지 않아서였습니다. 공유되고 있는 자동 목차 만들기 스크립트를 오디세이 블로그에 적용해보았지만 원하는 글씨 크기와 박스 형식으로 감싸는 방식으로 출력하는 방법을 몰라 방치하던 상태였습니다. 그 밖에도 어떤 글을 써야할지 글감을 찾는 것도 어려움이 있는 것도 글을 한동안 작성하지 않는 이유이기도 합니다. 고민하던차 어포스트 스킨이 고민의 상당부분을 해결해주었습니다... STUDY 2021. 6. 19.

• 

  구글 서치 콘솔에 사이트 등록 후 빠르게 검색 반영하는 방법과 누락 문제 해결 구글 서치 콘솔에 사이트 등록 후 빠르게 검색 반영하는 방법과 누락 문제 해결 일전에 구글 검색 엔진에 등록하는 방법과 후기에 대해서 작성한 적이 있습니다. 이번 포스팅은 이전글에 이어서 구글 서치 콘솔에 사이트나 티스토리를 등록하였지만, 구글 검색에서 누락된 글을 빠르게 구글 검색 결과에 노출될 수 있도록 하는 방법에 대한 글입니다. 구글 서치 콘솔에서 포스팅한 글을 빠르게 구글에 반영하기 위해서는 먼저 구글 서치 콘솔에 사이트 또는 티스토리가 구글 서치 콘솔에 등록되어 글이 구글 검색 결과에서 1개 이상 노출이 되어있어야 합니다. 서치 콘솔에 등록하였더라도, 아직 구글 검색에 결과가 나오지 않았다면 [색인 생성 요청]자체를 할 수 없기 때문에 구글 서치 콘솔에 등록하는 방법인 이전글 [링크]의 방법으.. STUDY 2021. 1. 9.

• 

  구글 서치 콘솔에 티스토리 등록하기, 검색 노출까지 걸린 시간과 방법 블로그 적용 후기 많은 사람이 자신의 글을 읽게 하려면 쉽게 검색하여 찾아올 수 있도록 먼저 검색사이트에 등록을 해야합니다. 이번 글은 최적화 첫 걸음인 구글 검색 엔진에 블로그를 등록하는 방법에 대해서 작성해보았습니다. 네이버에서는 네이버 자사 블로그라면 자동 노출이 되지만 다음에서 서비스하고 있는 티스토리는 네이버나 구글 등 검색 사이트에 별도로 등록해야 노출이 됩니다. 최근 개설된 티스토리 블로그는 검색 엔진에 등록하더라도 네이버 상단에 오르기 어려워 온라인 상에서 티스토리 블로그는 다음 검색과 구글 검색을 타겟팅하라는 조언을 쉽게 찾아볼 수 있습니다. 실제로 새로 티스토리 블로그에 카카오 계정을 개설하여 약 한달 동안 사용해본 결과, 자신이 검색 노출이 하루에 1명 또는 0인 경우가 많았고 유입은 모두 다음에서만 .. STUDY 2021. 1. 8.