wordpress Woocommerce:更改订单按钮上的文本

mf98qq94  于 2023-08-03  发布在  WordPress
关注(0)|答案(6)|浏览(144)

我正在使用WooCommerce为一个非营利网站,并希望改变“下订单”按钮文本说“地方捐赠”。该按钮在WooCommerce的payment.php文件中定义:

<?php echo apply_filters( 'woocommerce_order_button_html', 
    '<input type="submit" class="button alt" name="woocommerce_checkout_place_order" 
    id="place_order" value="' . esc_attr( $order_button_text ) . 
    '" data-value="' . esc_attr( $order_button_text ) . '" />' ); ?>

字符串
我在子主题的functions.php文件中添加了以下内容:

function custom_order_button_text($order_button_text){
    $order_button_text = 'Place Donation';

    return $order_button_text;
}
add_filter('woocommerce_order_button_text', 'custom_order_button_text');


它似乎暂时工作,但在页面完成加载之前又变回“下订单”。输出的HTML最终为:

<input type="submit" class="button alt" name="woocommerce_checkout_place_order" 
id="place_order" value="Place order" data-value="Place Donation">

  • 更新:**我关闭了JavaScript,发现按钮上写着“Place Donation”。然后我在woocommerce/assets/js/frontend/checkout.js中找到了一个脚本,作为payment_method_selected的一部分。
if ( $( this ).data( 'order_button_text' ) ) {
    $( '#place_order' ).val( $( this ).data( 'order_button_text' ) );
} else {
    $( '#place_order' ).val( $( '#place_order' ).data( 'value' ) );
}


不知道最好的方法来覆盖它。有什么想法吗

k2arahey

k2arahey1#

您可以更改“下订单”按钮文本说“地方捐赠”使用简单的woocommerce挂钩如下。

/* Add to the functions.php file of your theme/plugin */

add_filter( 'woocommerce_order_button_text', 'wc_custom_order_button_text' ); 

function wc_custom_order_button_text() {
    return __( 'Place Donation', 'woocommerce' ); 
}

字符串
希望这对其他人有帮助。谢啦,谢啦

wz8daaqr

wz8daaqr2#

我自己也遇到了同样的问题。我解决这个问题的方法和你的方法很接近。
而不是完全出队,我出队,并上传了完全相同的脚本到我的子主题+注解了

`/* if ( $( this ).data( 'order_button_text' ) ) {
    $( '#place_order' ).val( $( this ).data( 'order_button_text' ) );
} else {
    $( '#place_order' ).val( $( '#place_order' ).data( 'value' ) );
}*/ `

字符串
PHP:

`add_action('wp_enqueue_scripts', 'override_woo_frontend_scripts');
function override_woo_frontend_scripts() {
    wp_deregister_script('wc-checkout');
    wp_enqueue_script('wc-checkout', get_template_directory_uri() . '/../storefront-child-theme-master/woocommerce/checkout.js', array('jquery', 'woocommerce', 'wc-country-select', 'wc-address-i18n'), null, true);
}    `

t1rydlwq

t1rydlwq3#

您更改按钮文本的尝试是有效的,但WooCommerce有一个讨厌的JavaScript,它会推翻这一切,正如您所发现的。
为了避免这种情况,我在functions.php文件中使用过滤器更改了订单按钮的ID,因此错误的WooCommerce JavaScript不会影响它。

function so37729878_update_order_button_id( $button_html ) {
    $button_html = str_replace( 'id="place_order"', 'id="place_order_updated_to_fix_translation"', $button_html );
    return $button_html;
}
add_filter( 'woocommerce_order_button_html', 'so37729878_update_order_button_id' );

字符串
这样你就不必交换任何WooCommerce脚本。订单表单仍然可以正确提交,尽管我不能100%确定这种方法是否会破坏其他行为。

pb3skfrl

pb3skfrl4#

可以使用此方法替换文本。

add_filter( 'woocommerce_order_button_html', 'custom_button_html' );

function custom_button_html( $button_html ) {
    $button_html = str_replace( 'Place order', 'Submit', $button_html );
    return $button_html;
}

字符串

kuarbcqp

kuarbcqp5#

我用CSS解决了这个问题:

#place_order { 
    font-size: 0px !important;
}

#place_order::after {
  content: 'Place Donation';
  font-size: 15px;
}

字符串

gab6jxml

gab6jxml6#

同样使用CSS,不改变文本大小:

.woocommerce-cart .wc-proceed-to-checkout a{      
    color: rgba(0, 0, 0, 0);    
}
    
.woocommerce-cart .wc-proceed-to-checkout a:hover{    
            color: rgba(0, 0, 0, 0);    
    }
        
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button::after {    
          position:absolute;    
            content: 'Donate'; 
            left: 0px;
            right: 0px;
            margin: 0 auto;
            color: rgba(0, 0, 0, 1);    
}

字符串

相关问题