Riverty Elements Showcase

What is a Riverty Element?

A Riverty Element is a custom element that can be included in any web page, regardless of what other web technologies are in use.

How to use Riverty Elements

Include the script from Riverty CDN. Add these two lines two your HTML (for instance, at the end of the <head> element).

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

Why two lines? It's a performance optimization called Differential Serving. Only older browsers will load the second script file - modern browsers use the first one, which is smaller and faster.

riverty-info #

Attributes:

merchant: 0000 (demo merchant)

Slots:
<riverty-info merchant="0000" language="en"></riverty-info>

Output:

riverty-invoice #

Attributes:

Slots:
<riverty-invoice language="en" theme="green"></riverty-invoice>

Output:

riverty-offer #

Attributes:

merchant: 0000 (demo merchant)

Slots:
<riverty-offer merchant="0000" language="en" theme="green" amount="200"></riverty-offer>

Output:

riverty-split #

Attributes:

merchant: 0000 (demo merchant)

Options:
<riverty-split language="en" theme="green" amount="150" split-in-parts="3" show-offer="true"></riverty-split>

Output:

riverty-tc #

Attributes:

clientId: 0000 (demo client)

<riverty-tc clientId="0000" language="en" amount="200" paymentmethod="consolidatedDirectDebit" selectedpaymentproduct="T-shirt" country="Germany"></riverty-tc>

Output:

riverty-privacy-policy #

<riverty-privacy-policy text="privacy policy"></riverty-privacy-policy>

Output: