티스토리(17)
-
티스토리 사이트맵 만들기 자동 플러그인
안녕하세요. 얼마 전까지만 하더라도 티스토리 사이트는 외부 웹사이트의 도움을 받아 사이트맵을 만들고 구글에 등록해야 했습니다. 하지만 이제 플러그인 기능이 추가되어 사이트맵이 자동으로 생성되고 구글 서치콘솔에 등록할 수 있습니다. 먼저 구글 서치콘솔에 가입하시고 속성 추가를 통해 본인의 블로그를 등록합니다. URL 접두어로 티스토리 블로그를 등록하시면 됩니다. 블로그 등록이 완료되면 구글에 로그인된 상태를 그대로 유지합니다. (서치콘솔 창을 계속 열어두면 됩니다.) 서치콘솔에 등록이 완료되면 메인 화면에서 위와 같이 블로그 사이트 주소가 나타나게 됩니다. 이제 티스토리 플러그인 창으로 들어가서 구글 서치콘솔을 클릭합니다. 계정 연결하기를 클릭하면 자동으로 구글 서치콘솔과 연결이 되어 사이트맵이 제출됩니다..
2020.07.11 -
티스토리 북클럽 스킨 편집 #9 포스팅 제목 배경 바꾸기
안녕하세요. 박대리입니다. 이번 포스팅에서는 북클럽 스킨의 포스팅 제목 배경을 변경해보겠습니다. 북클럽의 포스팅 제목 배경 기본값은 썸네일 혹은 대표 이미지입니다. 썸네일에 따라 위의 그림처럼 포스팅 제목이 잘 인식이 안되는 경우가 있습니다. 제목 폰트 색상 기본값이 흰색이라 어두운 배경이 아니면 제목이 잘 보이지 않습니다. 이를 해결하기 위한 방법 중 하나가 배경을 특정한 이미지로 고정시키는 것입니다. HTML 편집기의 파일 업로드 창에서 추가 버튼을 눌러 사용할 이미지를 추가하고 적용을 클릭합니다. 업로드한 파일을 마우스 우클릭하여 링크 주소 복사를 하여 링크 주소를 메모장에 옮겨놓습니다. HTML 편집창에서 Ctrl+F(맥 cmd+f) 를 눌러 div class=“post-cover” 를 검색하여 ..
2020.07.11 -
티스토리 북클럽 스킨 편집 #8 포스팅 목록 구분선 추가
안녕하세요. 티스토리 북클럽 스킨의 메인 화면의 기본값에서는 포스팅 목록 간에 구분선이 없습니다. 이번 포스팅에서는 북클럽 스킨의 포스팅 목록에 구분선을 추가해보겠습니다. 북클럽 스킨 기본값은 블로그 메인 페이지의 포스팅 목록 사이에 구분선이 없습니다. border 속성을 사용하여 포스팅 목록이 확실히 구분되도록 구분선을 추가해보겠습니다. HTML 편집기를 열고 CSS 속성창에서 Ctrl+F(맥 cmd+f) 를 눌러 .list-type-thumbnail .post-item { 을 검색하여 찾아줍니다. 그런 다음 우선 border-bottom: 1px solid black; 을 추가해 줍니다. 적용을 누르고 화면 새로 고침을 하여 변경된 블로그 페이지를 확인합니다. 간단한 방법으로 위의 그림과 같이 구분선..
2020.07.10 -
티스토리 글 상자 모서리 라운드 서식 만들기
안녕하세요. 이전 포스팅에서 txc-textbox 속성과 border 속성을 활용하여 글 상자 서식을 만들었습니다. 이번 포스팅에서는 기존에 만들었던 글 상자 모서리에 라운드 효과를 주는 방법에 대해 알아보겠습니다. 위의 그림과 같이 기존의 글 상자 서식에서 border 속성 중 하나인 border-radius를 활용하여 모서리에 라운드 처리를 해보겠습니다. 속성값은 위와 같으며 기존 글 상자 속성값에서 border-radius: 20px 속성값만 추가되었습니다. border-radius: 20px의 의미는 4개의 모서리 모두 반지름 20px의 라운드를 적용한다는 뜻입니다. 4개의 모서리에 각기 다른 반지름 값의 라운드를 적용하고 싶다면 아래와 같이 속성값을 나누어 적용하면 됩니다. 위 속성의 의미는 상..
2020.07.10 -
[HTML] 텍스트 그림자 효과
안녕하세요. 이번 포스팅에서는 텍스트에 그림자 효과를 주는 HTML 속성값에 대하여 알아보겠습니다. 우선 아래와 같이 텍스트 그림자 효과의 예시를 만들어보았습니다. 내용을 입력하세요 위의 속성값을 사용하면 그림처럼 텍스트에 그림자 효과를 줄 수 있습니다. 텍스트에 그림자 효과를 주는 속성값은 ‘text-shadow’이며 그 외 color, font-size, font-weight는 제가 임의로 구성한 값입니다. color = 글자 색상 font-size : 글자 크기 font-weight : 글자 두께 굳이 위의 속성값들을 추가하지 않아도 되며, text-shadow 속성만으로 그림자 효과를 줄 수 있습니다. text-shadow 속성은 총 4개의 값으로 구성됩니다. ex) text-shadow: 3px..
2020.07.10