WP 이미지 줌

설명

글/페이지의 이미지와 우커머스 제품을 위한 멋진 이미지 확대/축소 플러그인

WP 이미지 줌은 강력하고 현대적이며 구성이 매우 쉬운 이미지 줌 플러그인입니다. 매우 직관적인 WP 관리자 인터페이스에서 이미지에 돋보기를 쉽게 만들 수 있습니다.

방문자는 이미지의 아름다운 디테일을 볼 수 있습니다. 이렇게 하면 사용자 경험이 향상되고 수익도 향상될 것입니다.

기능

  • 4가지 줌 유형 – 내부 줌, 원형 렌즈, 사각형 렌즈, 외부 줌(줌 창 포함).
  • 애니메이션 완화 효과 – 줌 렌즈가 이미지 위로 마우스를 따라가면서 슬쩍 지연됩니다. 이 효과는 줌 경험에 우아함을 더합니다.
  • 페이드 효과 – 확대된 부분이 부드럽게 페이드 인 또는 페이드 아웃됩니다.
  • 매우 구성 가능-줌 렌즈 크기, 테두리 색상, 테두리 크기, 그림자, 둥근 모서리 등을 제어합니다 …
  • 우커머스와 연동 – 모든 제품 이미지의 확대/축소를 쉽게 활성화할 수 있습니다. 체크박스만 누르면 됩니다.
  • 페이지 및 글에서 작동 – 글/페이지 편집기에서 모든 이미지에 확대/축소 효과를 적용할 수 있는 버튼을 찾을 수 있습니다.

페이지 벌라이더와 함께 플러그인 사용하기

페이지 빌더 내에서 페이지/글의 이미지에 확대/축소 기능을 적용하려면 이미지에 “zoom” CSS 클래스를 추가해야 합니다. 다음은 가장 인기 있는 페이지 빌더에서 이 작업을 수행하는 방법에 대한 스크린샷입니다:
* 구텐베르크 – 스크린샷
* 페이지 빌더 버전에 따라 1) 스크린샷에서 이미지 크기 설정에 “대형” 또는 “전체”를 선택합니다. 또는 2) 스크린샷.
* 사이트오리진의 페이지 빌더 – 스크린샷
* Elementor 페이지 빌더 – 스크린샷. 사용자 정의를 제외한 모든 이미지 크기 옵션에서 작동합니다.
* 비버 빌더 – 스크린샷
* 디비 빌더 – 스크린샷 (디비 테마에서 사용)
* Avia 레이아웃 빌더 – 스크린샷 (Enfold 테마에서 사용)
* 퓨전 페이지 빌더 – 스크린샷
* 브리지 페이지 빌더 – 스크린샷
* 타츠 페이지 빌더 – 스크린캐스트
줌은 이미지 요소에서만 정상적으로 작동합니다. 안타깝게도 이미지 갤러리에서 줌을 적용하려고 하면 갤러리의 첫 번째 이미지에서만 줌이 작동합니다. WP 이미지 줌 프로를 사용하면 이미지 갤러리에도 줌을 적용할 수 있습니다.

왜 WP 이미지 줌 프로로 업그레이드해야 하나요?

  • 반응형(줌 창이 브라우저 너비에 맞게 조정됨)
  • 마우스 휠 줌
  • 우커머스 변형과 함께 작동
  • 포트폴리오 이미지와 함께 작동
  • 쉬운 디지털 다운로드 추천 이미지와 함께 작동
  • 마켓프레스 – 워드프레스 전자상거래와 함께 작동
  • 라이트박스 및 캐러셀 내 확대/축소
  • 줌 창 위치(이미지에서 왼쪽 또는 오른쪽)를 선택할 수 있습니다.
  • 같은 페이지에서 두 개 이상의 이미지에 사용할 수 있습니다.
  • 사용자 지정 테마 지원

참고

  • 이 플러그인은 워드프레스 범위 내에서 ‘있는 그대로’ 제공됩니다. 보안을 유지하고 WP 코딩 표준을 따르기 위해 이 플러그인을 업데이트할 예정입니다.
  • 보다 고급스럽고 강력한 플러그인 기능을 갖춘 보다 전담적인 지원을 원한다면 WP Image Zoom Pro로 업그레이드하는 것을 고려해 보세요.

스크린샷

  • 원형 렌즈의 구성 메뉴

  • 사각형 렌즈의 구성 메뉴

  • 줌 창 구성 메뉴

  • 게시물의 이미지에 확대 적용

  • 일반 구성 메뉴

  • 추천 이미지에 줌 창이 적용된 우커머스 제품 페이지

  • 단일 이미지 요소인 WPBakery에서 확대/축소 적용

  • 사이트오리진의 페이지 빌더, 이미지 위젯에서 확대/축소 적용

