1° Agregar este código en functions php
// Agregar shortcode para mostrar la cantidad de artículos en el carrito con icono
add_shortcode( 'cantidad_carrito', 'mostrar_cantidad_carrito' );
function mostrar_cantidad_carrito() {
if ( class_exists( 'woocommerce' ) && function_exists( 'WC' ) ) {
$woocommerce = WC();
if ( isset( $woocommerce->cart ) ) {
$cantidad = $woocommerce->cart->get_cart_contents_count();
$carrito_url = $woocommerce->cart->get_cart_url();
$html = '<a href="' . $carrito_url . '" class="carrito-icono">';
$html .= '<img src="https://i.ibb.co/3rX8hXd/2023-06-20-01-54-35-Window.png" alt="Carrito" width="35" height="35">';
if ( $cantidad > 0 ) {
$html .= '<span class="cantidad-carrito">' . $cantidad . '</span>';
}
$html .= '</a>';
return $html;
}
}
}
2° Agregar este CSS en donde se este ejecutando el icono del carrito en wp-admin/customize.php:
.carrito-icono {
display: inline-block;
position: relative;
}
.carrito-icono img {
vertical-align: middle;
}
.cantidad-carrito {
background-color: #f00;
border-radius: 50%;
box-sizing: border-box;
color: #fff;
font-size: 12px;
font-weight: bold;
height: 18px;
line-height: 18px;
padding: 0 4px;
position: absolute;
right: -8px;
text-align: center;
top: -6px;
visibility: hidden;
width: 18px;
}
.cantidad-carrito:empty {
visibility: hidden;
}
.cantidad-carrito:not(:empty) {
visibility: visible;
}
0 Comentarios