WooCommerce에 제품 디자이너를 추가하는 방법

고객이 직접 제품을 디자인하게 하고 싶습니까? 그렇다면 올바른 기사를 찾은 것입니다. 오늘 우리는 고객이 그렇게 할 수 있도록 제품 디자이너를 WooCommerce에 추가 하는 방법을 보여 드리겠습니다.

그러나 이에 대해 알아보기 전에 제품 디자이너가 무엇인지, WooCommerce 스토어에 제품 디자이너를 추가하려는 이유를 더 잘 이해하겠습니다. 간단히 제품 디자이너의 기본 아이디어부터 시작하겠습니다.

제품 디자이너란 무엇입니까?

그것이 티셔츠, 컵, 가방, 전화 케이스, 노트북 또는 기타 품목이든 많은 사람들은 이러한 제품을 개인화하기를 원합니다. 이것이 바로 주문형 인쇄(POD) 가 요즘 매우 인기 있는 이유입니다.

고객이 개인화된 제품을 얻을 수 있도록 돕기 위해 많은 온라인 비즈니스에서 제품 디자이너라고도 하는 제품 구성기를 사용합니다. 제품 디자이너는 고객이 자신의 희망과 아이디어에 따라 기존 제품을 사용자 정의하는 데 사용할 수 있는 도구입니다. 그들은 글자를 추가하고, 색상을 변경하고, 취향에 따라 이미지를 선택하거나 업로드할 수 있습니다.

상점 자체는 고객이 원하는 대로 조정할 수 있는 기본 제품만 제공합니다. 그러나 제품 디자이너의 도움으로 고객은 제품에 창의성을 불어넣을 수 있습니다.

이것이 제품 디자이너에 대한 아이디어를 제공하기를 바랍니다. 이제 WooCommerce에 제품 디자이너를 추가해야 하는 몇 가지 이유를 살펴보겠습니다.

WooCommerce 스토어에 제품 디자이너를 추가해야 하는 이유는 무엇입니까?

위에서 제품 디자이너가 WooCommerce 스토어에 추가할 수 있는 훌륭한 도구를 보았습니다.

의심할 여지 없이 WooCommerce는 본격적인 온라인 상점을 위한 최고의 플랫폼 중 하나입니다. 고객에게 더 많은 선택과 더 많은 옵션을 제공 하기 위해 제품 디자이너는 WooCommerce 스토어에 추가할 수 있습니다.

WooCommerce 스토어에 제품 디자이너를 통합하면 고객을 수용할 수 있을 뿐만 아니라 도구에서 제공하는 다양한 디자인 옵션도 제공할 수 있습니다. 비록 제한된 제품 선택만이 가능하지만 궁극적으로 고객은 자신의 희망과 아이디어에 따라 제품을 변경할 수 있는 수많은 선택권을 갖게 됩니다.

따라서 기본 제품을 맞춤형 제품으로 변경 하는 것이 좋습니다. 사용자가 가장 쉬운 방법으로 개별화된 제품을 얻을 수 있도록 합니다.

지금까지 제품 디자이너의 중요성을 이해하셨기를 바랍니다. 이제 다음 단계로 넘어가 WooCommerce에 제품 디자이너를 추가해 보겠습니다.

WooCommerce에 제품 디자이너를 추가하는 방법은 무엇입니까?

WooCommerce에 제품 디자이너를 추가하는 가장 쉬운 방법은 전용 제품 디자이너 플러그인을 사용하는 것입니다. 마켓플레이스에서 무료 플러그인과 프리미엄 플러그인을 모두 찾아 WooCommerce 스토어에 제품 커스터마이저를 통합할 수 있습니다 . 그리고 가장 좋은 점은 이러한 플러그인을 사용하는 데 프로그래밍 경험이 필요하지 않다는 것입니다.

최고의 제품 디자이너 플러그인 몇 가지와 이를 사용하여 WooCommerce 제품을 디자인하는 방법을 살펴보겠습니다.

WooCommerce를 위한 Zakeke 인터랙티브 제품 디자이너

