riverty logo

Docs

Get Started Login

Invoice Element

Why Invoice Element is Interesting

Riverty offers an Invoice Element which will useful information about 14-day invoice to consumers before the checkout stage. This will ensure that consumers are aware of payment method, potentially leading to additional purchases.

How to Include Invoice Element

To include this component to your webpage please ensure you have the following Riverty CDN scripts present in page HTML head tag:

<script type="module" src="https://cdn.bnpl.riverty.io/elements/v1/build/riverty-elements.esm.js" async="true"></script>  

For a full overview of the Riverty Elements, please have a look at this Showcase.

Then, you can use riverty-invoice custom element snippet whereever the payment method should be displayed. Note: this element acts as a div and takes up a whole row in its parent container, also it is responsive and will change size based on the screen size.

Choosing the language

HTML attribute 'language' should correspond to the language that the customer is using currently.

Supported languages:

  • English - "en"
  • German - "de"
  • Finnish - "fi"
  • Swedish - "sv-SE"
  • Danish - "da"
  • Norwegian - "no"
  • Dutch - "nl"

Custom text in Read More modal

Clicking on the Read More button opens a overlay modal which contains additional information about 14-day invoice.
Using slots you can have custom information in Read More modal.
Custom message must be in a div HTML tag container with slot="modal-body-inner" attribute:

<riverty-invoice language="nl">
    <div slot="modal-body-inner">
        <h1>Hello world!</h1>
    </div>
</riverty-invoice>