Jump to content
brian!

Tutorial: How to replace Payment Gateways (e.g Paypal) text with image or logo (Updated July 2018)

Recommended Posts

When displaying your payment options during the final stages of the checkout process, the available payment gateway options are shown as text – in a number of different ways based upon the order form template being used.

payment_gateway_-_01_-_default_viewcart.

If we wanted to make this more attractive, we could replace the text of any or all of the gateways, with an image or logo, by editing the viewcart.tpl template within the active order form template.

payment_gateway_-_02_-_ajaxcart_active.p

In order to do this, we can use one of the WHMCS variables that we have access to during the checkout process - $gateway.sysname - the variable stores in lowercase, the unique name used by WHMCS for the payment gateway.

This is not the value you entered for the gateway in the “Display Name” field in the “Payment Gateways” section of the Admin Area.

The next step is to create or find images for each of the gateways that you wish to replace with a graphic, all in the same graphic format (PNG, JPG or GIF) and save them with a lowercase filename. For example, if you were using PNG format, then your “PayPal” image would be called ‘paypal.png’; your “Bank Transfer” image is called ‘banktransfer.png’; and the “Mail-In Payment” gateway (in the above example, named ‘Cheque’) would be ‘mailin.png’.

I believe the filename to be used is based upon the filename of the gateway file in ‘modules/gateways’, but you should be able to find its value by viewing the source of your cart page in your browser...

[<label><input type="radio" name="paymentmethod" value="paypal" onclick="hideCCForm()" /> <img src=images/paypal.png />

So the part of interest above is: value=”paypal”.

You would then upload these images to your “images” directory within WHMCS. If you wanted to put them in their own folder within the “images” directory, you can – but you will need to adjust the URL in the code below to take account of the slightly different path (see end of tutorial).

The images directory i'm using in these examples is whmcs/images - and not the template(s) images folder.

The replacement code works by first creating a new variable to store the URL of the gateway logo, then it will check to see if the image exists in the “images” folder (remember that it must have a lowercase filename on the server otherwise it will not be found) – if the image exists, it will display the image; if no image is found, it will display the text (as it does now).

In the examples above, I have only uploaded a ‘paypal’ logo and hence only that gateway is using a replacement image – if I were to upload logos for the other two gateways, they would also be used instead of their text names.

So, I will now go through each of the eight existing order form templates and show the code to be replaced, the replacement code and an image of how the cart checkout page looks when the new code is added.

Ajaxcart

Replace....

<div class="cartbox">{foreach key=num item=gateway from=$gateways}
<label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} /> {$gateway.name}</label>{/foreach}</div>

With...

<div class="cartbox">{foreach key=num item=gateway from=$gateways}
   <label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} /> 
               {assign var="paylogo" value="images/`$gateway.sysname`.png"}
{if file_exists($paylogo)}
<img src={$paylogo} />
{else}
{$gateway.name}{/if}</label>
   {/foreach}</div>
payment_gateway_-_02_-_ajaxcart_active.p

Boxes

Replace....

<p align="center">{foreach key=num item=gateway from=$gateways}<label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} />{$gateway.name}</label> {/foreach}</p>

With...

<p align="center">{foreach key=num item=gateway from=$gateways}<label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} />
{assign var="paylogo" value="images/`$gateway.sysname`.png"}
{if file_exists($paylogo)}
<img src={$paylogo} />
{else}
{$gateway.name}</label> {/foreach}</p>
payment_gateway_-_03_-_boxes_active.png

Cart

Replace...

<p align="center">{foreach key=num item=gateway from=$gateways}<label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} />{$gateway.name}</label> {/foreach}</p>

With...

<p align="center">{foreach key=num item=gateway from=$gateways}<label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} />{assign var="paylogo" value="images/`$gateway.sysname`.png"}
{if file_exists($paylogo)}
<img src={$paylogo} />
{else}
{$gateway.name}{/if}</label> {/foreach}</p>
payment_gateway_-_05_-_cart_active.png

Comparison

Replace...

<p class="paymentmethods">{foreach key=num item=gateway from=$gateways}<label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} />{$gateway.name}</label><br />{/foreach}</p>

With...

<p class="paymentmethods">{foreach key=num item=gateway from=$gateways}<label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} />{assign var="paylogo" value="images/`$gateway.sysname`.png"}
{if file_exists($paylogo)}
<img src={$paylogo} />
{else}
{$gateway.name}{/if}</label><br />{/foreach}</p>
payment_gateway_-_06_-_comparison_active

