How to add FontAwesome icon instead on text in php?

Question

I'm trying replace string "Add to cart" with cart's icon. The question is how to insert font awesome icon <i class="fa fa-shopping-cart" aria-hidden="true"></i> inside this php code:

$text = $this->is_purchasable() && $this->is_in_stock() ? __( 'Add to cart', 'woocommerce' ) : __( 'Read more', 'woocommerce' );

return apply_filters( 'woocommerce_product_add_to_cart_text', $text, $this );

Thanks in advance

Answer 1

St Pavel,

Not familiar with woocommerce but...

Did you try:

$text = $this->is_purchasable() && $this->is_in_stock() ? __( '<i class="fa fa-shopping-cart" aria-hidden="true"></i>', 'woocommerce' ) : __( 'Read more', 'woocommerce' );

EDIT:

From your comment, it looks like apply_filters function does not accept HTML value as an arg, for it's second param. As such, here's what I recommend:

Most simplest approach is to use jQuery:

I looked at the demo here: https://demo.woothemes.com/storefront/shop/ inspected the "Add to cart" button... as far as <a> tag's class goes, the value is: class="button product_type_simple add_to_cart_button ajax_add_to_cart fa fa-cart-plus"

As such you can do either:

jQuery('a.ajax_add_to_cart').addClass('fa fa-cart-plus');

or

jQuery('a.add_to_cart_button').addClass('fa fa-cart-plus');

EDIT #2:

And since you are trying to replace the text with the icon (and not have icon AND text), do the following:

jQuery('a.ajax_add_to_cart').text('');

or

jQuery('a.add_to_cart_button').text('');

Hope this helps!

-Rush

Answer 2

woocommerce/loop/add-to-cart.php

replace this

sprintf( '<a rel="nofollow" href="%s" data-quantity="%s" data-product_id="%s" data-product_sku="%s" class="%s">
    <i class="fa fa-shopping-cart"></i>&nbsp;&nbsp;%s</a>',