WooCommerce용 Zakeke Interactive Product Designer를 사용하면 제품 커스터마이저를 상점에 통합할 수 있습니다. 의류, 인쇄 제품, 머천다이징, 모바일 케이스, 판촉 선물 또는 기타 제품을 판매하든 Zakeke는 고객이 제품을 맞춤화할 수 있도록 합니다. 텍스트, 로고, 이미지 및 클립 아트를 변경하거나 추가하여 제품을 사용자 정의할 수 있습니다.

뿐만 아니라 개인화 된 제품을 라이브 3D로 볼 수 있습니다. 반응형 플러그인이기도 하므로 고객은 모바일 장치에서 제품 사용자 정의 도구를 사용할 수 있습니다.

주요 특징들

• 1억 4천만 개 이상의 고품질 이미지에 액세스
• 맞춤형 제품의 3D 모델 보기
• 50개 이상의 이미지 필터 및 편집 도구 포함
• 삶의 변화 보기

가격

플러그인을 무료로 다운로드할 수 있지만 Zakeke와 스토어를 연결하려면 프리미엄 버전으로 업그레이드해야 합니다. 스타터 플랜은 월 6.99 USD부터 시작합니다.

멋진 제품 디자이너

Fancy Product Designer 는 Codecanyon에서 가장 많이 팔리는 프리미엄 제품 디자이너 플러그인 중 하나입니다. 사용자가 직접 제품을 디자인할 수 있도록 모든 제품을 맞춤형 제품으로 변경할 수 있습니다. 다른 제품 디자이너 플러그인과 비교하여 이 플러그인은 프런트 엔드에 광범위한 디자인 옵션이 있어 고객이 원하는 제품을 빠르고 쉽게 만들 수 있습니다.

뿐만 아니라 이미 광범위한 기능을 사용하더라도 기능 에 추가 애드온을 추가 할 수 있는 옵션이 있습니다. 추가 애드온을 사용하면 사용자가 만든 제품의 요소에 따라 최종 가격을 보다 유연하게 계산할 수 있습니다.

주요 특징들

• 여러 미디어 소스
• 주요 다중 공급업체 플러그인과 통합 가능
• 색상 선택 패널
• 사용자는 자신의 디자인을 그려 사용할 수 있습니다.

가격

Fancy Product Designer는 6개월 동안 지원 및 향후 업데이트가 포함된 69달러부터 시작하는 프리미엄 플러그인입니다.

다음은 WooCommerce에서 기본 제품을 사용자 정의 가능한 제품으로 쉽게 전환할 수 있는 플러그인 중 일부입니다. 이제 단계별로 수행하는 방법을 살펴보겠습니다.

이 튜토리얼에서는 WooCommerce 플러그인 에 대해 Zakeke Interactive Product Designer를 사용할 것입니다. 그것을 사용하려면 먼저 플러그인을 설치하고 활성화해야 합니다.

그러나 시작하기 전에 이 가이드를 따르는 동안 문제가 발생하지 않도록 모든 단계에 따라 WooCommerce를 설정하고 호환되는 WooCommerce 테마를 사용하는 것이 좋습니다.

1단계. WooCommerce용 Zakeke Interactive Product Designer 설치 및 활성화

플러그인을 시작하고 설치해 보겠습니다. 그렇게 하려면 WordPress 대시보드로 이동하여 플러그인>새로 추가 로 이동합니다.

이제 플러그인 추가 페이지로 리디렉션됩니다. 여기에서 플러그인 검색창에 'Zakeke Product Designer '를 입력합니다. 결과가 표시되면 지금 설치 를 클릭하고 활성화 버튼을 클릭합니다.

이것으로 Zakeke Interactive Product Designer 플러그인의 무료 버전을 성공적으로 설치했습니다. 그러나 Zakeke를 WooCommerce 스토어와 연결하려면 요구 사항에 맞는 플랜을 구매 해야 합니다.

프리미엄 버전을 구매하려면 공식 플러그인 페이지를 방문하거나 플러그인 설정 단계에서 원하는 플랜을 선택할 수 있습니다. 그런 다음 WooCommerce 웹사이트에 플러그인을 수동으로 설치해야 합니다.

2단계. Zakeke와 WooCommerce 연결

플러그인을 설치하고 활성화하면 WordPress 대시보드 메뉴의 왼쪽에서 Zakeke 제품 디자이너를 찾을 수 있습니다. 그런 다음 추가된 메뉴를 클릭하고 ' 연결 ' 버튼을 클릭합니다.

