주소탭에 파비콘 넣기


파비콘(Favicon)이란?

favorites + icon 의 합성어로 제목탭 옆에 같이 뜨는 16x16 사이즈의 작은 아이콘을 뜻 한다.



페이스북의 F마크, 트위터의 새아이콘, 구글의 G마크처럼 시그니처가 되는 아이콘을 파비콘이라고 하는데 티스토리나 이글루스 유저들도 주소탭에 저런 파비콘을 넣을 수 있습니다. (네이버 지원 불가)



1. 파비콘 만들기


우선 파비콘을 만들어봅시다.

http://www.favicon.cc



가운데 창에 적당히 그려넣으면 됩니다.

그림 실력에 자신이 없다면 왼쪽에 [ Import Image ]를 눌러 다른 이미지를 불러 올 수 있습니다. 한칸이 1픽셀을 뜻하는데, 오른쪽 툴로 지우거나 색상을 변경하며 커스텀한 아이콘을 만들 수 있습니다. 그림 창 밑 부분에 [ ▼ Use Animation ▼ ] 누르면 움직이는 아이콘도 만들 수 있습니다. 하지만 티스토리는 움직이는 아이콘 지원을 안하네요;


스크롤을 내리면 주소창에 표시되는 화면을 미리 볼 수 있습니다. [ Download Favicon ] 을 누르면 favicon.ico 라는 파일이 바탕화면에 저장됩니다. 




2. 블로그 설정


이렇게 완성된 아이콘을 블로그에 등록해 봅시다.


설정-기본정보 에 파비콘을 등록 후 저장하시고, 플러그인 설정에 가서 [ 블로그 아이콘 표시 ] 사용 설정하시면 됩니다. [ 홈페이지 아이콘 표시 (파비콘) ] 과 중복 사용하시면 안됩니다.


- 파비콘 등록



- 플러그인 설정



그리고 여기서 끝이 아닙니다. HTML/CSS편집 으로 가셔서 소스코드를 넣어주세요.

위치는 <head></head> 사이에 아무 곳이나 넣으시면 됩니다. 저는 그냥 맨 밑에 넣었습니다.


skin.html

<link rel="shortcut icon" href="https://luvda.tistory.com/ 파비콘파일명.ico />


</head>


favicon.txt


저장 후 새로고침 해보시면 주소탭에 자신의 파비콘이 들어 간 것을 확인 할 수 있을 겁니다. 비교적 간단하게 블로그를 개성있게 해주는 기능입니다. 해보면 별로 어렵지 않아요. 여러분도 한번 해보세요.




위로가기