Modern

Replace...

{foreach key=num item=gateway from=$gateways}<label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" id="pgbtn{$num}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} /> {$gateway.name}</label> {/foreach}

With...

{foreach key=num item=gateway from=$gateways}<label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" id="pgbtn{$num}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} /> {assign var="paylogo" value="images/`$gateway.sysname`.png"}
{if file_exists($paylogo)}
<img src={$paylogo} />
{else}
{$gateway.name}{/if}</label> {/foreach}
payment_gateway_-_07_-_modern_active.png

Slider

Replace...

{foreach key=num item=gateway from=$gateways}<label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} />{$gateway.name}</label> {/foreach}

With...

{foreach key=num item=gateway from=$gateways}<label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} />{assign var="paylogo" value="images/`$gateway.sysname`.png"}
{if file_exists($paylogo)}
<img src={$paylogo} />
{else}
{$gateway.name}{/if}</label> {/foreach}

payment_gateway_-_08_-_slider_active.png

Verticalsteps

Replace...

<p align="center">{foreach key=num item=gateway from=$gateways}<input type="radio" name="paymentmethod" value="{$gateway.sysname}" id="pgbtn{$num}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} /><label for="pgbtn{$num}">{$gateway.name}</label> {/foreach}</p>

With...

<p align="center">{foreach key=num item=gateway from=$gateways}<input type="radio" name="paymentmethod" value="{$gateway.sysname}" id="pgbtn{$num}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} /><label for="pgbtn{$num}">{assign var="paylogo" value="images/`$gateway.sysname`.png"}
{if file_exists($paylogo)}
<img src={$paylogo} />
{else}
{$gateway.name}{/if}</label> {/foreach}</p>
payment_gateway_-_09_-_vertical_active.p

Web20Cart

Replace...

  <div class="cartbox">{foreach key=num item=gateway from=$gateways}
   <label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} /> {$gateway.name}</label>
   {/foreach}</div>

With...

<div class="cartbox">{foreach key=num item=gateway from=$gateways}
   <label><input type="radio" name="paymentmethod" value="{$gateway.sysname}" onclick="{if $gateway.type eq "CC"}showCCForm(){else}hideCCForm(){/if}"{if $selectedgateway eq $gateway.sysname} checked{/if} /> {assign var="paylogo" value="images/`$gateway.sysname`.png"}
{if file_exists($paylogo)}
<img src={$paylogo} />
{else}
{$gateway.name}{/if}</label>
   {/foreach}</div>
payment_gateway_-_10_-_web20cart_active.

Customised Order Form Templates

If you are using a customised order form, perhaps supplied with a purchased WHMCS theme, this solution may still work with your template - in viewcart.tpl, you simply replace...

{$gateway.name}

With...

{assign var="paylogo" value="images/`$gateway.sysname`.png"}
{if file_exists($paylogo)}
<img src={$paylogo} />
{else}
{$gateway.name}{/if}

In these examples, I have used .PNG images - if you wanted to use .JPG or .GIF instead, then you would replace .png in the code with .jpg or .gif - remember, they must all use the same format!

if you wanted to put the gateway images in their own folder, e.g 'paylogos', then you would replace the code...

{assign var="paylogo" value="images/`$gateway.sysname`.png"}

with...

{assign var="paylogo" value="images/paylogos/`$gateway.sysname`.png"}

I hope this helps anyone who wants to replace their payment gateways text with images.

I should also add that this is tested and working on the latest WHMCS release as of this tutorial - v5.3.3

  • Like 3

Share this post


Link to post
Share on other sites
On 09/07/2018 at 08:45, Tengri said:

Can you replace images for more clear understanding?

I can, and they should all be back now - but remember these orderforms are no longer used with the recent releases of WHMCS.

you can do the same thing using a hook without the need to edit a template...

<?php

# Cart Gateway Logos Hook
# Written by brian!

function hook_cart_gateway_logos($vars) {
	
	if ($vars['templatefile'] == 'viewcart') {
		$gateways = $vars['gateways'];
		foreach($gateways as $key => $gateway) {
			$logo = "assets/img/logos/".$key.".png";
			if(file_exists($logo)) {
				$gateways[$key]['name'] = '<img src="'.$logo.'" alt="'.$gateway['sysname'].'">';
			}
		}			
		return array("gateways" => $gateways);
	}
}
add_hook('ClientAreaPageCart', 1, 'hook_cart_gateway_logos');
?>