이제 Zakeke를 WooCommerce에 통합 하는 두 가지 옵션이 제공됩니다. Zakeke에 기존 계정이 있는 경우 로그인하거나 신규 사용자인 경우 가입할 수 있습니다.

가입하려면 이름, 이메일, 비밀번호 설정과 같은 개인 정보만 있으면 됩니다. 필드에 필요한 모든 세부 정보를 추가한 후 ' 계정 만들기 ' 버튼을 클릭하십시오.

그런 다음 WooCommerce 스토어에서 다양한 작업을 만들고, 보고, 관리할 수 있는 액세스 권한을 부여하라는 메시지가 표시됩니다. 승인 버튼을 클릭합니다.

클릭하면 요금제를 선택하거나 최대 14일 동안 플러그인을 무료로 사용해 볼 수 있는 페이지로 리디렉션됩니다.

또한 스타터 플랜 외에 다른 플랜을 선택하면 판매되는 모든 제품에 대해 1.9%의 추가 거래 수수료 가 부과됩니다.

3단계. 맞춤형 제품 추가

마지막으로 제품을 만들고 구성할 수 있습니다. 이를 위해 Zakeke 사용 시작 버튼을 클릭하십시오.

매장에서 제품을 추가하거나 주문형 인쇄 서비스 옵션을 선택할 수 있습니다.

이 자습서에서는 데모 스토어의 제품을 추가합니다.

다음으로 매장의 모든 제품을 볼 수 있습니다. 구성하려는 제품을 선택합니다. 미리 온라인 스토어에 제품을 추가했는지 확인하십시오.

같은 제품의 다른 이미지를 뒷면과 같이 다른 각도에서 업로드하여 변형을 만들 수 있습니다. 이미지를 업로드한 후 인쇄 영역 설정 버튼 또는 인쇄 영역 편집을 클릭합니다.

여기에서 자의 도움으로 디자인 영역의 치수를 설정할 수 있습니다. 디자인의 경우 인쇄 영역에 대해 사각형 및 원과 같은 여러 모양을 선택할 수 있습니다. 인쇄 측정이 완료되면 저장 버튼을 클릭합니다.

당신은 또한 제품의 변화에 ​​대한 측정을 설정할 수 있습니다. 여기에서는 변형 부분을 건너뛰고 ' 나는 변형을 제공하지 않습니다. 미리보기로 이동 ' 버튼을 클릭하겠습니다.

클릭하면 리뷰 페이지로 이동합니다. 여기에서 모든 세부 정보가 포함된 제품을 미리 볼 수 있습니다. 제품을 스토어에 게시하거나 제품을 초안으로 저장할 수 있습니다.

4단계. 인쇄 방법 설정

다음으로 다양한 인쇄 사용자 지정 옵션을 선택하여 인쇄 방법을 설정할 수 있습니다.

인쇄 방법을 설정하려면 Zakeke 플러그인 대시보드로 이동하십시오. 열에서 인쇄 방법 을 선택한 다음 추가 버튼을 클릭합니다.

여기에서 파일 형식, 파일 형식, 다양한 해상도, 여러 텍스트 효과 등을 선택할 수 있습니다.

마지막으로 인쇄 방법이 적용될 제품을 선택할 수 있습니다. 저장 버튼을 클릭했는지 확인하십시오.

5단계. WooCommerce에서 제품 디자이너 사용하기

이제 제품을 추가하고 인쇄 방법을 설정했으므로 제품을 디자인할 수 있는 방법을 살펴보겠습니다.

제품을 선택하기만 하면 사용 중인 테마에 따라 제품 옆에 사용자 정의 버튼이 표시됩니다.

사용자 정의 버튼을 클릭하면 고객이 텍스트, 이미지, 글꼴, 스타일 및 색상으로 제품을 디자인할 수 있는 제품 디자이너 인터페이스로 연결됩니다.

사용자 정의가 완료되면 디자인을 다양한 소셜 플랫폼에 공유하거나 디자인을 저장하거나 PDF 형식으로 디자인을 다운로드 하거나 장바구니에 제품을 추가할 수 있습니다.

그 후 고객은 다른 일반 제품과 마찬가지로 최종 제품을 미리 보고 결제할 수 있습니다.

