Wix용 파비콘
Wix는 설정 > 웹사이트 정보 > 파비콘 아래 사이트 대시보드에 파비콘을 저장하고 게시된 모든 페이지에 자동으로 삽입합니다. 최소 100×100픽셀의 정사각형 PNG를 업로드하세요. 512×512는 선명한 디스플레이에 이상적입니다. PWA 및 apple-touch-icon 지원을 위해 고급 사용자는 Wix Velo를 통해 사용자 정의 코드를 추가할 수 있습니다. favicon generator를 사용하여 로고나 브랜드 마크에서 바로 업로드할 수 있는 PNG를 만드세요.
파비콘은 Wix 사이트에서 가장 눈에 띄는 브랜드 요소 중 하나입니다. 이는 브라우저 탭, 북마크바, 주소 표시줄 기록에 나타납니다. 선명하고 알아보기 쉬운 파비콘은 방문자가 Wix 사이트를 빠르게 식별하고 다시 방문하는 데 도움이 됩니다. Wix는 이미지를 업로드하면 파비콘 삽입을 자동으로 처리하므로 필요한 노력이 최소화됩니다.
Wix 파비콘을 추가하거나 변경하려면 Wix 대시보드에 로그인하고 설정 > 웹사이트 정보로 이동하세요. 파비콘 섹션(Wix 버전에 따라 사이트 아이콘 또는 탭 파비콘으로 표시되기도 함)으로 스크롤합니다. 업로드 영역이나 기존 아이콘 썸네일을 클릭하여 미디어 관리자를 엽니다. 정사각형 PNG를 업로드하고 확인하세요.
Wix에서는 최소 파비콘 크기인 100×100픽셀을 권장하지만 이는 대상이 아니라 바닥입니다. 가장 선명한 결과를 얻으려면 512×512를 업로드하세요. Wix는 탭 표시를 위해 이미지 크기를 줄이고 더 큰 소스에서 시작하면 작은 크기에서도 품질 손실이 줄어듭니다. favicon generator는 몇 초 만에 모든 로고에서 완벽한 512×512 PNG를 내보냅니다.
PNG 형식은 Wix 파비콘 업로드에 가장 적합한 선택입니다. 투명도를 지원하므로 컬러 또는 흰색 배경 상자 없이 밝은 브라우저 테마와 어두운 브라우저 테마 모두에서 아이콘이 깔끔하게 보이도록 합니다. ICO 파일은 필요하지 않습니다. — Wix는 PNG를 변환하고 올바른 MIME 유형으로 제공합니다.
Wix Studio(Wix의 전문 계층)는 설정 > 웹사이트 정보 아래 동일한 위치에 파비콘 설정을 배치합니다. 또한 Studio에서는 SVG 파비콘 또는 apple-touch-icon 태그가 필요한 경우 `<head>` 섹션에 고급 사용자 정의 코드 삽입을 허용합니다. Wix Studio 프로젝트에 헤드 스크립트를 추가하려면 설정 > 사용자 정의 코드로 이동하세요.
Wix 대시보드에 파비콘을 업로드한 후 변경 사항을 적용하려면 사이트를 다시 게시해야 합니다. 편집기 오른쪽 상단에 있는 게시를 클릭하세요. Wix는 사용자 정의 도메인의 모든 페이지에 새 파비콘을 전파합니다. 대시보드에 저장되었지만 게시되지 않은 변경 사항은 방문자에게 표시되지 않습니다.
Wix는 '<link rel='icon'>' 태그 삽입을 자동으로 처리하므로 코드를 추가할 필요가 없습니다. Wix는 또한 업로드된 파비콘의 크기를 필요한 크기로 조정하여 iOS 홈 화면 저장을 위한 기본 apple-touch-icon 항목을 삽입합니다. 사용자 정의 180×180 apple-touch-icon(파비콘과 다름)의 경우 Wix Velo 사용자 정의 코드 삽입을 사용하세요.
알파 채널이 포함된 PNG를 업로드하면 투명한 배경이 Wix에 의해 유지됩니다. 아이콘의 배경이 단색인 경우 어두운 모드 브라우저 탭에 색상 상자가 표시됩니다. 업로드하기 전에 배경 채우기 없이 로고를 내보내세요. 밝은 배경과 어두운 배경 모두에서 아이콘을 렌더링하는 favicon tester를 사용하여 투명도가 올바르게 작동하는지 확인할 수 있습니다.
Wix Velo(Wix 내의 JavaScript 개발 플랫폼)는 고급 파비콘 사용자 정의를 허용합니다. Velo의 `wixLocation` 및 페이지 이벤트를 사용하면 페이지마다 다른 파비콘 링크 태그를 동적으로 삽입할 수 있습니다. 이는 제품별 브랜딩이 포함된 전자 상거래 사이트나 각 섹션이 서로 다른 아이콘을 사용하는 다중 카테고리 사이트에 유용합니다.
Wix가 기본 파비콘 지원을 도입하기 전에 생성된 Wix 템플릿을 사용하는 경우 파비콘 설정이 다른 위치에 나타나거나 전혀 존재하지 않을 수 있습니다. 이 경우 Wix의 사용자 정의 코드 삽입을 사용하십시오. 설정 > 사용자 정의 코드 > 코드 추가 > 각 페이지의 '<head>'에 코드를 삽입하고 호스팅된 파비콘에 대한 링크와 함께 '<link rel='icon' href='URL'>' 태그를 수동으로 추가하세요.
Wix ADI(인공 디자인 인텔리전스) 사이트는 설정 마법사 중에 브랜드 자산을 제공하는 경우 자동으로 브랜드 자산에서 파비콘을 설정합니다. 설정 > 웹사이트 정보 > 파비콘 경로를 사용하여 언제든지 ADI가 선택한 파비콘을 재정의할 수 있습니다. ADI에서 생성된 파비콘은 저해상도 로고인 경우가 많습니다. 이를 특수 제작된 아이콘으로 교체하는 것이 좋습니다.
Wix 파비콘을 게시한 후 비공개/시크릿 브라우저 창에서 라이브 도메인을 열어 로컬 브라우저 캐시 없이 업데이트된 아이콘을 확인하세요. 하루가 지난 후에도 일반 탐색에서 이전 파비콘이 계속 표시된다면 Wix 문제가 아니라 브라우저 캐시일 가능성이 높습니다. 강제 새로 고침(Ctrl+Shift+R 또는 Cmd+Shift+R)을 수행하면 브라우저가 캐시된 아이콘을 강제로 삭제합니다.
Wix 사이트에서 PWA 설치 지원을 원하는 기업을 위해(전체 크기 앱 아이콘과 스플래시 화면이 있는 모바일 홈 화면에 사이트 추가) Wix는 기본 PWA 기능을 제한했습니다. Wix의 사용자 정의 코드 삽입을 사용하여 192×192 및 512×512 PNG 아이콘이 포함된 외부 호스팅 site.webmanifest 파일을 가리키는 `<link rel='manifest'>` 태그를 추가하세요. 전체 매니페스트 설정은 web app manifest guide를 참조하세요.
작동 방식
- 1
512×512 PNG 파비콘 생성
로고나 브랜드 마크가 포함된 [favicon generator](tool:favicon-generator)를 소스로 사용하세요. 패키지에서 512×512 PNG를 다운로드하세요. 이는 Wix에 적합한 크기입니다.
- 2
설정 > 웹사이트 정보를 엽니다.
Wix 대시보드(편집기 아님)에서 설정 > 웹사이트 정보로 이동한 후 아래로 스크롤하여 파비콘 섹션을 찾으세요.
- 3
PNG를 업로드하세요
업로드 영역이나 기존 파비콘 썸네일을 클릭하고 Wix 미디어 관리자 또는 장치에서 512×512 PNG를 선택한 후 확인하세요. 설정을 저장합니다.
- 4
사이트 게시
Wix 편집기에서 게시 버튼을 클릭하세요. Wix는 라이브 사용자 정의 도메인의 모든 페이지에 업데이트된 파비콘 태그를 삽입합니다.
- 5
시크릿 창에서 확인
비공개/시크릿 브라우저 창에서 라이브 도메인을 엽니다. 새 파비콘이 탭에 나타납니다. 빠른 외부 점검을 위해 [favicon tester](utility:favicon-tester)를 사용하십시오.
지금 사용해 보기
Wix 지원 파비콘 생성
파비콘 생성기자주 묻는 질문
Wix의 파비콘 설정은 어디에 있나요?+
설정 > 웹사이트 정보 > 파비콘(정확한 라벨은 Wix 버전이나 템플릿에 따라 '탭 파비콘' 또는 '사이트 아이콘'일 수 있음). 정사각형 PNG를 업로드하고 저장한 후 게시를 클릭하여 라이브 사이트에 적용하세요.
Wix 파비콘의 크기는 얼마나 되어야 합니까?+
Wix에는 최소 100×100픽셀이 필요하지만 512×512 PNG가 강력히 권장됩니다. 더 큰 소스에서 시작하면 Wix가 눈에 띄는 품질 손실 없이 32×32(탭 크기)로 다운샘플링할 수 있습니다.
내 Wix 파비콘에 여전히 이전 아이콘이 표시되는 이유는 무엇입니까?+
새 파비콘을 업로드한 후 게시를 클릭했는지 확인하세요. 저장된 변경 사항은 게시될 때까지 실시간으로 푸시되지 않습니다. 그런 다음 비공개/시크릿 창에서 사이트를 열어 브라우저의 로컬 파비콘 캐시를 우회하세요.
Wix에서 SVG 파비콘을 사용할 수 있나요?+
기본 설정 패널을 통하지 않고 래스터 형식만 허용합니다. SVG를 사용하려면 설정 > 사용자 정의 코드 > 헤드 코드에서 사용자 정의 코드 '<link rel='icon' type='image/svg+xml' href='URL'>'를 추가하고 SVG를 외부에서 호스팅하세요.
Wix는 apple-touch-icon를 자동으로 추가합니까?+
Wix는 업로드된 파비콘 이미지에서 기본 apple-touch-icon를 삽입합니다. 사용자 정의 180×180 apple-touch-icon(탭 파비콘과 별도)의 경우 Wix Velo 또는 설정 > 사용자 정의 코드를 통해 링크 태그를 수동으로 삽입하세요.
내 Wix 파비콘에 여전히 기본 Wix 아이콘이 표시됩니다. 어떻게 해야 합니까?+
설정 > 웹사이트 정보에서 새 파비콘을 저장한 다음 편집기에서 게시를 클릭하세요. 사이트가 사용자 정의 도메인(Wix 하위 도메인 미리보기뿐만 아니라)에 게시되었는지 확인하세요. 브라우저 캐시를 지우고 시크릿 창에서 시도해 보세요.
다른 Wix 페이지에 다른 파비콘을 가질 수 있나요?+
예, Wix Velo를 사용하고 있습니다. 페이지당 맞춤 코드 삽입을 추가하거나 Velo의 페이지 준비 이벤트를 사용하여 현재 페이지 경로를 기반으로 '<link rel='icon'>' 요소를 동적으로 업데이트하세요.