Currency sign left aligned & amount right aligned

  • Posts: 91
  • Thank you received: 3
11 years 3 months ago #143453

I would really like to make some layout changes in the checkout. In the list wit all the amounts (sutotal, VAT, discount, et cetera) I would like it to have all the currency signs left aligned and all the amounts right aligned. That way all the € or $ are under each other and all the amouts have the ,00 (or so) under each other. Is this possible?

Please Log in or Create an account to join the conversation.

  • Posts: 2334
  • Thank you received: 403
11 years 3 months ago #143469

Hi there,

It is possible but you'll have to play a bit with the css and the html layout.
First, have a look at our documentation:
www.hikashop.com/support/documentation/i.../84-css-styling.html
www.hikashop.com/support/documentation/i...op-view-listing.html

You'll find the view you fand to edit in Display>Views searching for checkout/cart

Please Log in or Create an account to join the conversation.

  • Posts: 91
  • Thank you received: 3
11 years 3 months ago #143481

I looked already there and found (for the shipping costs) this part of code. But to me it looks like the currency sign and amount are created and printed (echo) as one. So I don't know how to split them? Any idea to get me a little bit further?

<tr>
          <?php echo $td; ?>
          <td id="hikashop_checkout_cart_shipping_title" class="hikashop_cart_shipping_title hikashop_cart_title">
            <?php echo JText::_('HIKASHOP_SHIPPING'); ?>
          </td>
          <td class="hikashop_cart_shipping_value" >
            <span class="hikashop_checkout_cart_shipping">
                      
<?php
      if(isset($this->value)) {
        echo $this->value;
      } else {
        $shipping_price = null;
        foreach($this->shipping as $shipping) {
          if(!isset($shipping->shipping_price) && isset($shipping->shipping_price_with_tax) ) {
            $shipping->shipping_price = $shipping->shipping_price_with_tax;
          }
          if(isset($shipping->shipping_price)) {
            if($shipping_price === null)
              $shipping_price = 0.0;
            if(bccomp($taxes,0,5)==0 || !$this->params->get('price_with_tax') || !isset($shipping->shipping_price_with_tax)) {
              $shipping_price += $shipping->shipping_price;
            } else {
              $shipping_price += $shipping->shipping_price_with_tax;
            }
          }
        }
        if($shipping_price !== null) {
          echo $this->currencyHelper->format($shipping_price, hikashop_getCurrency());
        }
      }
?>
            </span>
          </td>
        </tr>

Please Log in or Create an account to join the conversation.

  • Posts: 83933
  • Thank you received: 13588
  • MODERATOR
11 years 3 months ago #143499

In that variable you have the price: $shipping_price and in this one you have the currency id: hikashop_getCurrency() from which you can get the symbol like that:
$currency = $this->currencyHelper->get(hikashop_getCurrency());
echo $currency->currency_symbol;

so instead of the call to the format function, you could have something like that:
echo '<div style="float:left;">'.round($shipping_price,2).'</div>';
$currency = $this->currencyHelper->get(hikashop_getCurrency());
echo '<div style="float:right;">'.$currency->currency_symbol.'</div>';

Please Log in or Create an account to join the conversation.

  • Posts: 91
  • Thank you received: 3
11 years 3 months ago #144048

Thanks for your explanation. I got it almost working.

I replaced

echo $this->currencyHelper->format($shipping_price, hikashop_getCurrency());

with
$currency = $this->currencyHelper->get(hikashop_getCurrency());
echo '<div style="float:left;">'.$currency->currency_symbol.'</div>';               
echo '<div style="float:right;">'.$shipping_price.'</div>'; 

Alignment is OK now, only thing missing is ,00: Shipping costs should be 15,00 but it only puts 15 on the screen.
Any idea how to solve this? I tried some things, but it became clear I'm not a PHP developer :P

Please Log in or Create an account to join the conversation.

  • Posts: 12953
  • Thank you received: 1778
11 years 3 months ago #144076

Hi,
the solution will probably be to add this line :

$shipping_price = $this->currencyHelper->format($shipping_price, hikashop_getCurrency());
Before :
echo '<div style="float:right;">'.$shipping_price.'</div>';

Please Log in or Create an account to join the conversation.

  • Posts: 91
  • Thank you received: 3
11 years 3 months ago #144079

Almost ;)

Now I get € at the left and € 15,00 at the right. So the amount is right formatted, except the € sign isn't needed there....

Please Log in or Create an account to join the conversation.

  • Posts: 12953
  • Thank you received: 1778
11 years 3 months ago #144092

The solution will probably be to just remove that line :

echo '<div style="float:left;">'.$currency->currency_symbol.'</div>'; 

Please Log in or Create an account to join the conversation.

  • Posts: 91
  • Thank you received: 3
11 years 3 months ago #144093

Nice try, but now I'm back where I started. The line you wanted me to remove was the line made sure the € was aligned left. The amount is aligned right, but it also shows € at the right. So the right € has to go, the left € has to stay :cheer:

Please Log in or Create an account to join the conversation.

  • Posts: 2334
  • Thank you received: 403
11 years 3 months ago #144637

It's a bit hard to visualize at this points.
Could you make a screenshot of what you got and what you want (preferably with the inspector open so we can see the code around these lines)

Please Log in or Create an account to join the conversation.

Time to create page: 0.097 seconds
Powered by Kunena Forum