Search code examples
htmlcsswordpresswoocommercecart

Change shipping method rate value font weight in WooCommerce cart page


How do I remove the bold font from the shipping fees in WooCommerce cart page? I don't want to call too much attention to the shipping fee with the bold text, so I want to have regular font weight there.

Note that I renamed "Shipping" to "Delivery" below enter image description here

Update: Adding the html code below in response to question in comment section

<tr class="woocommerce-shipping-totals shipping">
<th>Delivery</th>
<td data-title="Delivery">
    <ul id="ship_method" class="woocommerce-ship-type">
        <li> 
        class="ship_method"/><label for="ship_method"> <span class="woocommerce_totals totals"><span class="woocommerce_curr_sym">&#36;</span>300.00</span></label>                 </li>
    </ul>
</td>


Solution

  • Edit based on your question 2nd Edit (where you changed the generated html output)

    You can use the following CCS rule to be added in your theme's styles.css file (for cart):

    .cart-collaterals #ship_method label,
    .cart-collaterals #ship_method label span {
        font-weight: normal !important;
    }
    

    For cart and checkout pages use:

    #ship_method label,
    #ship_method label span {
        font-weight: normal !important;
    }
    

    It should work.


    Original answer (works for Woocommerce default html structure)

    You can use the following CCS rule to be added in your theme's styles.css file (for cart):

    .cart-collaterals #shipping_method label,
    .cart-collaterals #shipping_method label span {
        font-weight: normal !important;
    }
    

    For cart and checkout pages use:

    #shipping_method label,
    #shipping_method label span {
        font-weight: normal !important;
    }
    

    It should work.