How can I add a space between the Currency Symbol and the Price?

Hi,
Please add this CSS inside Customize > Additional CSS

.woocommerce ul.products li.product .price .amount > span {
    margin-right: 3px;
}

Thanks.

Found this solution on this site:

https://jilt.com/blog/pricing-remove-currency-symbol/

// Remove all currency symbols
function sww_remove_wc_currency_symbols( $currency_symbol, $currency ) {
     $currency_symbol = '￡ ';
     return $currency_symbol;
}
add_filter('woocommerce_currency_symbol', 'sww_remove_wc_currency_symbols', 10, 2);

• This reply was modified 5 years ago by SjoerdFarber.

The soulution you posted works only if you have one currency. Otherwise, I would reccommend using CSS:

span.woocommerce-Price-currencySymbol {margin-left: 3px;}

Of course margin is related to font-family…adjust accordingly.

• This reply was modified 4 years, 6 months ago by alby54.

Using CSS to add the space is really tiring. The currency can be added in multiple places (product list, details, search results, custom blocks, sidebar, generated PDF product page …). If you have to add a different space depending on the font size and weight everywhere you will endup missing some place.

Moreover, you’ll have to do it again if you change your style.

Using a simple snippet as provided here above will do the trick and will be far more efficient.

Here is what I use so I can handle multiple currencies ($ without space, CHF and € with space.

function tim_wc_add_space_currency( $currency_symbol, $currency ) {
	if ('CHF' == $currency) {
		$currency_symbol = 'CHF ';
	}
    
    return $currency_symbol;
}
add_filter('woocommerce_currency_symbol', 'tim_wc_add_space_currency', 10, 2);

the post from Ashish works for me many thanks

but what’s about the basket ? Subtotal, Total amount
and in the upper right corner ?
there is the same problem ??

@gardenzwerg Did you try my solution? Just add the code in your functions.php file to see if it solves your problem.

@timotheemoulin thank you very much…works perfectly.

I use a snippet plug in in my wp to activate your code and solved… danke

Or this. You can replace ‘RON’ and ‘lei’ with your currency and currency display option. I used Code Snippets to add the PHP code.

add_filter('woocommerce_currency_symbol', 'change_existing_currency_symbol', 10, 2);

function change_existing_currency_symbol( $currency_symbol, $currency ) {
     switch( $currency ) {
          case 'RON': $currency_symbol = ' lei'; break;
     }
     return $currency_symbol;
}

You go to WooCommerce, Settings, and at the bottom, you will find options for currency. There you have the possibility to change where the currency will be shown (left or right) and you can also chose left with space or right with space.

The solution provided by @timotheemoulin works 100%.

Thanks a lot

@mormocea Thanks for the help.