Skip to content

Branding Requirements

Warning

As an integrator, you must comply with the PayWithMyBank Branding and Marketing Requirements.

PayWithMyBank offers a number of assets and pre-approved messaging that you can use on your site or in your app. By using our hosted assets and pre-approved messaging, you can ensure your integration remains in compliance with the PayWithMyBank Branding Requirements and any applicable NACHA and other agency regulations and requirements.

Brand Messaging

Naming the method of payment

PayWithMyBank should always be referenced as Pay with Online Banking, or shortened to Online Banking when referencing the method of payment. PayWithMyBank branding appears in the Lightbox and does not need to appear anywhere else on your site.

Placement Requirements

Express Checkout

If you offer "express checkout" functionality on your site (payment method selection which is upstream from the standard checkout flow), and you offer other payment methods that provide express checkout functionality, you must display an option to Pay with Online Banking next to the primary call to action on the page. Selecting this option opens the PayWithMyBank Lightbox and allows the user to select their bank. Billing and Shipping address is provided to you via the users address on file with their bank using the Get User API.

Offering Online Banking using the PayWithMyBank Widget

If your payment selection screen offers a selector (radio buttons, tabs, etc) that expands to allow the user to provide their payment information, or directs the user to a subsequent page where they provide their payment information, you must provide an option to Pay with Online Banking using one of the approved options listed below. Once select, you must display the PayWithMyBank Widget after the Pay with Online Banking option is selected in line with your payment flow (either in-line on the current page or on a subsequent page). Once the user selects their bank (or the 'All other banks' option), the PayWithMyBank Lightbox will open and the user can authenticate and select their bank. If you require billing address for the transaction and it hasn't been collected, that should be retrieved using the Get User API and shown to the user once the PayWithMyBank experience is completed.

Note

Do not open a pop-up window to display the PayWithMyBank Widget. This can be accomplished with the PayWithMyBank Lightbox option described below.

Offering Online Banking using the PayWithMyBank Lightbox

If the users payment process is triggered by selecting a payment method via call to action (ie, a button) and directing the user to a payment flow where the PayWithMyBank Widget isn't applicable from a User Experience standpoint, you can launch the PayWithMyBank Lightbox directly from the call to action. In this case, the user selects their bank from the Lightbox, authenticates, and selects their account. If you require billing address for the transaction and it hasn't been collected, that should be retrieved using the Get User API and shown to the user once the PayWithMyBank experience is completed.

Tip

It is preferred to use the PayWithMyBank Widget whenever possible. Using the Widget typically provides 30% higher conversion than using the Lightbox alone.

Learn More content, account information, and confirmation messaging

Learn More content

You can use the following approved text on your site to provide more information about the Pay with Online Banking payment mark.

If you have specific requirements that aren't handled by the text here, contact your Account Team or email techsupport@paywithmybank.com.

Option 1

Online Banking is a convenient alternative to cards, which allows you to make or receive payments by signing into Online Banking without leaving our site. It's simple and safe - no card or bank information to provide.

Option 2

Simple and safe - no card or bank information to provide

Account information

You must display the Bank name or logo and Bank Account name when displaying the method of payment used with the transaction.

  • The Bank name can be retrieved using the transaction.payment.paymentProvider.name field in the Get Transaction API.
  • The Bank logo can be retrieved using the transaction.payment.paymentProvider.paymentProviderId field in the Get Transaction API and using the Image URL https://paywithmybank.com/start/assets/institutions/{paymentProviderId}.png (for the logo) or https://paywithmybank.com/start/assets/institutions/icons/{paymentProviderId}.png (for the icon).
  • The Bank Account name can be retrieved using the transaction.payment.account.name field in the Get Transaction API.

Warning

In order to remain in compliance with the PayWithMyBank Branding Requirements, you must use the assets that are hosted on the PayWithMyBank CDN. It is not acceptable to host any of the PayWithMyBank assets in your own environment.

Confirmation messaging

You must sent transaction confirmation communication via sms/text message or email. This communication should include (at a minimum):

  • Amount of the transaction
  • Descriptor use with the transaction (provided to PayWithMyBank during account setup, not to exceed 16 characters).
  • Bank Account Name used for the transaction (retrieved from the transaction.payment.account.name field in the Get Transaction API).
  • Expected transaction settlement timing ('3-5 banking days').

PayWithMyBank Hosted Assets

The hosted assets are categorized in 3 buckets:

  • Banners. Banners are typically used when you're showing Pay with Online Banking as a method of payment.
  • Buttons. Buttons are typically used when you're providing a call to action to initiate the PayWithMyBank experience.
  • Payment Marks. Payment Marks are typically used when you have a call to action to initiate the PayWithMyBank experience or want to show that Online Banking is available as a method of payment along with other methods of payment on your site.

All assets have a light and a dark version. You are free to use whichever version fits best with your user experience.

If you have specific asset requirements that aren't shown here, contact your Account Team or email techsupport@paywithmybank.com.

Warning

In order to remain in compliance with the PayWithMyBank Branding Requirements, you must use the assets that are hosted on the PayWithMyBank CDN. It is not acceptable to host any of the PayWithMyBank assets in your own environment.

Banners

Image Max Size Light URLs Dark URLs
592x156 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg
592x102 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg
392x64 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg
136x82 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg
120x152 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg

Buttons

Image Max Size Light URLs Dark URLs
254x65 @1x
@2x
@4x
svg
N/A

Payment Marks

Image Max Size Light URLs Dark URLs
242x126 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg
256x65 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg
250x160 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg
252x170 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg
253x359 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg
256x92 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg
362x32 @1x
@2x
@4x
svg
@1x
@2x
@4x
svg

Customization options

PayWithMyBank offers a couple of customization options to allow our experience to more closely tie with yours.

PayWithMyBank Widget

By default, the PayWithMyBank Widget displays 6 tiles in a 3x2 grid (2x3 grid on mobile devices). One of the options is always the tile "All other banks".

Generic Widget

Items available for customization are:

  • Number of columns to display (default is 3).
  • Number of rows to display (default is 2).
  • Colors and font used can be customized to match your site.
  • Wording ("Pay with Online Banking", "Simple and safe ...") can be customized to fit the agreed upon placement.

Security Slider

PayWithMyBank displays a Security Slide to the User after they select their Bank. This slide is shown over the Bank Authentication screen in our Lightbox.

Generic Slider

Items available for customization are:

  • Background color of the slider: RGB or HEX color (rgb(0, 152, 208) is shown). The color of the text will remain white, so a dark color is required. We can optionally add a gradient to the background, which will (as shown in Figure 2).
  • Accent color of the slider: RGB or HEX color (rgb(0, 255, 255) is shown in Figure 2). This color is used for accents on the page: bullet list and button outline.
  • Merchant logo: URL (not shown). Provide the URL of a white logo that can be used to tie your brand to our light box. The maximum size of the logo should be 34px tall by 125px wide.

Light Box

There are a couple of items that can be changed in the Lightbox itself.

Generic Lightbox

Items available for customization are:

  • Font and Font Size (Open Sans 18px is shown in Figure 3). Contact us for details on how we can customize this.
  • Final button label (‘Continue’ is shown here). Depending on your particular flow and use case, we can change the label of the final button. If your use case calls for a slightly different label, please contact us.