설치

  • WP 관리자 패널에서 “플러그인” -& gt; “새로 추가”를 클릭합니다.
  • 브라우저 입력창에 “WP 이미지 줌”을 입력합니다.
  • “WP 이미지 줌” 플러그인을 선택하고 “설치”를 클릭합니다.
  • 플러그인을 활성화합니다.

또는…

  • 예. 이 페이지에서 플러그인을 다운로드하세요.
  • .zip 파일을 컴퓨터의 위치에 저장합니다.
  • WP 관리자 패널을 열고 “플러그인” -> “새로 추가”를 클릭합니다.
  • “업로드”를 클릭한 다음 이 페이지에서 다운로드한 .zip 파일을 찾습니다.
  • “설치”…를 클릭한 다음 “플러그인 활성화”를 클릭합니다.

또는…

  • 예. 이 페이지에서 플러그인을 다운로드하세요.
  • .zip 파일을 컴퓨터의 위치에 압축을 풉니다.
  • 웹사이트 파일 디렉터리에 액세스하려면 FTP 또는 호스트의 cPanel을 사용하세요.
  • wp-content/plugins 디렉터리를 찾습니다.
  • 압축을 푼 wp-image-zoooom 폴더를 이 디렉토리 위치에 업로드합니다.
  • WP 관리자 패널을 열고 “플러그인” 페이지…를 클릭한 다음 새로 추가된 “WP 이미지 줌” 플러그인 아래에서 “활성화”를 클릭합니다.

FAQ

캐싱 플러그인과 함께 작동하나요?

줌은 내 우커머스 갤러리의 첫 번째 이미지에만 표시됩니다.

줌은 기본 WooCommerce 갤러리의 모든 이미지에서 정상적으로 작동하지만 일부 테마는 갤러리를 올빼미 캐러셀 또는 다른 갤러리/캐러셀/슬라이더로 완전히 대체합니다. 이 플러그인은 갤러리를 변경하는 것이 아니라 현재 갤러리에 확대/축소를 추가할 뿐이며 각 갤러리/캐러셀/슬라이더 구현과의 호환성을 보장할 수 없습니다.

줌 렌즈가 표시되지만 사진이 확대되지 않습니다.

확대/축소가 작동하려면 웹사이트에 표시된 사진보다 더 큰 사진을 업로드해야 합니다. 줌 레벨을 더 세밀하게 제어하려면 PRO 버전으로 업그레이드하세요. 여기에서 줌 레벨을 제시된 사진 크기의 2배 또는 3배로 설정할 수 있습니다.

더 큰 사진을 업로드했는데도 줌이 작동하지 않는 경우 제트팩 광자 모듈을 비활성화해 볼 수 있습니다. 이 모듈은 이미지 크기를 조정하고 줌을 방해합니다.

확대/축소 창이 확대된 이미지보다 약 1cm 낮습니다.

이는 워드프레스 관리 모음으로 인해 발생하는 현상입니다. 로그아웃하고 확대/축소를 다시 확인해 보세요.

또 다른 원인은 고정 헤더일 수 있습니다. 페이지가 로드되면 확대/축소 창이 만들어지고 올바른 위치(확대된 이미지 옆)에 설정됩니다. 아래로 스크롤하면 고정 헤더의 높이는 변경되지만 줌 창은 계속 같은 위치에 유지됩니다. 이 문제를 해결하려면 헤더의 고정 효과를 제거하거나 줌 창이 완전히 다르게 만들어지고 고정 헤더가 줌 위치에 영향을 미치지 않는 WP Image Zoom PRO로 업그레이드하는 방법 중 하나를 선택할 수 있습니다.

또 다른 원인은 WPBakery 내의 “CSS 애니메이션” 설정일 수 있습니다. 애니메이션 효과를 유지하면서 확대/축소 기능을 계속 사용하려면 WP 이미지 줌 프로로 업그레이드하는 것이 좋습니다.

편집기에서 버튼 없이 이미지를 확대하려면 어떻게 해야 하나요?

이미지에 ‘zoom’이라는 CSS 클래스를 추가하면 해당 특정 이미지에 확대/축소가 적용됩니다. 확대/축소는 표시된 이미지가 로드된 이미지보다 작을 때만 작동합니다(즉, 이미지가 ‘너비’ 및 ‘높이’ 속성으로 축소된 경우).

“지연 로드” 플러그인을 사용하려는 경우 작동하나요?

