WooCommerce 결제 페이지를 사용자 정의하는 방법

체크아웃 페이지는 여러 가지 이유로 현대 전자 상거래 웹사이트에서 본질적으로 가장 중요한 부분입니다. 주된 이유는 고객이 온라인 쇼핑 경험을 위해 가능한 가장 원활하고 번거롭지 않은 결제 프로세스를 요구하기 때문입니다.

모든 전자 상거래 장바구니의 70-85%가 결제 과정에서 버려지기 때문에 결제 페이지가 표시되는 방식이 이 섹션에서 가장 중요한 역할을 합니다. 이러한 포기의 대부분은 WooCommerce 결제 페이지 디자인이 표시되는 방식과 마지막 순간에 장바구니에 대한 고객의 마음이 바뀌는 방식에 책임이 있습니다.

이 문제를 비준하기 위해 가장 좋은 해결책은 WooCommerce 장바구니를 가져와 동일한 페이지에서 보다 원활한 결제 경험을 제공하는 것입니다.

WooCommerce에서 사용자 정의 결제 페이지를 만드는 방법

처음에는 모든 필요한 필드가 포함된 기능적인 WooCommerce 체크아웃 페이지를 갖는 것이 어려운 작업처럼 보입니다. 그러나 실제로 제대로 구성된 WooCommerce 체크아웃 페이지 템플릿을 사용하면 상당히 간단한 프로세스입니다.

운 좋게도 ShopReady와 같은 도구가 있습니다. WooCommerce Shop 빌더에는 WooCommerce 모듈과 위젯이 함께 제공되므로 많은 작업을 수행하므로 코딩에 대해 걱정할 필요가 없으며 대신 사용자 정의하는 방법에 집중할 수 있습니다. 브랜드 아이덴티티에 맞는 WooCommerce 결제 페이지.

적절하게 양식화된 체크아웃 페이지를 갖는 것이 중복되어 보일 수 있지만. 그러나 가능한 최고의 쇼핑 시설을 위해 전자 상거래 플랫폼을 최적화하려고 할 때 모든 것이 중요하다는 것을 믿으십시오.

이제 WooCommerce 체크 아웃 페이지 사용자 정의 프로세스로 넘어 갑시다.

1단계: WooCommerce 체크아웃 페이지 사용자 정의 플러그인 설치

WordPress에 다양한 기능을 위한 별도의 플러그인을 설치하는 대신 이 사용자 지정 프로세스에 ShopReady WooCommerce Shop Builder 를 사용할 것입니다. WooCommerce 샵 빌더를 설치하려면 WordPress 계정에 로그인하고 플러그인 대시보드로 이동합니다. 여기에서 새로 추가 를 클릭 하고 ShopReady 플러그인을 검색한 다음 설치를 누르 십시오 .

플러그인 을 활성화 하려면 설치 프로세스가 완료될 때까지 기다리십시오 . WooCommerce 플러그인 과 Elementor 드래그 앤 드롭 페이지 빌더 를 설치하라는 메시지가 표시됩니다 .

이제 WooCommerce 제품 메뉴에서 전자 상거래 플랫폼에 제품을 추가할 수 있습니다. 어떻게 해야 할지 잘 모르겠다면. WooCommerce 제품 페이지 사용자 지정 을 위해 제품을 추가하는 방법에 대한 자세한 가이드가 있습니다 .

2단계: Elementor 템플릿 설치

다음으로 WooCommerce 매장 사용자 정의 프로세스를 진행하고 적절한 체크아웃 페이지를 적용하려면 적절한 WooCommerce WordPress 테마를 적용해야 합니다. 이는 전자 상거래 웹사이트를 수용하는 데 필요한 모든 기능과 시설을 제공합니다.

사용자 정의 작업을 단순화하기 위해 ShopReady – WooCommerce Shop Builder 제공 Elementor 전자 상거래 테마 를 가져올 수 있는 Elementor 템플릿 형태로 활용할 수도 있습니다.

현재 ShopReady에는 8개 이상의 완전한 기능을 갖춘 전자 상거래 테마가 포함되어 있습니다. 클릭 한 번으로 가져올 수 있는 이러한 테마는 WooCommerce 체크아웃 페이지 사용자 정의 필드, 장바구니에 추가 기능, 반응성이 뛰어난 제품 페이지, 제품 그리드, 제품 슬라이더 등을 수용하도록 설계 및 개발되었습니다.

이러한 템플릿 중 하나를 설치하려면 먼저 Unison – WordPress 플러그인 및 ShopReady WooCommerce Addon의 원클릭 데모 가져오기 도구로 작동하는 관련 백업 및 데모 콘텐츠 확장을 설치해야 합니다.

백업 및 데모 콘텐츠 확장 은 WordPress 저장소에서 설치한 후 Unison 대시보드에서 다운로드하고 활성화할 수 있습니다.

ShopReady WooCommerce 테마는 WordPress 대시보드 > 도구 > 데모 콘텐츠 설치 에서 설치할 수 있습니다 . 여기에서 ShopReady에서 제공하는 WooCommerce 템플릿을 선택하고 설치할 수 있습니다. 설치 를 클릭 하고 프로세스가 완료될 때까지 기다리면 WooCommerce 랜딩 페이지로 리디렉션됩니다.

