source

제품 유형에 따라 WooCommerce의 "ADD TO CART" 버튼 옆에 있는 커스텀 버튼

bestscript 2023. 3. 1. 11:16

제품 유형에 따라 WooCommerce의 "ADD TO CART" 버튼 옆에 있는 커스텀 버튼

메인샵 페이지와 단일 제품 페이지 모두에서 제품 유형에 따라 WooCommerce의 "Add to Cart" 버튼 옆에 커스텀 "View Demo" 버튼을 추가하고 싶습니다.

다음 단계를 수행했습니다.

테마 파일에 코드 추가header.php:

<script>var url_demo = "<?php echo the_field('url_demo'); ?>"</script>

"TC Custom JavaScript" 플러그인을 사용하여 jQuery 스크립트 추가:

jQuery(function($) {
 $('.add_to_cart_button, .single_add_to_cart_button').after(' <a class="button demo_button" style="padding-right: 0.75em;padding-left: 0.75em;margin-left: 8px; background-color: #0ebc30;" href="'+url_demo+'" target="_blank">View Demo</a>');
});

메인 숍 페이지와 단일 제품 페이지에 표시되는 커스텀 버튼 '데모 보기'입니다.

단, "View Demo" 버튼 링크는 단일 제품 페이지에서만 올바르고, 상점 메인 페이지에서는 "View Demo" 버튼은 동일한 URL로 링크됩니다.위의 코드가 잘못되었습니까?

궁금한 점은 메인 숍 페이지와 단일 제품 페이지 모두에 데모 보기 버튼을 추가하는 방법입니다(예를 들어 테마 카테고리에만 표시됨).마지막으로, Demo 링크를 편집하지 않고 추가할 수 있는 다른 방법이 있습니까?header.php위와 같은 방법으로 파일을 작성할 수 있습니까?난 그저 기대했을 뿐이야header.php테마가 갱신되면 파일이 리셋됩니다.

는 그것을 하기 위해 다른 방법을 사용하고 있다: WooCommerce 훅.

jQuery 스크립트와 헤더에 있는 javascript는 더 이상 필요하지 않습니다.php 파일을 지웁니다.

사용.get_field()대신the_field(Deepti chipdey덕분에) Deepti Chipdey에 연결된 값만 얻을 수 있습니다.echoed스트링

코드 스니펫을 함수에 붙여넣습니다.php 파일은 활성 하위 테마 또는 테마 폴더에 있습니다.

function wc_shop_demo_button() {
    echo '<a class="button demo_button" style="padding-right: 0.75em;padding-left: 0.75em;margin-left: 8px; background-color: #0ebc30;" href="'.get_field( "url_demo" ).'" target="_blank">View Demo</a>';
}
add_action( 'woocommerce_after_shop_loop_item', 'wc_shop_demo_button', 20 );
add_action( 'woocommerce_after_add_to_cart_button', 'wc_shop_demo_button', 20 );

샵 페이지와 단일 제품 페이지에 Add to cart 버튼을 표시하기 위해 사용하는 후크를 타겟으로 하여 View 데모 버튼을 표시하고 우선순위를 낮춥니다.

어떤 이유에서인지 Loic TheAztec의 답변은 나에게 효과가 없었다.

다음은 작동한 내용입니다.

function wc_shop_demo_button() {
    echo '<a class="button demo_button" href="'.get_field( "url_demo" ).'" target="_blank">View Demo</a>';
}
add_action( 'woocommerce_after_add_to_cart_button', 'wc_shop_demo_button' );

그게 누군가의 여정에 도움이 됐으면 좋겠어요.

바꾸다

the_field('url_demo');

로.

 get_field('url_demo');

어떤 이유에서인지 위의 답변은 저에게 오류를 던집니다.이 코드를 사용하여 다른 코드와 조합하여 해결했습니다.

  1. Woocommerce 제품을 편집하고 다음 이름으로 속성을 추가합니다.url_demo그리고 의 가치your-demo-url.
  2. 자녀 테마 함수에 아래 코드를 추가합니다.php 파일(또는 부모 테마이지만 권장하지 않습니다):
/* Adding demo button to Woocommmerce products */
function wc_shop_demo_button() {
  $product = wc_get_product(get_the_id());
  $url_demo = $product->get_attribute('url_demo');
  echo '<a class="button" href="'.$url_demo.'" target="_blank">View Demo</a>';
}
add_action('woocommerce_after_shop_loop_item', 'wc_shop_demo_button', 20);
add_action('woocommerce_after_add_to_cart_button', 'wc_shop_demo_button', 20);

언급URL : https://stackoverflow.com/questions/37228791/custom-button-next-to-add-to-cart-button-of-woocommerce-based-on-product-type