본문 바로가기

분류 전체보기42

티스토리 블로그_아이콘&파비콘 만들기 목차 1. 아이콘과 파비콘 티스토리에서는 "아이콘" 기능과 "파비콘" 기능을 제공하고 있습니다. "아이콘"은 블로그 아이콘이고, "파비콘"은 홈페이지 아이콘이죠. 저는 두 개의 플러그인 다 사용하지 않습니다. 플러그인은 사이트의 로딩 속도를 느리게 만들 수 있기 때문에 꼭 필요한 것만 선택해서 이용하거든요. 그럼에도 블로그 아이콘과 홈페이지 아이콘(파비콘)은 지정해 놓을 필요가 있다고 생각합니다. 저 플러그인과 별개로, 블로그 아이콘과 홈페이지 아이콘(파비콘)은 쓰이는 영역이 있습니다. 1-1. 파비콘이란? "파비콘"이 무엇인지에 대한 설명은 "Google 애드센스 고객센터"에서 제공하는 "용어집"에서 가져와 보겠습니다. ↘"Google 애드센스 고객센터"에서는 "파비콘"을 "회사 로고처럼 광고주가 자신.. 2023. 10. 18.
티스토리 블로그_공감 버튼 위에 고정 문구 넣기_CSS 저는 포스팅 하단에 "이 블로그의 모든 글은 계속해서 수정 보완되고 있습니다. 잘못된 부분이 있거나, 좋은 의견이 있으시면 댓글 주시기 바랍니다."라는 문구를 항상 추가해 왔습니다. 그동안은 블로그 서식에 저장해 놓고 글을 발행할 때마다 밑에 첨부해 왔었죠. 하단 고정 문구를 스킨의 CSS 편집으로 고정해 둘 순 없을까? 생각을 하다가 다음과 같은 방법을 찾게 되었습니다. 글 하단에 달리는 공감 버튼(❤️). 그 위의 여백에 고정 문구를 추가하는 것이죠. ↘그렇게 얻은 결과물. 이렇게 글 하단의 공감 버튼 위에 문구를 추가하는 법을 해보겠습니다. 목차 1. CSS에 코드 추가하기 아래의 코드를 복사합니다. /* 공감 버튼 위 고정 문구 */ .container_postbtn:before { content.. 2023. 10. 18.
티스토리 블로그_링크 "새창으로 열기" 자동 해제로 전면광고 유도하기_HTML 애드센스에서는 웹사이트에 개제할 수 있는 다양한 종류의 광고를 제공합니다. 제 경험을 비추어 보건대 전면광고가 가장 클릭률이 좋습니다. 전면광고는 방문자가 링크를 클릭하면 발생합니다. 그런데 중요한 것은 "새창으로 열기"의 경우 발생하지 않는다는 것입니다. 그래서 글에 삽입하는 링크는 "새창으로 열기"를 해제해 주는 것이 좋습니다. 저는 그동안 "새창으로 열기"를 수동으로 해왔는데요, "새창으로 열기"를 자동으로 현재창에서 열기로 바꿔주는 코드를 티스토리 스킨에 적용할 수 있다는 것을 알게 되었습니다. 목차 1. "link.target = '_self'"와 "link.target = '_blank'" 웹사이트에서 링크를 누르면, ①새로운 창에서 열리거나 ②현재 창에서 열리게 됩니다. html 편집을 해줌.. 2023. 10. 15.
티스토리 블로그_글 제목 배경 어둡게 수정하기_CSS 저는 북클럽 스킨을 사용하고 있습니다. 북클럽 스킨은 글 제목 배경에 대표 이미지가 들어가는 게 기본 값입니다. 글 제목은 하얀색이죠. 그렇다 보니 글 제목 글자가 잘 보이지 않는 것이 대부분입니다. 글 제목 배경을 어둡게 수정해 주어 글 제목 글자가 잘 보이도록 해보겠습니다. 목차 이 방법은 티스토리에서 기본으로 제공하는 Book Club 스킨을 기준으로 합니다. 1. 글 제목 배경 코드 위치 찾기 "스킨 편집" - "html 편집" - "CSS" 편집 창에 들어갑니다. "커맨드 + F"를 눌러 검색창을 띄웁니다. (윈도우의 경우 "컨트롤 + F" 키입니다.) ".post-cover:before"를 입력하여 찾습니다. .post-cover:before ↘여기서 복사 가능합니다. ".post-cover:.. 2023. 10. 15.
티스토리 블로그_배경색, 헤더 색깔, 블로그 이름 글자색 커스터마이징_CSS 저는 티스토리 기본 스킨 중 하나인 북클럽 스킨을 사용하고 있습니다. 북클럽 스킨은 배경색이 흰색인데, 컬러로 변경하고 싶더라고요. 블로그 전체 배경색에는 컬러를 넣어주고, 헤더(블로그 이름이 있는 윗부분)만 흰색으로 하는 작업을 해줄 겁니다. 블로그 이름의 글자색을 바꾸는 것도 해보겠습니다. 목차 이 방법은 티스토리에서 기본으로 제공하는 Book Club 스킨을 기준으로 합니다. 1. 배경색 바꾸기 이 글에서 하는 모든 작업은 "스킨 편집" - "html 편집" - "CSS"에서 이루어집니다. CSS 편집창에 진입하면, 첫 페이지 하단 부분에 "html, body {"로 시작하는 코드가 있습니다. 이 코드 안에 "backgroud-color: #(원하는 컬러코드);"를 입력해 주시면 됩니다. html,.. 2023. 10. 15.

티스토리툴바