보너스: WooCommerce 체크아웃에 제품 이미지 표시

우리는 이미 WooCommerce에 제품 디자이너를 추가 하는 가장 쉬운 방법 중 하나를 제시했습니다. 제품을 사용자 정의한 후 고객은 장바구니와 결제 중에 미리 볼 수 있습니다.

결제 시 커스터마이징 가능한 상품의 상품 이미지가 표시되지만, 일반 상품은 그렇지 않습니다. 결제 시 제품 제목만 표시됩니다.

이것은 고객이 올바른 제품을 가지고 있는지 여부를 제품 제목으로 확인하는 데 불편할 수 있습니다.

이것이 보너스 로 WooCommerce 체크아웃에 제품 이미지를 추가 하는 방법에 대한 이 가이드를 제공하는 이유입니다.

결제 시 제품 이미지를 표시하는 가장 쉽고 빠른 방법은 스니펫 코드를 사용하는 것입니다. 이 방법에는 코딩 지식이 필요하지 않습니다.

그러나 웹사이트의 전체 백업을 만들고 테마의 핵심 부분을 편집할 것이기 때문에 하위 테마를 사용하는 것이 좋습니다. 코드로 하위 테마를 만들거나 사용 가능한 하위 테마 플러그인을 사용할 수 있습니다.

이제 functions.php 파일을 열어봅시다. Apperance>Theme Editor>functions.php 로 이동하십시오.

여기에서 다음 코드를 복사하여 functions.php 파일 끝에 스니펫을 붙여넣고 업데이트할 수 있습니다.

 add_filter( 'woocommerce_cart_item_name', 'quadlayers_product_image_checkout', 9999, 3 );
기능 quadlayers_product_image_checkout( $name, $cart_item, $cart_item_key ) {
if ( ! is_checkout() ) {
반환 $ 이름;
}
$_product = apply_filters( 'woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key );
$썸네일 = $_product->get_image();
$이미지 = '<div class="quadlayers_product_image_checkout">'
. $썸네일 .
'</div>'; 
/* 위에서 원하는 대로 이미지의 너비, 높이 및 정렬을 변경할 수 있습니다.*/
$이미지를 반환합니다. $이름;
}

그리고 그게 다야. 파일을 업데이트한 후 결제 페이지를 미리 볼 수 있습니다.

이 스니펫은 제품 이미지를 인라인 스타일로 결제 페이지에 추가합니다. 마찬가지로 제품 이미지를 다양한 다른 스타일로 표시할 수 있습니다. 그렇게 하는 방법을 배우고 싶다면 이 가이드를 확인하여 결제 페이지를 사용자에게 친숙하게 만드십시오.

결론

이것이 WooCommerce 스토어에 제품 디자이너를 추가 하는 방법입니다. 그들은 고객이 스스로 제품을 디자인하는 데 매우 유용할 수 있습니다.

요약하자면, 제품 디자이너를 추가하는 가장 쉬운 방법은 플러그인을 사용하는 것입니다. 여러 도구와 플러그인이 있지만 Zakeke의 제품 구성기를 사용하는 것이 가장 좋은 옵션 중 하나입니다.

또한 결제 시 제품 이미지를 표시하는 방법에 대한 간단한 가이드를 제공했습니다. 마찬가지로 결제 페이지를 사용자 지정하려는 경우 다양한 방법을 사용하여 WooCommerce 결제 페이지를 편집하는 방법에 대한 자세한 가이드가 있습니다. WooCommerce용 Checkout Manager 및 WooCommerce용 Direct Checkout과 같은 플러그인을 사용하여 코드를 사용하지 않고도 그렇게 할 수 있습니다.

이제 WooCommerce에 제품 디자이너를 추가할 수 있습니까? 우리 가이드를 따랐습니까? 의견 섹션에서 귀하의 경험에 대해 알려주십시오.

그 동안 WooCommerce 블로그를 더 읽고 싶다면 여기에 몇 가지 기사가 있습니다.

• WooCommerce에서 제품에 이미지를 추가하는 방법
• 최고의 WordPress 출시 예정 페이지 플러그인(무료 및 유료)
• WooCommerce에 가상 제품을 추가하는 방법