VVSBvjW.png

the hook assumes three things about the logo images...

  1. that they are in .png format.
  2. the filesnames are the same as the sysname value of the gateway (in lowercase).
  3. that they are uploaded to /assets/img/logos/

you could easily alter the hook to use .jpg (or check for both) images, or to change their location.

if the logo image exists, it will use that logo - for gateways where no logo exists, the text name will be displayed.

  • Like 1

Share this post


Link to post
Share on other sites

I do it. But of course no effect... https://prnt.sc/kgmzgr

I want change this: Plastik kart (MilliKart - in system), Bank köçürməsi - Bank transfer. I create a file (logos.php) and put into hook folder. After this I load some icons (images) to assets/img/logos

I try different file name: Plastik kart.png, Plastik_kart.png, MilliKart.png - but how can you see no effect.

Share this post


Link to post
Share on other sites

Hi @Tengri,

4 minutes ago, Tengri said:

I want change this: Plastik kart (MilliKart - in system), Bank köçürməsi - Bank transfer. I create a file (logos.php) and put into hook folder. After this I load some icons (images) to assets/img/logos

so far, so good...

4 minutes ago, Tengri said:

I try different file name: Plastik kart.png, Plastik_kart.png, MilliKart.png - but how can you see no effect.

going from your checkout page source code...

<label class="radio-inline">
	<input type="radio" name="paymentmethod" value="millikart" class="payment-methods" checked />Plastik kart
</label>
<label class="radio-inline">
	<input type="radio" name="paymentmethod" value="banktransfer" class="payment-methods" />Bank köçürməsi
</label>
	<label class="radio-inline"><input type="radio" name="paymentmethod" value="mailin" class="payment-methods" />Bank Transfer (USD)
</label>

the filenames should be as follows...

  • Plastik Kart -> millikart.png
  • Bank köçürməsi -> banktransfer.png
  • Bank Transfer (USD) -> mailin.png

it's also important what I said about the filenames being lowercase, because these gateway names generated by WHMCS will (should) always be lowercase.

hopefully changing the files will fix the issue..

Share this post


Link to post
Share on other sites
Just now, Tengri said:

That is, it does not use hooks? What was I doing there wrong?

if you're using the above hook, it checks to see if the image filenames it's expecting to use for the gateways exist; if those images don't exist e.g have the wrong filenames, then it does nothing... once you have the correct filenames, then the hook should change the gateways name to logos.

Share this post


Link to post
Share on other sites

@Tengri - can you try the hook again, i've made a slight modification to it and it should work for you now.

  • Party/Celebrate 1

Share this post


Link to post
Share on other sites

Nice Brian! i like so much this but im having a issue,  i use you hook and woks well but the problem is that  im using only one payment gateway  per cart template so  when i use your  hook it add me all payment gateways 😕 

Before
pp0001.thumb.PNG.988992df960b75aad2460d02f4062aea.PNG

after
aff.PNG.dccc2329fbf181fa20536ba46e7d8c17.PNG

should be Paypal Only with its logo

only.PNG.0ebc9ca2d8eb846d59fbaf2fe7859968.PNG

 

<?php

# Cart Gateway Logos Hook
# Written by brian!

function hook_cart_gateway_logos($vars) {
	
	if ($vars['templatefile'] == 'viewcart') {
		$gateways = $vars['gateways'];
		foreach($gateways as $key => $gateway) {
			$logo = "assets/img/logos/".$key.".png";
			if(file_exists($logo)) {
				$gateways[$key]['name'] = '<img src="'.$logo.'" alt="'.$gateway['sysname'].'">';
			}
		}			
		return array("gateways" => $gateways);
	}
}
add_hook('ClientAreaPageCart', 1, 'hook_cart_gateway_logos');
?>

i leave images 

Share this post


Link to post
Share on other sites

Hi TGK,

9 hours ago, TGK said:

i like so much this but im having a issue,  i use you hook and woks well but the problem is that  im using only one payment gateway  per cart template so  when i use your  hook it add me all payment gateways

how are you defining that one gateway per template ? have not modified the checkout.tpl template directly ??

if you have, then the hook wouldn't work as intended because it's just using what is automatically defined in the $gateways array... if you've made changes to the template to just use PayPal, I will need to see how you've done it.

 

Share this post


Link to post
Share on other sites
2 minutes ago, Aris.N. said:

