티스토리 대표이미지 지정

티스토리 대표이미지 지정 홈화면 카테고리 목록 썸네일

티스토리 대표이미지 의미와 원하는 이미지를 대표이지로 지정해 블로그 홈 화면 또는 카테고리 목록에 썸네일로 표시되도록 하는 방법을 설명합니다. 티스토리 대표이미지 티스토리 대표이지란 내 블로그 홈 화면과 카테고리 목록 화면에 보이는 이미지 썸네일을 말하는 것입니다. 참고 : 티스토리에서 지정한 대표이미지가 다음 검색 결과 또는 네이버 검색 결과에 썸네일로 보이는 것은 아닙니다. 어디까지나 내 블로그 내에서만 대표이미지로 사용됩니다. 다음 검색 결과에 보이는 썸네일 이미지는 몇 가지 규칙에 따라 보이게 되는데요. 포스팅 주제와 맞지 않으니 생략하고 별도의 포스팅으로 대체하도록 하겠습니다. 티스토리 대표이미지의 의미는 이제 알았으니 어떻게 지정하는 알아보도록 할게요. 티스토리 대표이미지 지정 티스토리에서 대표이미지를 지정하지 않을 경우 자동으로 본문 내 첫 번째 이미지가 대표 이미지가 됩니다. 대표이미지로 사용할 이미지를 직접 지정하는 방법은 2가지가 있습니다. 첫 번째는 본문 내 이미지 중 하나를 아래와 같은 방법으로 지정하는 것입니다. 본문에 업로드된 이미지를 마우스로 한 번만 클릭하면 이미지 위에 버튼 모양처럼 생긴 "대표"가 보입니다. 이 버튼을 클릭하면 해당 이미지가 대표 이미지로 지정됩니다. 두 번째는 포스팅 완료 후…

2022-07-02
티스토리 인용구 따옴표 닫기 코드 추가

티스토리 인용구 따옴표 닫기, 인용구 닫기 따옴표 추가 방법

티스토리 인용구 따옴표 닫기, 인용구 마지막 부분에 닫는 따옴표가 없어 많이들 당황하셨죠. 간단한 CSS 코드를 추가해 인용구에 닫는 따옴표를 추가해 보겠습니다. 따옴표라는게 상식적으로 시작과 끝이 있어야 짝이 맞는데 시작만 있고 끝이 없으니 인용구인지 구분도 안되고 시각적으로도 않좋아 보이는 것 같아요. 네이버 블로그의 경우 열고 닫는 따옴표가 있지만 티스토리의 경우 여는 따옴표만 있어 네이버 블로그 사용하다 티스토리로 넘어온 분들은 좀 당황스러웠을 것 같습니다. 티스토리 인용구 따옴표 닫기 우선 티스토리 인용구 따옴표 닫기가 적용된 모습부터 보고 가겠습니다. 인용구 하단에 닫기 따옴표가 잘 적용된 모습입니다. 적용 방법은 아래 CSS 코드를 복사해 티스토리 "스킨 편집" -> "CSS" 에디터 하단에 붙여 넣기만 하면 끝납니다. /* 인용구 닫기 따옴표 추가 */ #tt-body-page blockquote[data-ke-style='style1']::after { content: ''; display: block; background: url(https://t1.daumcdn.net/keditor/dist/0.4.9/image/blockquote-style1.svg) no-repeat 50% 0; padding-top: 34px; transform: rotate(180deg); } 참고로 글 작성 중에는 닫기 따옴표가 보이지 않습니다. 적용된 모습을 보려면 미리 보기를 하거나 글을 발행하면 인용구 하단에 닫기 따옴표가 표시됩니다. CSS 에디터에 위 코드를 추가하는 방법을 모르시는…

2022-06-20
다음 웹마스터 도구

구글 블로거 다음 웹마스터도구 등록 방법

구글 블로거 다음 웹마스터도구 등록으로 다음 검색 결과에 보다 빠르고 신속하게 노출시키는 방법을 알아보겠습니다. 그리고 다음 웹마스터도구는 등록할 때 좀 독특한 방식으로 "robots.txt"을 이용하는데요 어렵지 않으니 잘 따라 해 보세요. 요즘 다음 검색 로직이 변경돼 티스토리 외 타사 블로그와 웹문서 등이 상위에 있는 경우를 많이 볼 수 있는데요. 구글 블로거는 계정당 100개까지 블로그를 개설할 수 있어 잘 활용하면 고수익을 내는데 큰 도움이 될 것 같습니다. 구글 블로거 다음 웹마스터도구 등록 다음 웹마스터 도구는 아직 베타 서비스라 네이버나 구글 웹마스터 도구만큼 다양한 기능을 제공하지는 않지만 "개별 문서 수집 요청"을 이용하면 2분 이내에 다음 검색 결과에 반영시킬 수 있어 활용도가 높아 보입니다. 참고사항으로 등록과정 중 "PIN 코드"가 두 번나 오는데요 하나는 자신의 다음 웹마스터 도구 계정 비밀 번호이고 하나는 구글 블로거 robots.txt에 등록할 "PIN 코드"이니 혼동이 없길 바랍니다. 다음 웹마스터도구 등록 다음 웹마스터도구 접속 전 구글 블로거 관리자 페이지를 미리 띄어 놓으세요. 다음 웹마스터도구로 접속 후 아무것도 입력하지 마시고 아래 "PIN 코드…

