Getting Started

Embed a Product card or Product Card Group into a web page

Insert the following HTML-code where you want the product card to be embedded

<span data-pilvi-emb-pc-id="INSERT_PRODUCT_CARD_ID_HERE"></span>

Insert the following HTML-code where you want the product card group to be embedded

<span data-pilvi-emb-pcg-id="INSERT_PRODUCT_CARD_GROUP_ID_HERE"></span>

Add the following code to the end of the body-tag. Alter init() parameters to based on your site.

<script src="https://embed.pilvi.com/0.1.11/pilvi-embedded.js"></script>
<script>
PilviEmbedded.init({
  SESSION_HOST: 'INSERT_SITE_HOSTNAME_HERE',
  API_HOST: 'saas.api.service.pilvi.com'
});
</script>

Functions

init(options)

Call to initialize PilviEmbedded

Parameters

Name Type Description
SESSION_HOST String Domain/hostname from which the data is fetched
SESSION_URL String Deprecated. URL to use as base for the session in which the data is fetched
API_HOST String Domain/hostname of the API to which the calls are performed
API_URL String Deprecated. URL of the API to which the calls are performed
HTTPS Boolean
(optional)
Force HTTPS usage. Defaults to false.
LANGUAGE String
(optional)
Language code of the language in which elements are to be showed on. Defaults to ‘en_US’.
PRICES Array
(optional)
Price types to show and their order. Defaults to [‘VAT_INCL’,’VAT_EXCL’]
COMPARE Boolean
(optional)
Whether to use compare view by default for groups. Defaults to false.
onReady Function
(optional)
Called when all elements are rendered

reload()

Can be called after init to re-fetch data for the elements in the current page.

Data attribute overrides

Data attribute Values Description
data-pilvi-emb-pc-prices=””
data-pilvi-emb-pcg-prices=””
VAT_EXCL
VAT_INCL
VAT_EXCL,VAT_INCL
VAT_INCL,VAT_EXCL
Change how the price is shown per product card or group
data-pilvi-emb-pcg-compare=”” true
false
Change per group whether to use compare view or not

Example

Code

<span data-pilvi-emb-pcg-id="INSERT_PRODUCT_CARD_GROUP_ID_HERE"></span>
<script src="https://embed.pilvi.com/stable/pilvi-embedded.js"></script>
<script>
PilviEmbedded.init({
  SESSION_HOST: 'onboarding.saas.pilvi.com',
  API_HOST: 'saas.api.service.pilvi.com',
  HTTPS: true,
  LANGUAGE: 'en_US',
  PRICES: ['VAT_INCL', 'VAT_EXCL'],
  onReady: function(){}
});
</script>

Result



Change Log

0.1.11 (STABLE)

Bugfix for trial period parsing

0.1.10

Bugfix for Property handling on compare view

0.1.9

Bugfix for Product Card Group Compare feature

0.1.8

Fixes for preventing classname conflicts. Price separator line shown only id one VAT option is enabled.

0.1.7

Bugfix for missing optional LANGUAGE init parameter

0.1.6

Bugfix for missing optional onReady init parameter

0.1.5

PRICES is no longer a mandatory init parameter

0.1.4

Support for price and compare overriding using data attributes

0.1.2

Bugfixes for Product Card Group Feature rendering.

0.1.1

Bugfixes for Product Card Groups

0.1.0

Added support for Product Card Groups. Pre 0.1.0 versions of themes wont work anymore.

0.0.5

First release