Configuration options - Product card widget

The Product card widget's appearance and behaviour can be influenced by configuration options. All configuration options are used by setting the respective properties on the "window.porterbuddy" object.

Available configuration options - items in bold are required

Key Type Description
token string The public API token given to you by Porterbuddy
view availability | checkout | deliveryInfo The view to start the widget in
apiMode test | production Use this to switch between test or production mode. The default mode is the one for the environment the widget source code is loaded from.
apiBaseUrl string Base URL for fetching delivery windows. Note: this configuration option is used for testing purposes only, in general, setting this option should be not necessary. This setting overrides the url determined by apiMode.
resetContext boolean If set to true, all previously set properties will be reset to the default value if not defined with a new value in this context
allowStorage boolean If enabled, the widget will store the users postcode in localstorage
allowGeoLocation boolean Allow geolocation detection. This will trigger a popup in the users browser asking for permission.
postalCode string If you already have the users postcode you can set it here to check availability immediately. For Checkout mode, this sets the store postcode to the specified value
cssClassPrefix string All CSS classes in the widget are prefixed by this string.
alternateAvailabilityView boolean Allows to set the white background color in product card widget with black font, default value -> false
language NO | EN Language is necessary when custom texts are provided. It will set proper variable texts regarding the language set. It is only necessary when custom texts are provided. By default language is detected by users browser setting
text object Texts used in the widget
pickupWindows PickupWindow[] Use the specified pickup windows for querying availability
discount number Discount to be applied on all delivery prices shown, specified as hundreds of a value unit (e.g. discount=5000 for a price reduction by 50 NOK)
additionalDiscounts Dictionary: string to number Additional discounts for price calculation in text replacements. Please check the documentation page "Multiple Discounts" for usage examples
onUpdateDeliveryWindows function (callback, additionalInfo) Function that runs when delivery windows should be updated. The function is given a callback function that must be executed with an availability response once they are fetched. This is to support async fetching. The additional info object (second parameter) should be added to the availability call to the Porterbuddy API.
updateDeliveryWindowsInterval number Time in seconds to wait before requesting updated delivery windows
hideIfUnavailable boolean Hide the widget if Porterbuddy delivery is not available for the specified postcode, default=true
availabilityCacheTTL number Time in seconds to cache availability responses. If the time is set to 0, availability responses will not be cached.
now string For testing only. Hardcode the value of now to get predictable results when testing with test data and date functions
originAddress boolean The origin address from which the merchandise will be sent. If not specified, Oslo is assumed as the origin.
onStartFetchAvailability function(string, (Address | CustomMessage | null) => void) This functions is called when availability is fetched. It is called with the entered postcode and a callback function, which parameter can be one of the following things: 1. the new origin address, 2. a custom message to display instead of doing an availability call, 3. null to use the previously set origin address
onSetCallbacks function(callbacks) Function that gets called after initialization of the widget. The function argument is an object containing callback function references, which can be used to to interact with the widget from externally.

The property "onSetCallbacks" has a special behaviour. This is a callback function that gets passed function references to methods to interact with the widget during runtime. The usage of this function is explained here.