블로그

Wix에 포토 갤러리 추가하는 방법

마지막 업데이트 날짜: 
Wix에 포토 갤러리 추가하는 방법

글은 몇 분 만에 사람의 마음을 바꿀 수 있지만, 사진은 단 몇 초면 충분합니다. 사진을 판매하는 포토그래퍼든, 매물을 안내하는 부동산 중개인이든, 제품의 모든 각도를 보여주는 온라인 쇼핑몰이든 웹사이트에서 시각 자료가 매우 중요한 이유가 바로 여기에 있습니다. 어떤 경우든 깔끔하고 반응형으로 구현된 갤러리는 방문자의 시선을 사로잡고, 제공하는 서비스나 제품에 대한 신뢰를 높여줍니다.

Wix는 이를 위한 기본 도구를 제공하며, 그중 가장 대표적인 것이 Wix Pro Gallery입니다. 이 기본 Wix 사진 갤러리는 모바일에서도 반응형 레이아웃을 지원하며, CMS 컬렉션에 연결하여 항목을 동적으로 표시할 수 있습니다. 하지만 고급 사용자에게는 몇 가지 아쉬운 점이 있습니다. Wix에 따르면 Pro Gallery 자체적으로는 페이지네이션 바를 지원하지 않으며(기본 대안으로 더 보기(Load More) 버튼 제공), CMS 방식을 사용하려면 사진 한 장을 보여주기 전에 컬렉션과 데이터세트를 먼저 구축해야 하는 번거로움이 있습니다.

메이슨리(Masonry) 그리드, 카테고리 필터, 파노라마 행 등 레이아웃을 더 세밀하게 제어하고 싶다면 일반적으로 두 가지 방법이 있습니다. 앱 마켓(App Market)에서 갤러리 앱을 설치하거나, 외부 갤러리 위젯을 임베드하는 것입니다.

옵션 1: Wix 앱 마켓에서 전용 갤러리 설치하기

가장 먼저 고려해 볼 수 있는 방법은 앱 마켓을 이용하는 것입니다. POWR의 Gallery와 같은 앱을 설치하고 자체 대시보드에서 사진을 관리해 보세요. Elfsight에서도 자체 사이트를 통해 임베드할 수 있는 유사한 Wix 사진 갤러리 솔루션을 제공합니다. 코딩 없이 기성 스타일을 바로 사용할 수 있다는 장점이 있지만, 도구마다 요금제 구조가 다르므로 전체 포트폴리오를 업로드하기 전에 세부 조건을 꼼꼼히 확인해야 합니다.

설정 방법

  1. 앱을 찾습니다. Wix 에디터에서 앱 마켓을 열고 “photo gallery”(사진 갤러리)를 검색하세요.
  2. 설치 가능한 포토 갤러리 앱을 표시하는 Wix 앱 마켓
  1. 페이지에 추가합니다. 앱을 설치한 후 설정 패널을 열어 사진을 업로드하세요.
  2. 이미지와 동영상을 추가하는 옵션을 보여주는 Wix POWR 갤러리 설정 패널
  1. 스타일을 선택하고 게시합니다. 레이아웃을 선택하고 간격과 캡션을 조정한 다음 사이트를 게시하세요.
  2. 레이아웃, 마우스 오버 효과 및 사용자 지정 옵션을 표시하는 Wix POWR 갤러리 디자인 설정

주의해야 할 사항:

  • 무료 요금제의 브랜딩 표시. POWR는 무료 요금제를 제공하지만, POWR 브랜딩 로고를 제거하려면 유료 Starter 요금제가 필요합니다.
  • 조회수 제한. Elfsight의 무료 포토 갤러리 요금제는 1개의 위젯과 월 200회의 조회수를 제공하며 Elfsight 브랜딩이 표시됩니다. 또한 한도를 초과하면 앱이 일시적으로 비활성화됩니다. 트래픽이 많은 포트폴리오 사이트의 경우 200회의 조회수는 금방 소진됩니다.
  • 페이지 용량. 큰 이미지는 최대 콘텐츠 렌더링 시간(LCP)에 영향을 미치며, Google은 2.5초 이하를 양호한 수준으로 평가합니다. 어떤 도구를 선택하든 업로드하기 전에 사진을 압축하세요.

옵션 2: 맞춤 설정 가능한 무료 포토 갤러리 위젯 추가 (추천)

Jform 포토 갤러리 위젯은 기존과는 다른 방식을 취합니다. 비주얼 에디터에서 갤러리를 제작하고 임베드 코드를 복사한 뒤, 표준 HTML 임베드 요소를 사용해 Wix 페이지에 붙여넣으면 됩니다. Wix 미디어 관리자 대신 위젯 빌더에서 사진을 관리할 수 있으며, 별도의 앱 구독 없이 바로 시작할 수 있어 효율적인 Wix 포토 갤러리 대안이 됩니다.

갤러리 제작은 사진을 추가하는 것부터 시작하며, 이후 과정은 대부분 마우스 클릭만으로 간편하게 진행됩니다. 코딩 지식이 전혀 필요하지 않으며, 사이트에 실제로 게시하기 전에 레이아웃이나 스타일을 원하는 만큼 얼마든지 변경할 수 있습니다. 작동 방식은 다음과 같습니다:

