본문 바로가기
블로그/블로그 기초지식

티스토리 블로그 파비콘 만들고 설정하기

by Rookie Smart 2013. 5. 28.
반응형

파비콘을 만들고 티스토리 블로그에 설정한 제 블로그 화면입니다. 익스플로러 주소창 블로그 주소 왼쪽에 녹색버튼 이미지 파비콘을 확인할 수 있습니다.

 

 

 

티스토리 블로그에 적용할 파비콘을 제작하기위해 http://genfavicon.com/ 사이트를 이용했습니다. 회원가입없이 간단하게 만들수 있습니다. 내컴퓨터에서 이미지.jpg 파일을 찾아 업로드 하고 이미지 크기를 조정후 48x48사이즈로 캡쳐합니다. 오른쪽에 다운로드할 수 있는 파일이 2개 있는데 왼쪽파일이 이미지.ico 파일 입니다. 파비콘은 이미지.ico 파일을 사용하니 왼쪽 파비콘을 다운로드 합니다.

 

 

티스토리 관리자 -  플러그인 - 플러그인 설정에서 홈페이지 아이콘 표시 와 블로그 아이콘 표시를 활성화 합니다.

 

 

환경설정 -기본정보 - 파비콘 찾아보기에서 다운받은 이미지.ico 파일을 업로드 하고 저장합니다.

 

 

 

익스플로러 10에서 티스토리 블로그 파비콘이 나타나지 않는 현상이 있습니다. 이 문제를 해결하기 위해 HTML/CSS 편집 - 파일업로드 에서 다운받은  이미지.ico 파일을 추가합니다.

 

 

 

이미지 오른쪽 버튼을 눌러 속성을 클릭한후 팝업창에서 이미지.ico 파일 주소를 복사합니다.

 

 

HTML/CSS - skin.html 에서 favicon을 찾습니다. 찾기 기능 (Ctrl + F)을 사용하면 금방 찾을 수 있습니다. 아래 네모친 <link rel ="shortcut icon" href="favicon.ico"/> 이 부분 바로위에 다음 부분을 삽입후 저장합니다. 

 

<!-- 파비콘 start-->
<link href='복사한 파비콘 주소 붙여넣기' rel='shortcut icon' type='image/ico'/>
<!--파비콘 end-->

  

favicon.txt

 

 

 

 

현재 티스토리 파비콘 2개가 설정되어 있습니다. 1개를 삭제하는 방법은 티스토리 관리자 기본정보 - 파비콘 - 삭제 - 저장을  클릭하시면 됩니다.

 

 

 

예쁜 파비콘 설정하시고 댓글로 알려주세요~~

반응형

댓글