Woocommerce 點選圖片就可以直接加入購物車或是到結帳頁面
點選商品圖片後的行為網址
客戶常常是想要快速結帳,所以通常希望在商品頁面中,點選圖片就可以直接進入結帳了,這時候在 wordpress woocommerce 中沒有特別好用的 Pugin 可以利用,我的解法是在佈景主題中的 functions.php ,加入下面的程式碼片段,其中add-to-cart=id , id 指的是商品 id , quantity=1,1 是數量。
- 點選圖片後,會直接到結帳頁面,/checkout/?add-to-cart=’.$product->get_id().’quantity=1
- 點選圖片後,會直接到購物車,/cart/?add-to-cart=’.$product->get_id().’&quantity=1
- /?add-to-cart=’.$product->get_id()
functions.php
// woocommerce // 設定圖片上的商品連結 if ( ! function_exists( 'woocommerce_template_loop_product_link_open' ) ) { /** * Insert the opening anchor tag for products in the loop. */ function woocommerce_template_loop_product_link_open() { global $product; //原先的設定 //$link = apply_filters( 'woocommerce_loop_product_link', get_the_permalink(), $product ); // 1.改成直接到結帳頁面中 $link = '/checkout/?add-to-cart='.$product->get_id().'&quantity=1'; // 2.點選圖片直接會到購物車中 $link = '/cart/?add-to-cart='.$product->get_id().'&quantity=1'; // 3.點選圖片後不跳轉,但會加入到購物車中 $link = '/?add-to-cart='.$product->get_id(); echo '<a href="' . esc_url( $link ) . '" class="woocommerce-LoopProduct-link woocommerce-loop-product__link">'; } }
搜尋商品後,點選產品清單中的圖片直接進入購物車
/wp-content/themes/themename/template-tags.php
修改$permalink = !empty( $args[‘permalink’] ) ? $args[‘permalink’] : ‘/checkout/?add-to-cart=’.$post_id.’quantity=1′;
function et_extra_get_post_thumb( $args = array() ) { $default_args = array( 'post_id' => 0, 'size' => '', 'height' => 50, 'width' => 50, 'title' => '', 'link_wrapped' => true, 'permalink' => '', 'a_class' => array(), 'img_class' => array(), 'img_style' => '', 'img_after' => '', // Note: this value is not escaped/sanitized, and should be used for internal purposes only, not any user input 'post_format_thumb_fallback' => false, 'fallback' => '', 'thumb_src' => '', 'return' => 'img', ); $args = wp_parse_args( $args, $default_args ); $post_id = $args['post_id'] ? $args['post_id'] : get_the_ID(); // add to cart link //$permalink = !empty( $args['permalink'] ) ? $args['permalink'] : get_the_permalink( $post_id ); $permalink = !empty( $args['permalink'] ) ? $args['permalink'] : '/checkout/?add-to-cart='.$post_id.'quantity=1'; $title = !empty( $args['title'] ) ? $args['title'] : get_the_title( $post_id ); $width = (int) apply_filters( 'et_extra_post_thumbnail_width', $args['width'] ); $height = (int) apply_filters( 'et_extra_post_thumbnail_height', $args['height'] ); $size = !empty( $args['size'] ) ? $args['size'] : array( $width, $height ); $thumb_src = $args['thumb_src']; $img_style = $args['img_style']; $thumbnail_id = get_post_thumbnail_id( $post_id ); if ( !$thumbnail_id && !$args['thumb_src'] ) { if ( $args['post_format_thumb_fallback'] ) { $post_format = et_get_post_format(); if ( in_array( $post_format, array( 'video', 'quote', 'link', 'audio', 'map', 'text' ) ) ) { $thumb_src = et_get_post_format_thumb( $post_format, 'thumb' ); } else { $thumb_src = et_get_post_format_thumb( 'text', 'thumb' ); } } else if ( !empty( $args['fallback'] ) ) { return $args['fallback']; } else { $thumb_src = et_get_post_format_thumb( 'text', 'icon' ); } } if ( $thumbnail_id ) { list($thumb_src, $thumb_width, $thumb_height) = wp_get_attachment_image_src( $thumbnail_id, $size ); } if ( 'thumb_src' === $args['return'] ) { return $thumb_src; } $image_output = sprintf( '<img src="%1$s" alt="%2$s"%3$s %4$s/>%5$s', esc_attr( $thumb_src ), esc_attr( $title ), ( !empty( $args['img_class'] ) ? sprintf( ' class="%s"', esc_attr( implode( ' ', $args['img_class'] ) ) ) : '' ), ( !empty( $img_style ) ? sprintf( ' style="%s"', esc_attr( $img_style ) ) : '' ), $args['img_after'] ); if ( $args['link_wrapped'] ) { $image_output = sprintf( '<a href="%1$s" title="%2$s"%3$s%5$s> %4$s </a>', esc_attr( $permalink ), esc_attr( $title ), ( !empty( $args['a_class'] ) ? sprintf( ' class="%s"', esc_attr( implode( ' ', $args['a_class'] ) ) ) : '' ), $image_output, ( !empty( $img_style ) ? sprintf( ' style="%s"', esc_attr( $img_style ) ) : '' ) ); } return $image_output; }
近期留言