설정 방법

  1. 사진을 추가합니다. 이미지를 직접 업로드하거나, Google 포토에서 가져오거나, 이미지 URL을 붙여넣으세요. 그런 다음 제목, 카테고리 및 대체 텍스트(alt text)를 입력합니다.
  2. 업로드된 이미지와 갤러리 관리 컨트롤을 보여주는 포토 갤러리 위젯 빌더
  1. 레이아웃을 선택하고 스타일을 지정합니다. 원하는 레이아웃을 고른 후 열 개수, 간격, 팝업 동작 및 색상을 조정하세요. 카테고리를 추가했다면 필터 기능을 켤 수도 있습니다.
  2. 메이슨리, 그리드 및 캐러셀 레이아웃 옵션을 표시하는 포토 갤러리 위젯 레이아웃 설정
  1. Wix에 임베드하세요. 임베드 코드를 복사합니다. Wix 에디터에서 요소 추가(Add Elements)를 열고 임베드 코드(Embed Code), HTML 임베드(Embed HTML)를 차례로 선택한 다음, 코드 입력(Enter Code)을 클릭하여 스니펫을 붙여넣습니다. 요소를 원하는 너비로 늘린 후 게시합니다.
  2. 웹사이트에 삽입된 갤러리 임베드 코드를 보여주는 Wix HTML 설정 패널

Pro Tip

Wix에 따르면 크기가 고정된 임베드 코드는 화면 크기에 반응하지 않습니다. 게시하기 전에 에디터에서 모바일 화면을 먼저 확인해 보세요.

적합한 활용처

활용 사례추천 레이아웃설정 방법

사진작가

세로형 메이슨리(Vertical Masonry)

각 사진에 카테고리(웨딩, 인물, 이벤트 등)를 추가하고 필터를 활성화하여 방문자가 촬영 유형별로 탐색할 수 있도록 설정합니다.

부동산 중개인

파노라마(Panoramic) 또는 슬라이더(Slider)

매물 페이지마다 하나의 갤러리를 만듭니다. 제목을 방 이름으로 사용하고 사진을 가상 투어 또는 문의 페이지에 연결합니다.

이커머스 브랜드

그리드 또는 썸네일

팝업 보기를 통해 제품의 다양한 각도를 보여주거나, 각 사진을 클릭했을 때 해당 제품 페이지로 이동하도록 클릭 동작을 설정하세요.

사진작가라면 예약 접수 및 계약서 서명을 위해 갤러리를 Jform의 사진 촬영 양식 및 계약서와 함께 활용할 수 있습니다.

염두에 두어야 할 한 가지 제한 사항은 각 갤러리당 최대 16장의 사진만 등록할 수 있다는 점입니다. 이는 엄선된 포트폴리오나 단일 매물, 또는 개별 제품 페이지에 적합합니다. 대규모 아카이브가 필요한 경우에는 각 카테고리 페이지마다 별도의 위젯을 사용하거나 CMS에 연결된 프로 갤러리(Pro Gallery)를 사용하세요.

스마트한 서버리스 위젯으로 Wix 사이트의 기능 강화하기

대부분의 Wix 사이트에서는 임베드 방식의 Wix 포토 갤러리 위젯이 더 나은 선택입니다. 복잡한 CMS 설정이나 추가 앱 구독 없이도 메이슨리 레이아웃, 카테고리 필터, 팝업 탐색 기능을 제공하며, 모든 것을 한곳에서 편리하게 관리할 수 있기 때문입니다. 

CMS가 필요한 대규모 아카이브를 표시해야 하는 경우에만 프로 갤러리를 사용하세요. 단순히 대표 작업물을 깔끔하고 돋보이게 보여주고 싶다면 Jform 포토 갤러리 위젯으로 시작해 보세요.

Jform의 무료 웹사이트 위젯 디렉토리에 있는 모든 위젯에 동일한 임베드 방식을 적용할 수 있습니다. 다음 네 가지 위젯은 갤러리와 함께 사용할 때 특히 시너지가 좋습니다:

작업물을 전시하는 수수료가 아닌 실제 작업에 예산을 투자하세요. 방문자를 고객으로 전환할 준비가 되었다면 Jform Wix 통합 기능을 통해 문의, 예약 및 결제 양식을 추가할 수 있습니다. 아직 사이트를 제작 중이라면 Wix 웹사이트 빌더 가이드부터 시작해 보세요.

이 글은 기본 플랫폼의 제한에 부딪히거나 정기적인 앱 마켓 수수료를 지불하지 않고도, 아름답고 로딩이 빠른 이미지 그리드 또는 메이슨리(Masonry) 레이아웃의 Wix 포토 갤러리를 표시하고자 하는 Wix 사이트 소유자, 사진작가, 부동산 중개인 및 전자상거래 브랜드를 위해 작성되었습니다.

코멘트 보내기:

Jform Avatar
이 사이트는 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

Podo Comment 첫 번째 댓글을 남겨주세요.