Blair  - Soul Eater [블꾸] 티스토리 아이콘 변경 / 파비콘 설정 +파비콘 변경사이트 +제작방법

• 블로그 꾸미기

[블꾸] 티스토리 아이콘 변경 / 파비콘 설정 +파비콘 변경사이트 +제작방법

oujin 2024. 1. 25. 14:07
728x90

 

이렇게 티스토리 블로그를 실행하면 기본 티스토리 아이콘이 아니라

원하는 아이콘으로 설정하는 방법에 대한 포스팅입니다!

 


티스토리 블로그에 글을 계속 작성하면서 블로그를 꾸미고 싶어지더라구요!

저번에는 마우스 모양을 변경 해주었고 

 

마우스 모양 변경은 아래 게시글에서 자세하고 쉽게 ..! 적어놓았으니

참고하시면 빠르게 변경 가능하실 것 같습니다 :)

 

[블꾸] 티스토리 마우스커서 모양 바꾸기 + 효과 코드 사이트 +html 컬러피커

다른분 티스토리에 방문 했다가 너무 귀여운 마우스 커서 효과를 적용하고 계셔서 저도 마우스 커서 모양 변경을 해보았습니다!! 마우스 커서 모양 바꾸기 + 효과 넣기 두가지중 하나만 하셔도

oujin.tistory.com

 


0.  티스토리 아이콘과 파비콘을 변경해 보기전에 몇가지 알아두기!

◑ 아이콘과 파비콘 차이

아이콘: 댓글 작성시 아이디 앞에 오는 아이콘

파비콘: 웹사이트 (즐겨찾기, 바로가기, 실행창 등) 에서 뜨는 이미지

 

 

0-1. 아이콘

 

0-2. 파비콘

 

 

 

차이점이 느껴지시나요? 각각 다른 이미지로 변경이 가능하며

인터넷에서 다운받은 이미지, 본인이 갖고 있는 이미지 모두 설정 가능합니다 :)

 

 


1. 아이콘 변경하기

블로그 관리자 -> 관리 -> 블로그 -> 아이콘 -> 불러오기 로 이동

 

 

불러오기를 눌러 컴퓨터에 저장되어 있는 jpg, png 파일을 선택하여 주시면 됩니다!

그리고 꼭 변경사항 저장을 눌러주세요!

 

 

♬ 참고사항 ♬ - 사진사이즈 조절하기

이때,  정사각형 모양이어야 합니다!

정확하게 정사각형이 아니어도 가능하지만 위아래로 잘릴 수 있다는점 유의해 주시면 좋을 것 같습니다!

 

 

또한 파일의 최적 사이즈를 확인해보시고, 만약 파일크기가 너무 크거나 하신다면

아래 사이트에서 클릭 몇번으로 쉽고 빠르고 간단하게 사진 사이즈 조절이 가능합니다!

https://www.resizepixel.com/ko/resize-image/

 

ResizePixel - 온라인 이미지 편집기

온라인 무료 이미지 자르기, 크기 조절, 좌우반전, 회전, 변환, 압축 편집기

www.resizepixel.com

1.이미지 업로드 하기

 

2.화면 좌측에서 사진 크기 줄이기 (정사각형 모양 추천)(사이즈 자체가 작아야함)

 


 

2. 파비콘 변경하기

! 파비콘변경을 위해서는 확장자가 jpg나 png가 아니라 ico로 되어있는 파일이 필요합니다!

 

저는 그림판으로 고양이를 그려서 캡쳐한 이미지를 가지고 아래의 순서로 진행하였습니다!

 

 

2-1. 원하는 이미지의 배경 지우기

https://www.remove.bg/ko

 

이미지 배경 제거, 투명 배경 만들기 – remove.bg

사진이나 이미지 배경을 한 번 클릭으로 5초만에 무료로 제거할 수 있습니다. 이미지 배경 투명하게 만드는 법. 누끼 따기 프로그램.

www.remove.bg

 

 

2-2. 배경을 지운 jpg, png 파일을 ico로 변경

https://convertico.com/

 

ConvertICO.com - Convert PNG to ICO and ICO to PNG files

This free online icons converter allows you to convert PNG to ICO files with ease.

convertico.com

드래그나 아래 검정 상자를 눌러서 png 파일을 업로드 하시면

화면 상단에 업로드한 사진 이미보기와 ico파일 다운로드 버튼이 뜹니다!

그걸 다운로드 받아주시면 됩니다!

 

 

2-3. 파비콘 블로그에 적용하기

블로그 관리자 -> 관리 -> 블로그 -> 아이콘 -> 불러오기 로 이동

 


이렇게 티스토리의 아이콘과 파비콘 변경이 가능합니다!

 

다음 포스팅은 다른 사이트의 파비콘을 가져오기와

직접 파비콘을 제작하는 방법에 대한 정보를 올리겠습니다! :)

 


+ 블꾸 글 추천

 

 

[블꾸] 티스토리 마우스커서 모양 바꾸기 + 효과 코드 사이트 +html 컬러피커

다른분 티스토리에 방문 했다가 너무 귀여운 마우스 커서 효과를 적용하고 계셔서 저도 마우스 커서 모양 변경을 해보았습니다!! 마우스 커서 모양 바꾸기 + 효과 넣기 두가지중 하나만 하셔도

oujin.tistory.com

 

728x90