[워드프레스] 워드프레스에서 파비콘(favicon) 만들기
파비콘(favicon)은 아이콘의 일종으로 웹브라우져에서 보이는 홈페이지용 아이콘 이라고 생각하시면 되겠다. 백마디 말보다 한번의 그림이 더 쉽게 이해되니 다음 그림을 참고하시면 파비콘이 무엇인지 쉽게 아실것이다.
이 파비콘을 홈페이지에 넣어주면 마치 로고처럼 인식하게 되서 탭에서 홈페이지에 대한 인식율이 높아지게 된다.
예전에는 플러그인등을 통해서 파비콘을 홈페이지나 블로그에 삽입한것 같은데 플러그인의 단점은 플러그인이 많아질수록 워드프레스가 무거워지고 에러(?)를 유발할 가능성이 많아진다는 점때문에 직접 끼워넣는 것이 낫다고 생각한다. 워드프레스 공식 홈페이지를 보면 쉽게 설치가 가능하다.
공식 홈페이지 설명 : http://codex.wordpress.org/Creating_a_Favicon
김프(GIMP)라는 오픈소스용 이미지 편집기를 이용하면 저장할때 쉽게 ico 파일로 저장할 수 있다. 김프는 오픈소스 프로그램으로 포토샵과 같은 프로그램이다. 윈도우즈 버전도 존재하기 때문에 윈도우에서 사용도 가능하다. 까다롭게 이미지를 수정해야 된다면 김프를 써야겠지만 간단하게 작업할때는 웹에서 직접 편집하는 프로그램들을 사용하는 것도 괜찮다. 16 x 16 크기의 ico 파일을 만드는 것이 이제는 웹에서도 가능하다.
이 사이트로 들어가면 직접 그려서 만들수도 있고, UPLOAD – IMPORT IMAGE 탭메뉴로 들어가서 가지고 있는 이미지 파일을 업로드만 해주면 자동으로 ico 파일을 생성해준다.
FTP프로그램을 실행시켜서 새로운 파비콘을 현재사용하고 있는 테마의 메인 폴더에 넣어준다. 그리고 사이트의 메인 디렉토리(http://example.com/favicon.ico 주소가 되는곳)에도 favicon.ico 파일을 넣어주어야 합니다. 이 파비콘은 feedreaders에 보여집니다.
1. 관리자 알림판 화면으로 접속한다.
2. 왼쪽메뉴의 외모 테마편집기 를 선택한다.
3. 가운데창에 프로그램 소스가 뜨면서 오른쪽 부분에 파일명들이 나오는데 거기서 헤더 (header.php)를 선택한다.
4. 하단 이미지처럼 빨간줄이 쳐진 부분을 아래 프로그램 소스에서 추가해 넣는다.
<link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri(); ?>/favicon.ico" />
5. 수정이 끝나면 하단에 “파일 업데이트” 버튼을 눌러준다.
GIF, PNG의 경우에는 배경색을 투명하게 줄 수 있다는 장점이 있지만 16 x 16 ico 파일은 다음과 같은 정말 강력한 장점이 있다.
1. 호환성 – IE 5.0 를 포함하는 모든 브라우져는 ico 파일형식을 지원합니다.
2. 404 서버 에러 피하기 – 모든 현대적인 브라우져들은 항상 favicon.ico 파일을 요청 합니다. 따라서 404 에러를 피하고 싶다면 항상 favicon.ico를 가지고 있어야 한다.
3. ico 파일은 하나 이상의 아이콘을 가져갈수 있다. 16 x 16, 48 x 48 여러가지 아이콘을 보유할 필요가 없다.
아칼과 줄리 블로그에도 적용한후에 브라우져 탭에서 우리 홈페이지를 찾기가 쉬워졌다. 인식륙이 좋아진다는 것은 이 홈페이지를 인식 못했던 분이 인식을 하게 되니 멋과 실용 두마리 토끼를 다 잡을수 있는 유용한 설정이라고 생각된다.