网站优化

网站优化

Products

当前位置:首页 > 网站优化 >

如何覆盖Wordpress内联!重要风格

GG网络技术分享 2025-03-18 16:12 6


问题描述:

I am using WooCommerce on Wordpress - the \'Add to cart\' button on the product page has not changed with my updated global styling as it has an inline style:

<button type=\"submit\" class=\"single_add_to_cart_button button alt gradient_\" style=\"color: rgb(0,0,0)!important\">Add to basket</button>

I can\'t override this with CSS so need to find the code in the template and remove it. When looking through my template I was able to find this in content-single-product.php

<div class=\"summary entry-summary\">

<?php

/**

* Hook: woocommerce_single_product_summary.

*

* @hooked woocommerce_template_single_title - 5

* @hooked woocommerce_template_single_rating - 10

* @hooked woocommerce_template_single_price - 10

* @hooked woocommerce_template_single_excerpt - 20

* @hooked woocommerce_template_single_add_to_cart - 30

* @hooked woocommerce_template_single_meta - 40

* @hooked woocommerce_template_single_sharing - 50

* @hooked WC_Structured_Data::generate_product_data() - 60

*/

do_action( \'woocommerce_single_product_summary\' );

?>

</div>

Where do I find the hook that I need to edit, presumably

* @hooked woocommerce_template_single_add_to_cart - 30

图片转代码服务由CSDN问答提供

感谢您的意见,我们尽快改进~

功能建议

我在Wordpress上使用WooCommerce - 产品页面上的“添加到购物车”按钮没有随我更新而改变 全局样式,因为它具有内联样式:</ p>

 &lt; button type =“submit”class =“single_add_to_cart_button button alt gradient_”style =“color:rgb(0,0,  0)!important“&gt;添加到购物篮&lt; / button&gt; 

</ code> </ pre>

我无法用CSS覆盖它,所以需要在模板中找到代码并删除 它。 在查看我的模板时,我能够在content-single-product.php </ p>

 &lt; div class =“summary entry-summary”&gt; 

&lt; ?php

/ **

* Hook:woocommerce_single_product_summary。

*

* @hooked woocommerce_template_single_title - 5

* @hooked woocommerce_template_single_rating - 10

* @hooked woocommerce_template_single_price - 10

* @hooked woocommerce_template_single_excerpt - 20 \\ n * @hooked woocommerce_template_single_add_to_cart - 30

* @hooked woocommerce_template_single_meta - 40

* @hooked woocommerce_template_single_sharing - 50

* @hooked WC_Structured_Data :: generate_product_data() - 60

* /

do_action(\'woocommerce_single_product_summary\'); \\ n?&gt;

&lt; / div&gt;

</ code> </ pre>

我在哪里可以找到需要编辑的挂钩,大概是</ p>

  * @hooked wooc  ommerce_template_single_add_to_cart  -  30 

</ code> </ pre>

</ div>

网友观点:

There is an error in the jquery code you have been used

The code you have used is

<script>

jQuery(\'a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart\').removeAttr(\'style\');

});

</script>

Replace the code as

<script>

jQuery(\'a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart\').removeAttr(\'style\');

</script>

Then it will work,

###

Template file with \\\"add to cart\\\" button is probably located is wp-content/you-theme/woocommerce/single-product/add-to-cart/simple.php (or any file in single-product/add-to-cart)

###

To customize the add to cart button you just have to open the WordPress customizer. In the WordPress admin go to

1) Appearance -> Customize and load the customizer.

Then in the customizer click on Buttons -> Alternate button background color and set your color.

2) Press Save & Publish and you\'re done.

###

Style attribute can be removed using jQuery. You need to add your css in theme style.css or any other place so that it gets loaded in header. Here is the code that can be pasted in functions.php of the current theme.

    function ks_footer(){

?>

<script>

jQuery(function() {

jQuery(\'a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart\').removeAttr(\'style\'); //3 Red Buttons

jQuery(\'.single_add_to_cart_button\').removeAttr(\'style\');

}); //Top Blue Button

</script>

<?php

}

add_action( \'wp_footer\', \'ks_footer\' );

Here is the quick Tryit editor to demonstrate the idea.

标签:

提交需求或反馈

Demand feedback