Customizing Spike

To make Spike billing look and feel like your own app, there are several options available to customize the experience for your users.

Billing portal path

By default, your users can visit the billing portal at /billing, but you can change that in the config/spike.php configuration file:

'route_prefix' => 'billing',

Theme

The easiest way to make Spike billing feel like your own is to change the theme color and logo. You can easily do that in the config/spike.php configuration:

'theme' => [
    'color' => '#047857',
    'logo_url' => 'your-logo-here.png',
    'display_avatar' => true,
    'credits_icon' => null,
],

You can leave logo_url as null if you wish not to display any logo.

When credits_icon is set to null, it will display the default icon for credits. If you'd like to use your own icon, set this to a relative/absolute URL to the icon, such as '/credits-icon.svg'

Avatar default

By default, Spike displays the Gravatar of the user's email. You can learn more about Gravatar here.

Customizing avatar URL

If you would like to provide a different URL for the avatar image, you can do so by setting a custom avatar resolver in the boot method of your AppServiceProvider:

use Opcodes\Spike\Facades\Spike;

/**
 * Bootstrap any application services.
 *
 * @return void
 */
public function boot()
{
    Spike::resolveAvatarUsing(function ($billable) {
        return $billable->profile_image_url;
    });
}

Disabling avatar

If you would like to hide the avatar completely, you can set the theme.display_avatar value to false in the config/spike.php configuration file.

Overriding layout & components

This customization feature is currently in development and will be coming soon.

Return URL

Spike provides an easy way for your users to return back to your application. You can configure the return URL in the config/spike.php configuration:

'return_url' => '/',

In order to hide the link, you can set it to null.

Customizing HTML layout

Although Spike does not provide a way to customize the UI elements at the moment, you might still want to include additional scripts, styles, meta tags to the HTML of the billing portal. For this reason, you can publish just the layout itself:

php artisan vendor:publish --tag=spike-views

The layout will be placed in resources/views/vendor/spike/layouts/app.blade.php where you can modify the HTML of the billing portal.

Translations

You can publish Spike's translations by running this Artisan command:

php artisan vendor:publish --tag=spike-translations

This will put the English translations in your project directory at resources/lang/vendor/spike/en/translations.php. You can change this file to update the translations for the en locale.

If you would like to provide translations in a different locale, copy the file to resources/lang/vendor/spike/{locale}/translations.php and update the translations in the new file.

Invoice details

Spike provides the ability to download the subscription and product purchase invoices right from the billing portal. These invoices must contain certain pieces of information, such as your company name, the product name, etc. You should configure these details in the config/spike.php configuration file:

'invoice_details' => [
    'vendor' => 'Acme',
    'product' => env('APP_NAME', 'Spike'),
    // 'street' => 'Main Str. 1',
    // 'location' => '2000 Antwerp, Belgium',
    // 'phone' => '+32 499 00 00 00',
    // 'email' => 'info@example.com',
    // 'url' => 'https://example.com',
    // 'vendorVat' => 'BE123456789',
],