2022-06-02
티스토리 링크 버튼 코드

티스토리 링크 버튼 만들어 서식에 추가 사용하는 방법

티스토리 링크 버튼, 최근 수익형 블로그에 많이 사용되는 링크 버튼을 쉽게 만드는 방법과 티스토리 서식에 추가하는 방법 그리고 사용 방법 등을 설명합니다. 요즘 수익형 블로거분들 버튼에 링크를 걸어 현재 창에서 내부나 외부 주소로 이동시키는 모습을 자주 보는데요. 일반적인 문자 링크보다는 버튼 형태가 클릭 확률이 높은가 봅니다. 티스토리 링크 버튼 링크 버튼 만드는 방법으로는 직접 코딩해서 만드는 방법 있고 자동으로 생성해 주는 웹사이트를 이용하는 방법이 있습니다. 여기서는 직접 만들 수 없는 분들을 위해 제가 만든 버튼 코드와 버튼을 간단하게 생성해 주는 웹사이트 2곳을 소개하고 서식에 추가하는 방법과 사용하는 방법을 설명하도록 하겠습니다. 티스토리 링크 버튼 코드 아래와 같이 생긴 버튼 이미지를 티스토리 서식에 추가해 사용하는 방법 먼저 알아볼 건데요. 아래 버튼 이미지가 마음에 들지 않는다면 간단한 설정만으로 버튼을 자동으로 생성해 주는 웹사이트를 이용할 수 있습니다. 참고 : 간단한 CSS 버튼 생성기 추천 DevsDashBest css button generatorBest css button generator 사용방법 파란색 버튼에 대한 코드입니다. 주석으로 설명을 달아 놓았습니다. 색상 코드는 html color…

2022-05-24
다음 웹마스터도구 등록

다음 웹마스터도구 등록 방법 워드프레스(Yoast, Rank Math)

다음 웹마스터도구 등록 방법으로 워드프레스 사용자를 기준으로 하지만 일반 웹사이트 사용자도 등록 방법은 동일 하니 참고해 보시기 바랍니다. 참고 : 다음 웹마스터도구을 사용하면 사이트맵 제출과 RSS 제출 그리고 다음 검색 결과에 즉시 반영할 수 있는 개별 문서 수집 요청 등 유용한 도구들이 있습니다. 다음 웹마스터도구 등록 방법 다음 웹마스터도구는 소유자를 인증 절차는 PIN 코드를 발급받아 robots.txt에 코드를 추가하고 인증하는 방식입니다. 워드프레스 사용자는 모든 등록 절차가 간단하게 진행되니 걱정하지 않아도 됩니다. PIN 코드 발급robots.txt에 PIN 코드 추가사용자 인증다음 웹마스터도구 (사이트맵, RSS) 1. PIN 코드 발급 우선 다음 웹마스터도구로 접속합니다. 하단 PIN 코드 발급받기를 클릭합니다. 첫 번째 항목인 사이트 URL에 자신의 사이트 주소 전체를 기입합니다.(예: https://example.com) 두 번째 항목 PIN 코드 입력에 로그인 시 사용할 비밀번호 영문과 숫자 조합으로 8자 이상 12자 이하로 입력하고 그 아래 PIN 코드 확인에 동일하게 넣어줍니다. 앞으로 PIN 코드가 두 번 나옵니다. 여기서 본인이 입력한 PIN 코드는 로그인 비밀 번호로 사용된 다는 거 꼭 기억하세요. 세 번째…

2022-07-03
Ghost 블로그

Ghost 블로그 로컬 설치 방법(ghost install local)

Ghost 블로그 로컬 설치 방법입니다. Windows, macOS, Linux 모두 설치 방법은 동일하며 설치 전 Node.js가 설치되어 있어야만 합니다. Ghost 홈 : https://ghost.org/Ghost 로컬 설치 : https://ghost.org/docs/install/local/ Ghost 블로그 설치 전 Node.js 설치 Ghost Blog는 Node.js에서 작동됩니다. 따라서 Node.js 공식 웹 사이트에서 Node.js을 다운로드하여 설치해야 합니다. Ghost-CLI 명령 줄 도구 설치 Ghost-CLI는 Ghost를 빠르고 쉽게 설치하고 구성할 수 있도록 도와주는 명령 줄 도구입니다. 터미널을 열고 다음 명령을 실행합니다. npm install ghost-cli@latest -g Ghost 블로그 설치 ghost install local 설치가 완료되면 http://localhost:2368 주소로 접속하면 설치된 Ghost 블로그를 볼 수 있습니다. 참고로 Ghost 홈 설치 설명에서는 포트 번호가 "2368"이라고 했지만 제 경우 "2911"이 기본 값으로 돼있었습니다. 고스트를 실행하면 커멘드 창에 접속 주소가 나오니 확인합니다. 또는 config.development.json 파일에서 확인할 수 있으며 변경 또한 가능합니다. 실행 시작 중 아래와 같은 오류가 발생된다면 sqlite3을 설치합니다. npm install sqlite3 --save 그리고 Ghost를 다시 시작해 줍니다. ghost start 참고 중지 명령 ghost stop 관리자 화면 접속은 http://localhost:2368/ghost입니다.

2022-03-16
logo
ITer