코스모스팜 스레드
우커머스 싱글 상품페이지에 버튼 추가
안녕하세요. 워드프레스로 페이지를 구축하다가 찾다 찾다 지쳐서 질문합니다.
기본적으로 우커머스에서는 현재 상품 상세페이지 안에 [장바구니] 버튼만을 제공을 하는데
우커머스 퀵 바이 플러그인을 통해 [바로구매] 버튼을 추가까지 성공하였습니다.
필요한 버튼이 3가지가 더 있는데 클릭 시 지정 url로 이동되는 단순한 버튼인데
구글링 결과 아래 소스를 넣으면 구동된다는 거까지는 가능했으나,
사진과 같이 장바구니와 바로구매 사이에 버튼이 지정되었으며,
css에서 마진을 주어 아래로 이동시키려 했으나, 원래 기본 제공되었던 장바구니 버튼과 같이 이동이 되는 현상이 발생했습니다..
이 버튼만 하단으로 수정하고 싶은데 어떻게 해야 할까요 ㅠㅠ?
add_action('woocommerce_after_add_to_cart_button','cmk_additional_button');
function cmk_additional_button() {
echo '<a href="http://naver.com"button type="submit" class="button">Change me please</button>';
}
-
스레드봇 (30639 Point)ㆍ2017.03.30 12:00
woocommerce_after_add_to_cart_button 액션을 보시면
말 그대로 카트(장바구니) 버튼 다음에 무언가를 실행하는 액션입니다.
따라서 카트(장바구니) 버튼 옆에 추가하신 버튼이 나오는게 맞습니다.
바로 구매 버튼은 어떻게 추가하셨는지요?
원하시는대로 버튼 위치를 변경하시려면,
아무래도 우커머스의 템플릿 파일을 직접 수정하셔야 할 듯합니다.
-
스레드봇 (30639 Point)ㆍ2017.03.30 12:11
woocommerce_after_add_to_cart_button 액션 대신
woocommerce_after_add_to_cart_form 액션을 사용해보시겠어요?
아래처럼요~^^
add_action('woocommerce_after_add_to_cart_form','cmk_additional_button');
function cmk_additional_button() {
echo '<a href="http://naver.com"button type="submit" class="button">Change me please</button>';
} -
sjflower (25 Point)ㆍ2017.03.30 18:25
답변감사합니다.
form액션을 사용하면 바로구매버튼안에 chang me 버튼이 들어가져서 다른방법을 찾는도중
add_action( 'woocommerce_single_product_summary', 'my_extra_button_on_product_page', 30 );
function my_extra_button_on_product_page() {
global $product;
echo '<a href="http://naver.com"button type="submit" class="button" id="6bt">5%할인(6개월홈서비스)</button>';
}이런식으로 수정했습니다.
장바구니 바로하단으로 버튼을 옮기는건 성공하였으나, 다른문제가생겨버렸습니다.
카테고리도 버튼으로 클래스가 먹히면서 링크도 같이 변해버렸네요.
커스텀해서 만든버튼의 효과도 카테고리와 동일하게 링크가 걸립니다 ㅠㅠ
도통뭐가 문제인지모르겠네요 ㅠㅠ
-
스레드봇 (30639 Point)ㆍ2017.03.31 12:53
자세히 보니 태그도 문제가 있군요.
a 태그로 시작해서 button 태그로 끝나는군요.
<a href="http://naver.com"button type="submit" class="button" id="6bt">5%할인(6개월홈서비스)</button>
아래 처럼 사용하시거나,
<a href="http://naver.com" class="button" id="6bt">5%할인(6개월홈서비스)</a>
또는 아래 처럼 해주셔야 할 듯합니다.
<button type="button" class="button" id="6bt">5%할인(6개월홈서비스)</button>
href 속성이 있으니 a 태그를 사용하셔야겠지요.
그리고 button 태그에서 type 속성은 잘 사용하셔야 합니다. 잘못 사용하시면 제대로 동작하지 않고 이상현상 발생합니다.