최종 결과는 다음과 같아야 합니다.

3단계: ShopReady를 사용한 WooCommerce 장바구니 페이지 사용자 지정

이것은 효과적인 전자상거래 비즈니스를 운영하기 위해 반드시 포함되어야 하는 중요한 요소입니다. ShopReady와 같은 WooCommerce 스토어 빌더의 도움으로 WooCommerce 장바구니 단축 코드를 활용하고 이러한 방식으로 작동하는 전자 상거래 장바구니를 구성할 수 있습니다. 또는 ShopReady 위젯을 사용하여 이 기능을 웹사이트에 추가할 수 있습니다.

작동 가능한 카트를 얻으려면 먼저 " 장바구니에 추가 " 위젯을 제품 페이지에 추가해야 합니다. 우리가 이미 한 것입니다. 이제 상품이 장바구니에 추가되었으므로 구매 후 모든 상품이 표시되는 장바구니 페이지 자체를 구성해 보겠습니다.

ShopReady 사용자 – WooCommerce Shop Builder는 ShopReady 대시보드에서 액세스할 수 있는 두 가지 카트 템플릿 중 하나를 선택할 수 있습니다. 편집 버튼을 클릭하여 WooCommerce 사전 설정 장바구니 템플릿을 활성화하고 변경하십시오.

Elementor Editor 페이지로 리디렉션됩니다. 여기에서 장바구니 페이지 기능과 모양을 쉽게 사용자 지정할 수 있습니다.

이 시점에서 ShopReady 장바구니 위젯을 추가하는 것만 큼 쉽습니다. 그러면 장바구니 페이지가 즉시 모양을 취합니다. ShopReady를 사용하면 절차가 매우 간단하기 때문에 플러그인 없이도 WordPress 장바구니를 생성할 수 있습니다.

장바구니에 이미 무언가를 추가했다면 다음과 같아야 합니다.

추가 리소스: WooCommerce 대시보드에 제품을 추가하는 방법을 모르는 경우 – WooCommerce 스토어 페이지에 제품을 추가하는 방법 에 대한 이 가이드를 확인하세요.

4단계: 이제 WooCommerce 체크아웃 페이지를 편집하는 방법 WordPress

WooCommerce 체크아웃 페이지 CSS 코딩의 지루한 과정을 거치는 대신 ShopReady 체크아웃 사전 설정 템플릿을 활용하여 페이지 사용자 정의를 더 빠르게 할 수 있습니다. 사전 설정 템플릿을 사용하면 WooCommerce 제품 페이지 사용자 정의 플러그인을 사용할 필요가 없을 뿐만 아니라 개발 작업에서 많은 시간과 번거로움을 줄일 수 있습니다.

시작하려면 WordPress 대시보드 > ShopReady 대시보드 > 템플릿 으로 이동 하십시오. 이제 WooCommerce Checkout 페이지 사전 설정을 활성화하고 편집 아이콘을 클릭합니다.

그러면 Elementor Editor 화면으로 리디렉션됩니다. 이제 Elementor 페이지 섹션에서 WooCommerce용 ShopReady Checkout 위젯을 사용하십시오.

그리고 거기에 WooCommerce 체크아웃 페이지 편집기가 있습니다. 이제 여기에서 콘텐츠 탭 레이아웃 옵션 에서 ShopReady가 제공하는 여러 사전 설정 체크아웃 필드 옵션 중에서 선택하고 선택할 수 있습니다 . 또는 자신만의 WooCommerce 추가 사용자 정의 필드 체크아웃 페이지를 만들 수 있습니다.

원하는 경우 WooCommerce 결제 페이지 사용자 지정 CSS를 활용하는 옵션과 함께 ShopReady ShortCode 위젯을 배포하여 WooCommerce 결제 페이지 단축 코드를 활용할 수도 있습니다.

ShopReady 위젯 백엔드를 통해 개발자와 코딩 전문가는 WooCommerce 체크아웃 페이지 후크를 활용하여 체크아웃 페이지를 나머지와 차별화하는 고유한 기능을 추가할 수도 있습니다. 그러나 대부분의 경우 사전 설정 템플릿에서 제공하는 콘텐츠의 양은 모든 전자 상거래 웹 사이트에 충분합니다.

5단계: 맞춤형 결제 페이지를 실시간으로 실행

완전히 새로운 사용자 정의 체크아웃 페이지를 사용자 정의했으면 이제 사용할 시간입니다. 그렇게 하려면 화면 왼쪽 하단에서 게시/업데이트 를 클릭하기만 하면 됩니다.

이제 제품을 확인하여 결과를 확인하십시오.

결론

WooCommerce 장바구니 포기는 전자 상거래 비즈니스 소유자에게 큰 골칫거리입니다. 많은 방문자가 체크아웃 페이지에서 장바구니를 포기합니다. 업계 전문가가 제안하는 것처럼 전자 상거래 장바구니 포기에 대응하는 가장 좋은 방법은 빠른 체크아웃 기능과 함께 잘 맞춤화된 WooCommerce 체크아웃 프로세스를 사용하는 것입니다.

이는 사용자가 장바구니 페이지에서 결제 페이지로 진행하는 데 걸리는 시간을 줄여 구매에 대한 관심을 유지하고 주문 확인을 진행합니다.