유니브 지연 로드, WP 이미지 지연 로드지연 로드 플러그인과의 호환성을 보장할 수 있습니다.

내 이미지가 탭 안에 있습니다.

줌 렌즈는 이미지를 기준으로 페이지 로드를 기준으로 만들어지며 이미지가 다른 탭에 숨겨져 있어도 마우스를 가리키면 표시됩니다. 줌은 탭 내의 이미지에서 작동하도록 만들어지지 않았기 때문에 이에 대해 저희가 할 수 있는 조치는 없습니다.

또는 Pro 버전으로 업그레이드하면 줌 렌즈가 페이지 로드가 아닌 마우스 커서를 기준으로 작동하므로 탭 내 이미지에서도 줌이 작동합니다.

알려진 비호환성

  • 웹사이트에 Black Studio TinyMCE 위젯과 “SiteOrigin의 사이트 빌더” 플러그인이 모두 설치되어 있는 경우 글 편집 및 페이지 편집기에 WP 이미지 줌 버튼이 표시되지 않습니다. 하지만 이미지에 “zoom” CSS 클래스를 추가하면 확대/축소를 적용할 수 있습니다.

  • 아바다 테마의 이미지 캐러셀에서는 줌이 제대로 작동하지 않습니다. 같은 페이지에서 줌과 캐러셀을 함께 사용할 수 없습니다.

  • 우커머스 동적 갤러리 플러그인에서는 확대/축소가 전혀 작동하지 않습니다.

  • 아바다 테마의 WooCommerce 갤러리에서는 줌이 작동하지 않습니다. 아바다 테마는 기본 WooCommerce 갤러리를 플렉스슬라이더 갤러리로 완전히 변경하며, 줌 플러그인은 플렉스슬라이더 갤러리를 지원하지 않습니다. 플러그인의 PRO 버전에서 플렉스슬라이더 갤러리와의 호환성을 확인하시기 바랍니다.

크레디트

  • CC0 퍼블릭 도메인 라이선스에 따라 https://pixabay.com/en/camera-retro-ricoh-old-camera-813814/ 데모 사진 제공

후기

2024년 6월 3일
So i tried the plugin, it was working as expected, there was a little “bug”, i have tried to fix myself, but no luck. Then i contacted the support of plugin, after like 2 minutes i received a response with the fix and IT WORKED. I am not sure why people rate the plugin anything less than 5 stars, but this is the must have plugin for you woocommerce website!
2023년 12월 2일
We tested about 3 zoom plugins for woocommerce/twentytwenty-three theme. We experienced from double image galleries to zoom images that jumped right out of the frame and disappeared into nowhere.This free version, which was number 4 in the test row-> did it. No hassle just easy plug&play. Perfect result! Thank you for your great work!
모든 116 평가 읽기

기여자 & 개발자

“WP 이미지 줌”(은)는 오픈 소스 소프트웨어입니다. 다음의 사람들이 이 플러그인에 기여하였습니다.

기여자

“WP 이미지 줌”(이)가 2 개 언어로 번역되었습니다. 기여해 주셔서 번역자님께 감사드립니다.

자국어로 “WP 이미지 줌”(을)를 번역하세요.

개발에 관심이 있으십니까?

코드 탐색하기는, SVN 저장소를 확인하시거나, 개발 기록RSS로 구독하세요.

변경이력

1.58 2024-11-08

  • 스크립트 API 전략 기능을 사용하여 워드프레스 6.3 이상에서 프런트엔드 스크립트를 연기하기
  • MutationObserver 인터페이스를 사용하여 WooCommerce 갤러리에서 이미지 변경을 관찰합니다.
  • 기능: 모든 하위 이미지 요소에서 줌 효과를 비활성화하기 위한 “no-zoom” CSS 클래스

1.57 2024-06-30

  • 칼륨 테마와의 호환성
  • 한국어 번역 파일 추가

1.56 2024-03-29

  • 기능: AVIF 이미지 지원

1.55 2023-12-19

  • 수정: PHP8.3 사용 중단 공지

1.54 2023-11-14

  • 수정 : 고유 크기가 0보다 큰 SVG 이미지 지원

1.53 2023-05-17

  • 우커머스 “사용자 지정 주문 테이블” 기능과의 호환성

1.52 2022-11-16

  • 수정 : 줌 렌즈가 Flatsome 테마의 메뉴 아래에 있어야합니다.
  • 수정: 우커머스 카테고리 페이지에서 플레이스홀더 사진 확대/축소 제거
  • 기능: SVG 이미지 지원

전체 변경 로그 보기.