Is there a difference if using the standard_cart?

my above screenshots are from standard_cart - though it should work on any orderform template (as long as it's using the $gateways array and the logo images exists and are named correctly).

are you seeing an issue in your template ?

Share this post


Link to post
Share on other sites
On 7/9/2018 at 1:42 PM, brian! said:

...

the hook assumes three things about the logo images...

  1. that they are in .png format.
  2. the filesnames are the same as the sysname value of the gateway (in lowercase).
  3. that they are uploaded to /assets/img/logos/ 

 

I have 3 payment methods.

433033621_ScreenShot2018-08-26at14_06_39.thumb.png.1e4eeb797b021df3d576013e7542819b.png

I have uploaded the logos @ assets/img/logos/ folder

203294542_ScreenShot2018-08-26at14_09_07.thumb.png.3d12a35cee11ae25f6c919105bbffb49.png

 

I thing i have named them right, or not?

303062960_ScreenShot2018-08-26at14_11_31.thumb.png.3b66559c197a6f9636357f8b008b95aa.png

But, although i am using the hook,  the logos are not displayed.

400542997_ScreenShot2018-08-26at14_13_42.thumb.png.b8825b5ded2d99a8797cdc12a8d1a49c.png

Is anybody suspect something that is due to this?

Share this post


Link to post
Share on other sites
13 minutes ago, Aris.N. said:

Is anybody suspect something that is due to this?

can you edit checkout.tpl; add {debug} to the end of the code in that file and save; refresh the checkout page in the browser - that should open a popup window... if you could take a screenshot or copy&paste the content of the $gateways array in that window, that should help me figure out the issue... and then don't forget to remove {debug} from the template and save it.

Share this post


Link to post
Share on other sites
 

$gateways

Origin: "Smarty object" 

Value

Array (3)
vivapayments => Array (3)
  sysname => "vivapayments"
  name => "Viva Payments (Wallet, Μετρητά, Κατάθεση)"
  type => "Invoices"
mailin => Array (3)
  sysname => "mailin"
  name => "Kατάθεση"
  type => "Invoices"
eurobankgr => Array (3)
  sysname => "eurobankgr"
  name => "Πιστωτική / Χρεωστική"
  type => "Invoices"

Share this post


Link to post
Share on other sites

thanks, can you check the hook code and ensure that it's using sysname as above..

$gateways[$key]['name'] = '<img src="'.$logo.'" alt="'.$gateway['sysname'].'">';

 

  • Thanks 1

Share this post


Link to post
Share on other sites
7 hours ago, brian! said:

Hi TGK,

how are you defining that one gateway per template ? have not modified the checkout.tpl template directly ??

if you have, then the hook wouldn't work as intended because it's just using what is automatically defined in the $gateways array... if you've made changes to the template to just use PayPal, I will need to see how you've done it.

 

i did defined that one gateway per template by creating a product-Group and leave only avalaible PayPal gateway i have diferents product grups and inside them i have 1 product and these product group have avalaible only 1 gateway

example
==
Product-Group " Paypal VPS" using payment gateway "Paypal" Only 
Product name VPS Basic
its use a custon cart template too but in ordering tab im using "Boxes"

xd1111.PNG.b16475fb00d32a8f0995d3bf8058e0c4.PNG
 

i  edited viewcart.tpl  but noting involved with $gateway i also leave my viewcart for brian.rar if need check how i using it 

thanks

Share this post


Link to post
Share on other sites
5 hours ago, TGK said:

i did defined that one gateway per template by creating a product-Group and leave only available PayPal gateway i have different product groups and inside them i have 1 product and these product group have available only 1 gateway

when I do that using your template, or the v7.6 version of Boxes, it works fine..

IYpZJGD.png

8jBVrVB.png

the hook isn't adding/removing any elements from the array, so those gateways are already there in the template without the hook.

which version of WHMCS are you using? (btw Boxes hasn't been updated in years - so if using a recent version of WHMCS, it's probably not the best choice).

Share this post


Link to post
Share on other sites

Yeah im using 7.5.2..8jBVrVB.png

Edited by TGK
adding quote

Share this post


Link to post
Share on other sites
39 minutes ago, brian! said:

when I do that using your template, or the v7.6 version of Boxes, it works fine..

IYpZJGD.png

8jBVrVB.png

the hook isn't adding/removing any elements from the array, so those gateways are already there in the template without the hook.

which version of WHMCS are you using? (btw Boxes hasn't been updated in years - so if using a recent version of WHMCS, it's probably not the best choice).

im using 7.5.2

maybe the issue is because that custom product group that im using have a template based on standard_cart and my general config in ordering tab im using boxes templates maybe thats why i  dont sure but well i will check.

 

Share this post


Link to post
Share on other sites

thanks Brian! now is solved your hook works fine still in 7.5.2 was my bad uploading wrong img to the logos directory

sorry

 

Share this post


Link to post
Share on other sites
On 7/9/2018 at 11:42 AM, brian! said:

I can, and they should all be back now - but remember these orderforms are no longer used with the recent releases of WHMCS.

you can do the same thing using a hook without the need to edit a template...


<?php

# Cart Gateway Logos Hook
# Written by brian!

function hook_cart_gateway_logos($vars) {
	
	if ($vars['templatefile'] == 'viewcart') {
		$gateways = $vars['gateways'];
		foreach($gateways as $key => $gateway) {
			$logo = "assets/img/logos/".$key.".png";
			if(file_exists($logo)) {
				$gateways[$key]['name'] = '<img src="'.$logo.'" alt="'.$gateway['sysname'].'">';
			}
		}			
		return array("gateways" => $gateways);
	}
}
add_hook('ClientAreaPageCart', 1, 'hook_cart_gateway_logos');
?>

VVSBvjW.png

the hook assumes three things about the logo images...

  1. that they are in .png format.
  2. the filesnames are the same as the sysname value of the gateway (in lowercase).
  3. that they are uploaded to /assets/img/logos/

you could easily alter the hook to use .jpg (or check for both) images, or to change their location.

if the logo image exists, it will use that logo - for gateways where no logo exists, the text name will be displayed.

Hi @brian!, just added your hook to my installation, all is well, I was just wondering if you know if its possible to define the image sizes? 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By sokalsondha
      hello community...
      i hope all are doing very well. today i came back again for a small help with an code.
      basically by default now whmcs store the last 4 digit of the Credit card number of stripe gateway.
      which i found less confident for our clients.
      so i found an idea to modify the creditcard.tpl and make the RADIO BUTTON default to ENTER NEW CARD DETAILS
      and i will hide the 2nd radio button. this way client will never see that their credit card 4 digit is stored.. basically even storing the 4 digit we can't do anything.. but you know the clients....
      can someone guide me from this code what i should modify to make default to the 1st radio button even the card number is stored in the server
       
      {if $remotecode}
          <div id="frmRemoteCardProcess" class="text-center" align="center">
              {$remotecode}
              <iframe name="ccframe" class="auth3d-area" width="90%" height="600" scrolling="auto" src="about:blank"></iframe>
          </div>
          <script language="javascript">
              jQuery("#frmRemoteCardProcess").find("form:first").attr('target', 'ccframe');
              setTimeout("autoSubmitFormByContainer('frmRemoteCardProcess')", 1000);
          </script>
      {else}
          <form id="frmPayment" method="post" action="creditcard.php" class="form-horizontal" role="form">
              <input type="hidden" name="action" value="submit" />
              <input type="hidden" name="invoiceid" value="{$invoiceid}" />
              <div class="row">
                  <div class="col-md-7">
                      {if $errormessage}
                          {include file="$template/includes/alert.tpl" type="error" errorshtml=$errormessage}
                      {/if}
                      
                      
                          <div class="col-sm-12">
                          <img width="100%" src="/templates/{$template}/img/stripelogo.png">
                      </div>
                      <div class="alert alert-danger text-center gateway-errors hidden"></div>
                      <div class="form-group">
                          <div class="col-sm-8 col-sm-offset-4">
                              <div class="radio">
                                  <label>
                                      <input type="radio" name="ccinfo" value="new" onclick="showNewCardInputFields()"{if $ccinfo eq "new" || !$cardOnFile} checked{/if} /> {$LANG.creditcardenternewcard}</label>
                                  </label>
                              </div>
                              <div class="radio">
                                  <label>
                                      <input type="radio" name="ccinfo" value="useexisting" onclick="hideNewCardInputFields()" {if $cardOnFile && $ccinfo neq "new"}checked{elseif !$cardOnFile}disabled{/if} /> {$LANG.creditcarduseexisting}{if $cardOnFile} ({$existingCardType}-{$existingCardLastFour}){/if}
                                  </label>
                              </div>
                          </div>
                      </div>
                      <div class="form-group{if $userDetailsValidationError} hidden{/if}" id="billingAddressSummary">
                          <label for="cctype" class="col-sm-4 control-label">{$LANG.billingAddress}</label>
                          <div class="col-sm-6">
                              {if $companyname}{$companyname}{else}{$firstname} {$lastname}{/if} <button type="button" id="btnEditBillingAddress" onclick="editBillingAddress()" class="btn btn-default btn-sm"{if $cardOnFile} disabled="disabled"{/if}><i class="fa fa-edit"></i> {$LANG.change}</button><br />
                              {$address1}{if $address2}, {$address2}{/if}<br />
                              {$city}, {$state}, {$postcode}<br />
                              {$countryname}
                          </div>
                      </div>
                      <div class="form-group cc-billing-address{if !$userDetailsValidationError} hidden{/if}">
                          <label for="inputFirstName" class="col-sm-4 control-label">{$LANG.clientareafirstname}</label>
                          <div class="col-sm-6">
                              <input type="text" name="firstname" id="inputFirstName" value="{$firstname}" class="form-control" />
                          </div>
                      </div>
                      <div class="form-group cc-billing-address{if !$userDetailsValidationError} hidden{/if}">
                          <label for="inputLastName" class="col-sm-4 control-label">{$LANG.clientarealastname}</label>
                          <div class="col-sm-6">
                              <input type="text" name="lastname" id="inputLastName" value="{$lastname}" class="form-control" />
                          </div>
                      </div>
                      <div class="form-group cc-billing-address{if !$userDetailsValidationError} hidden{/if}">
                          <label for="inputAddress1" class="col-sm-4 control-label">{$LANG.clientareaaddress1}</label>
                          <div class="col-sm-6">
                              <input type="text" name="address1" id="inputAddress1" value="{$address1}" class="form-control" />
                          </div>
                      </div>
                      <div class="form-group cc-billing-address{if !$userDetailsValidationError} hidden{/if}">
                          <label for="inputAddress2" class="col-sm-4 control-label">{$LANG.clientareaaddress2}</label>
                          <div class="col-sm-6">
                              <input type="text" name="address2" id="inputAddress2" value="{$address2}" class="form-control" />
                          </div>
                      </div>
                      <div class="form-group cc-billing-address{if !$userDetailsValidationError} hidden{/if}">
                          <label for="inputCity" class="col-sm-4 control-label">{$LANG.clientareacity}</label>
                          <div class="col-sm-6">
                              <input type="text" name="city" id="inputCity" value="{$city}" class="form-control" />
                          </div>
                      </div>
                      <div class="form-group cc-billing-address{if !$userDetailsValidationError} hidden{/if}">
                          <label for="inputState" class="col-sm-4 control-label">{$LANG.clientareastate}</label>
                          <div class="col-sm-6">
                              <input type="text" name="state" id="inputState" value="{$state}" class="form-control" />
                          </div>
                      </div>
                      <div class="form-group cc-billing-address{if !$userDetailsValidationError} hidden{/if}">
                          <label for="inputPostcode" class="col-sm-4 control-label">{$LANG.clientareapostcode}</label>
                          <div class="col-sm-6">
                              <input type="text" name="postcode" id="inputPostcode" value="{$postcode}" class="form-control" />
                          </div>
                      </div>
                      <div class="form-group cc-billing-address{if !$userDetailsValidationError} hidden{/if}">
                          <label for="inputCountry" class="col-sm-4 control-label">{$LANG.clientareacountry}</label>
                          <div class="col-sm-6">
                              {$countriesdropdown}
                          </div>
                      </div>
                      <div class="form-group cc-billing-address{if !$userDetailsValidationError} hidden{/if}">
                          <label for="inputPhone" class="col-sm-4 control-label">{$LANG.clientareaphonenumber}</label>
                          <div class="col-sm-6">
                              <input type="text" name="phonenumber" id="inputPhone" value="{$phonenumber}" class="form-control" />
                          </div>
                      </div>
                      <div class="form-group cc-details{if !$addingNewCard} hidden{/if}">
                          <label for="cctype" class="col-sm-4 control-label">{$LANG.creditcardcardtype}</label>
                          <div class="col-sm-5">
                              <select name="cctype" id="cctype" class="form-control newccinfo">
                                  {foreach from=$acceptedcctypes item=type}
                                      <option{if $cctype eq $type} selected{/if}>
                                          {$type}
                                      </option>
                                  {/foreach}
                              </select>
                          </div>
                      </div>
                      <div class="form-group cc-details{if !$addingNewCard} hidden{/if}">
                          <label for="inputCardNumber" class="col-sm-4 control-label">{$LANG.creditcardcardnumber}</label>
                          <div class="col-sm-7">
                              <input type="tel" name="ccnumber" id="inputCardNumber" size="30" value="{if $ccnumber}{$ccnumber}{/if}" autocomplete="off" class="form-control newccinfo" />
                          </div>
                      </div>
                      {if $showccissuestart}
                          <div class="form-group cc-details{if !$addingNewCard} hidden{/if}">
                              <label for="inputCardStart" class="col-sm-4 control-label">{$LANG.creditcardcardstart}</label>
                              <div class="col-sm-8">
                                  <select name="ccstartmonth" id="inputCardStart" class="form-control select-inline">
                                      {foreach from=$months item=month}
                                          <option{if $ccstartmonth eq $month} selected{/if}>{$month}</option>
                                      {/foreach}
                                  </select>
                                  <select name="ccstartyear" id="inputCardStartYear" class="form-control select-inline">
                                      {foreach from=$startyears item=year}
                                          <option{if $ccstartyear eq $year} selected{/if}>{$year}</option>
                                      {/foreach}
                                  </select>
                              </div>
                          </div>
                      {/if}
                      <div class="form-group cc-details{if !$addingNewCard} hidden{/if}">
                          <label for="inputCardExpiry" class="col-sm-4 control-label">{$LANG.creditcardcardexpires}</label>
                          <div class="col-sm-8">
                              <select name="ccexpirymonth" id="inputCardExpiry" class="form-control select-inline">
                                  {foreach from=$months item=month}
                                      <option{if $ccexpirymonth eq $month} selected{/if}>{$month}</option>
                                  {/foreach}
                              </select>
                              <select name="ccexpiryyear" id="inputCardExpiryYear" class="form-control select-inline">
                                  {foreach from=$expiryyears item=year}
                                      <option{if $ccexpiryyear eq $year} selected{/if}>{$year}</option>
                                  {/foreach}
                              </select>
                          </div>
                      </div>
                      {if $showccissuestart}
                          <div class="form-group cc-details{if !$addingNewCard} hidden{/if}">
                              <label for="inputIssueNum" class="col-sm-4 control-label">{$LANG.creditcardcardissuenum}</label>
                              <div class="col-xs-2">
                                  <input type="number" name="ccissuenum" id="inputIssueNum" value="{$ccissuenum}" class="form-control input-" />
                              </div>
                          </div>
                      {/if}
                      <div class="form-group">
                          <label for="cctype" class="col-sm-4 control-label">{$LANG.creditcardcvvnumber}</label>
                          <div class="col-sm-7">
                              <input type="number" name="cccvv" id="inputCardCvv" value="{$cccvv}" autocomplete="off" class="form-control input-inline input-inline-100" />
                              <button type="button" class="btn btn-link" data-toggle="popover" data-content="<img src='{$BASE_PATH_IMG}/ccv.gif' width='210' />">
                                  {$LANG.creditcardcvvwhere}
                              </button>
                          </div>
                      </div>
                      {if $shownostore}
                          <div class="form-group cc-details{if !$addingNewCard} hidden{/if}">
                              <div class="col-sm-offset-4 col-sm-8">
                                  <div class="checkbox">
                                      <label>
                                          <input type="checkbox" name="nostore" id="inputNoStore"> {$LANG.creditcardnostore}
                                      </label>
                                  </div>
                              </div>
                          </div>
                      {/if}
                      <div class="form-group">
                          <div class="text-center">
                              <button type="submit" class="btn btn-primary btn-lg" id="btnSubmit" value="{$LANG.submitpayment}">
                                  <span class="pay-text">{$LANG.submitpayment}</span>
                                  <span class="click-text hidden">{$LANG.pleasewait}</span>
                              </button>
                          </div>
                      </div>
                  </div>
                  <div class="col-md-5">
                      <div id="invoiceIdSummary" class="invoice-summary">
                          <h2 class="text-center">{$LANG.invoicenumber}{$invoiceid}</h2>
                          <div class="invoice-summary-table">
                          <table class="table table-condensed">
                              <tr>
                                  <td class="text-center"><strong>{$LANG.invoicesdescription}</strong></td>
                                  <td width="150" class="text-center"><strong>{$LANG.invoicesamount}</strong></td>
                              </tr>
                              {foreach $invoiceitems as $item}
                                  <tr>
                                      <td>{$item.description}</td>
                                      <td class="text-center">{$item.amount}</td>
                                  </tr>
                              {/foreach}
                              <tr>
                                  <td class="total-row text-right">{$LANG.invoicessubtotal}</td>
                                  <td class="total-row text-center">{$invoice.subtotal}</td>
                              </tr>
                              {if $invoice.taxrate}
                                  <tr>
                                      <td class="total-row text-right">{$invoice.taxrate}% {$invoice.taxname}</td>
                                      <td class="total-row text-center">{$invoice.tax}</td>
                                  </tr>
                              {/if}
                              {if $invoice.taxrate2}
                                  <tr>
                                      <td class="total-row text-right">{$invoice.taxrate2}% {$invoice.taxname2}</td>
                                      <td class="total-row text-center">{$invoice.tax2}</td>
                                  </tr>
                              {/if}
                              <tr>
                                  <td class="total-row text-right">{$LANG.invoicescredit}</td>
                                  <td class="total-row text-center">{$invoice.credit}</td>
                              </tr>
                              <tr>
                                  <td class="total-row text-right">{$LANG.invoicestotaldue}</td>
                                  <td class="total-row text-center">{$invoice.total}</td>
                              </tr>
                          </table>
                          </div>
                          <p class="text-center">
                              {$LANG.paymentstodate}: <strong>{$invoice.amountpaid}</strong><br />
                              {$LANG.balancedue}: <strong>{$balance}</strong>
                          </p>
                      </div>
                  </div>
              </div>
              <div class="alert alert-warning" role="alert">
                  <i class="fa fa-lock"></i> &nbsp; {$LANG.creditcardsecuritynotice}
              </div>
          </form>
      {/if}
       
       
       
      thanks very much to everyone for reading my post...
       
      Mahim
       
    • By hanstavo
      When I tried to do a test checkout I realized that I cant continue. I get an error about invalid tax percentage, but I don't even have tax setup. I am using WHMCS 7.4.2
      I get the error no matter what payment gateway, and I have tried a fresh install of the checkout.tpl file and a bunch of other files that is included on multiple pages such as common and the sidebars.
      When I enable error reporting, I get the following stack trace:

      WHMCS\Exception\Billing\BillingException: Invalid tax percentage: in /home/myuser/public_html/vendor/whmcs/whmcs-foundation/lib/Billing/Tax.php:0
      Stack trace:
      #0 /home/myuser/public_html/vendor/whmcs/whmcs-foundation/lib/Billing/Tax.php(0): WHMCS\Billing\Tax->validateTaxPercentage(NULL)
      #1 /home/myuser/public_html/includes/invoicefunctions.php(0): WHMCS\Billing\Tax->setLevel1Percentage(NULL)
      #2 /home/myuser/public_html/includes/processinvoices.php(0): updateInvoiceTotal(0)
      #3 /home/myuser/public_html/includes/processinvoices.php(0): createInvoicesProcess(false, true, '')
      #4 /home/myuser/public_html/includes/orderfunctions.php(0): createInvoices(1, true, '', Array)
      #5 /home/myuser/public_html/cart.php(0): calcCartTotals(true)
      #6 {main}
    • By WGS
      We have successful launched Alipay Cross Border Payment Gateway Module for WHMCS users. Now you can easily accept payments from your customers reciting in China.
      To know more about the plugin, visit: https://marketplace.whmcs.com/product/4537
       
       
    • By TheTechLounge
      Hi,
      I'm looking at getting the Stripe Payment gateway setup and have hit an issue with the Card Type field being empty. Any ideas?
    • By wellconnit
      Hi guys,
       
      I've almost finished developing a custom payment gateway, however when I submit and it posts I've set the return url(not the callback) to /viewinvoice?id=#### and there is a problem somewhere
      The callback is separate and is set to modules/gateways/callback/nabtransact.php
      But it returns me a page with no CSS and a login box which suggests it's logged out or lost the login cookie in the process.
      The address bar shows the payment gateway target but the page does not correspond.
      Any ideas are appreciated.
       
      Thanks
  • Recently Browsing   0 members

    No registered users viewing this page.

×

Important Information

By using this site, you agree to our Terms of Use & Guidelines and understand your posts will initially be pre-moderated