Payment Methods Customization

While setting the billing plugins, you can customize the icons and text in the pop-ups displayed for the configured payment methods in the dashboard. The end-user will see these icons and text while refilling the account and choosing the payment method.

refill balance payment methods

To specify these configurations, follow the next steps:

1. Open the admin panel and navigate to the System Settings menu.

platform system settings

2. Enable Expert Mode and search for the external.billing.plugin.json.config parameter.

settings expert mode

3. The setting lists plugins used in the external billing system. Each plugin corresponds to a single payment method (e.g. PayPal or credit card, like Visa/MasterCard). You can define payment systems available for your users and customize them using the following parameters:

  • type - plugin type which defines billing system (e.g. “cebi” for WHMCS)
  • jbilName - a payment system ID that the platform dashboard gets
  • externalName - a payment system ID in your billing integration (e.g. Diners, MC, Visa)
  • canRemember - a boolean value that allows/forbids plugin to associate used payment methods with specific users
  • caption - JSON array that contains information about payment method name in different languages
    • locale - locale of a user (e.g. en, ua)
    • text - payment method name which is displayed at the dashboard for the specified locale
  • hint - JSON array that contains information about payment method hints in different languages:
    • locale - locale of a user (e.g. en, ua)
    • text - text of the hint which is displayed while hovering over the payment method for the specified locale
  • titleIcons - JSON array that contains payment methods' icons:
    • keyword - payment method (specified as its externalName) that should be associated with the icon
    • path - path or URL to the icon
  • popupSize - JSON object that contains the payment window’s size
    • width - width of the pop-up window in pixels
    • height - height of the pop-up window in pixels

external billing plugin configs

Here is an example of the plugin configuration:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
{
	"plugins": [{
		"type": "cebi",
		"jbilName": "payfast",
		"externalName": "payfast",
		"canRemember": false,
		"caption": [{
			"locale": "en",
			"text": "Bank Card"
		}, {
			"locale": "es",
			"text": "Tarjeta de crédito / débito"
		}],
		"hint": [{
			"locale": "en",
			"text": "Only credit cards are allowed."
		}, {
			"locale": "es",
			"text": "Solo se permiten tarjetas de crédito/débito."
		}],
		"titleIcons": [{
			"keyword": "visa",
			"path": "visa.svg"
		}, {
			"keyword": "mastercard",
			"path": "mastercard.svg"
		}, {
			"keyword": "payfast",
			"path": "payfast.svg"
		}],
		"popupSize": {
			"width": 800,
			"height": 700
		}
	}, {
		"type": "cebi",
		"jbilName": "visa",
		...
	}]
}

Save the configs and reboot billing to apply the changes.

What’s next?