I'm trying to hyperlink text on a WooCommerce custom cart notice. But when I add the following bit of code it uses the default style sheet to display the link as a button on the far right. I just want to hyperlink the words "Pallet Shipping" on this specific notice without changing the style sheet for all other notices. Is there a way I can add a class to this specific notice?
This is what I want to add:
<a title="Learn More About Pallet Shipping" href="https://multitrance.com/shipping-delivery/?utm_source=website&utm_medium=checkout-page-notice&utm_campaign=pallet-shipping#Pallet_Shipping" target="_blank" rel="noopener noreferrer"><span style="color: white; text-decoration: underline">Pallet Shipping</span></a>
This is the snippet that generates the notice:
add_action( 'woocommerce_before_calculate_totals', 'cart_items_shipping_class_message', 20, 1 );
function cart_items_shipping_class_message( $cart ){
if ( ! is_cart() || ( is_admin() && ! defined( 'DOING_AJAX' ) ) )
return;
if ( did_action( 'woocommerce_before_calculate_totals' ) >= 2 )
return;
$shipping_class_id = '150'; // Your shipping class Id
// Loop through cart items
foreach( $cart->get_cart() as $cart_item ){
// Check cart items for specific shipping class, displaying a notice
if( $cart_item['data']->get_shipping_class_id() == $shipping_class_id ){
wc_clear_notices();
wc_add_notice( sprintf('Cartons of Beer can only be shipped via Pallet Shipping. To reveal much cheaper UPS Shipping Rates, remove Beer Cartons from the Cart.', 'woocommerce'),
'notice' );
break;
}
}
}
Doing this, creates a button:
add_action( 'woocommerce_before_calculate_totals', 'cart_items_shipping_class_message', 20, 1 );
function cart_items_shipping_class_message( $cart ){
if ( ! is_cart() || ( is_admin() && ! defined( 'DOING_AJAX' ) ) )
return;
if ( did_action( 'woocommerce_before_calculate_totals' ) >= 2 )
return;
$shipping_class_id = '150'; // Your shipping class Id
// Loop through cart items
foreach( $cart->get_cart() as $cart_item ){
// Check cart items for specific shipping class, displaying a notice
if( $cart_item['data']->get_shipping_class_id() == $shipping_class_id ){
wc_clear_notices();
wc_add_notice( sprintf('Cartons of Beer can only be shipped via <a title="Learn More About Pallet Shipping" href="https://multitrance.com/shipping-delivery/?utm_source=website&utm_medium=checkout-page-notice&utm_campaign=pallet-shipping#Pallet_Shipping" target="_blank" rel="noopener noreferrer"><span style="color: white; text-decoration: underline">Pallet Shipping</span></a>. To reveal much cheaper UPS Shipping Rates, remove Beer Cartons from the Cart.', 'woocommerce'),
'notice' );
break;
}
}
}
This is the result:
This is what I want to achieve:
I resolved it by adding a class to the link and styling it to my linking using Custom CSS.
Here's the HTML code:
Here's the CSS (you need to style the default style sheet):