본문 바로가기
잡다한 지식

티스토리 블로그 파비콘 생성 및 변경되지 않을때 해결 방법!

by mansfield 2018. 9. 15.
반응형

요즘 티스토리 블로그를 조금씩 만지는 재미에 하고있습니다. 오늘은 파비콘 변경에 대해 설명해보겠습니다. 먼저 파비콘이란 웹사이트를 켰을때 웹사이트의 이름 옆에 나타나는 조그마한 이미지입니다. 아래의 사진과 같아요.

파비콘은 보통 16*16px(픽셀)단위로 변환합니다. 어차피 작아서 높은 픽셀은 큰 소용이 없어요. 저는 64*64px로 변환했는데 100kb만 넘지 않으면 64*64px도 등록이 되네요.

- 티스토리 관리에서 파비콘을 변경했는데 적용이 되지 않는 경우는 바로 아래쪽으로 스크롤을 내려주세요.

이 파비콘을 설정하기 위해선 PNG, JPG 형식의 파일이 아닌 ico라는 새로운 파일의 형식이 필요합니다. 

png -> ico :  https://convertico.com/

jpg -> ico :  https://convertico.com/jpg-to-ico/

위의 링크에서 각각의 파일을 ico 형식으로 변환해줍니다. 변환 방법은 바로 아래 사진에 있습니다.

많은 변환 사이트들이 있지만 저는 간편한 여기를 이용해요.


홈페이지를 열면 위와같은 화면이 나오는데, 왼쪽 네모박스를 클릭해서 변경하고자하는 이미지를 선택합니다. 선택을 하게되면 자동적으로 변환이되어서 오른쪽 붉은색 박스에 나타나요. 화살표를 클릭해서 다운받아주면 간단하게 변환이 완료됩니다.



본인 계정의 블로그관리로 가서 좌측메뉴 제일 하단의 관리 - 블로그로 들어가면 아이콘과 파비콘을 불러올 수 있습니다. 아래의 파비콘 불러오기를 클릭해서 파비콘을 변경하면 아주 쉽게 변경할 수 있습니다.

조금 기다렸다가 블로그 페이지를 새로고침 하면 파비콘이 변경되어있는 걸 볼 수 있습니다.

다만 티스토리에서 기본으로 제공하는 스킨이 아니라 별도의 개인 스킨을 받아서 사용하는 경우엔 적용이 되지 않을 수 있는데요. 그런 경우엔 스킨편집으로 이동, html 편집을 눌러줍니다. 

<link rel="shortcut icon" href="https://gunso5.tistory.com/favicon.ico" />

위의 코드가 <head> 와 </head> 사이에 있는지 확인한 후 없으면 복사해서 붙여넣어 줍니다. 잠시후 새로고침하면 적용이 되어 있을거에요. 저같은 경우는 이 방법으로 바로 적용이 되었습니다.


그럼에도 적용이 되지않을 경우에는 스킨편집 -html 편집으로 간 후 html/css/파일업로드 파일업로드선택해서 직접 이미지를 업로드 해주시면 됩니다.

300x250

댓글