Add the Configuration Code to a Website
Use the following guide to connect Bilberry Base and your website. You will need to complete these steps in order to be able to add desired widgets to your website, as a next step.
If you are a website developer, or a person with deeper understanding of this, you can use our more detailed documentation for developers.
Step 1: Allow Domain (CORS)
Cross-Origin Resource Sharing (CORS) controls which domains are allowed to integrate and use our widgets securely. This ensures that our widgets function seamlessly only on pre-approved websites, protecting against unauthorized requests.
It is possible to add as many domains as needed to display widgets.
Navigate to Widgets in the left side menu.
Click Widget settings.
Click the Token tab.
Type or paste the domain into the Add domain field.
Click Add.
Step 2: Configuration Code
In your Content Management System (CMS), like Wordpress, WIX or Joomla, the configuration code should be added to where you can add a global customized code. Make sure to add this in the <head> section.
Always add the configuration code as early as possible within the <head> section.
The code box under contains an empty configuration code. An empty configuration code implies that the fields have not been filled in yet. By replacing the content between (and including) the << >> characters with the correct information, the configuration code will have what it needs to secure the connection between the website and Bilberry Base.
<script type="text/javascript">
window.BilberryWidgetsGlobal = window.BilberryWidgetsGlobal || {};
window.BilberryWidgetsGlobal.bilberryAccessToken = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJhdWQiOiIzIiwianRpIjoiMGRjMjM1NTE0ZTQ3MmNjZDJhY2UwNDcxNmI3ODFlMzAyYjY0NGI0YTZhZTE1YWJkMDQzZDUwYTJhOWU0NmE1YjI3MjUwNjJkYWYyZTFjZGQiLCJpYXQiOjE3NDExNzc4NzEsIm5iZiI6MTc0MTE3Nzg3MSwiZXhwIjo0ODY1MzE1NDcxLCJzdWIiOiIiLCJzY29wZXMiOltdfQ.Ej7wBCBIfuacCPSDvRB0zskehXbs8lw9sP9ORV6y8Gv0Qfk_2-oX0pz4_tPFV3KCC7enD_hbiNheGvFxGHmgQl6cQflPbB7Sf-eLG92HxBp3Oh-zxrMne9eFjJrvNZs-ulyxGpTqGQQjD6dJCaa2YdMtgHJlPEtpbJbBN0HYxNUfL4KybFRmBpMy2-gJYTHbNtxbPrL4nQo9C4hT-PWyUCNjHL03VfOuMAngINRjoK-v-6X_rH8rMIHLOUpx7wfqU-9BFKd0d_dg7Fa0jw-T5NAO82TceGrO3WN7LqL5gRdUyqmdpEyuxKbguEIHykxxLs7frzoloPm-fZM7B9vLZhxJVYt1vOMqijW8zJ4bNx-G_xrPhKQE8ct1EmjPUvHrUgsrLgTE6vLFZxL3H7nghQRKtB3hEkBAZ0UaPVOS0U5MU2Twyb5cxMtURSQ-63D4b9QL2otgJVUivWjDD9t7AT9QQFngbzBSq8SLOinNoAYJHNSUsBAyqVpLbu3EXSPE4G0IuTVd7LF3wmE1fCZBhdNb8xxYtlpB35LOLzclnIKNSoRCEBG14yTPtlT0qy4-FcMGAnDw-4dIzXo7_C77cB5z5_WxZbryzJ2euzhVL0eyQbF17LzsHevceYHHY_JLkQDU2o7_o1kwgq3q2nU8uHiDY9NJ2mWyv_xWDIZrJvI';
window.BilberryWidgetsGlobal.termsUrl = '<<URL TO YOUR TERMS AND CONDITIONS>>';
window.BilberryWidgetsGlobal.privacyUrl = '<<URL TO YOUR PRIVACY POLICY>>';
window.BilberryWidgetsGlobal.bilberryBaseApiUrl =
'https://<<NAME OF YOUR BILBERRY INSTANCE>>.bilberry.app';
window.BilberryWidgetsGlobal.language = document.documentElement.lang;
</script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/vendor.js"></script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/main.js"></script>Field | Description |
|---|---|
| A token (key) collected from Bilberry Base.
|
| The complete url to where your Terms and Conditions are located on your website. |
| The complete url to where your Privacy Policy are located on your website. |
| This is normally the company name. Example: |
You can find this by going to the left side menu in Base, and clicking Widgets → Widget settings → Token.You can read more detailed information about how to configure this in our documentation for developers.
Fetch a pre-filled code from your Base instance
Navigate to Widgets → Widget settings.
Color changes done here will appear in the microstore (where you can preview your products or send a link that is bookable directly from Base).
Click the Terms and privacy tab.
Copy and paste Terms and conditions and Privacy policy (often already on your website). This will ensure that the terms and conditions and privacy policy are also available in the microstore.
Click the Embed code tab.
Copy the ready-made code and paste this in th global header of your CMS.
Click the Advanced setup tab.
Here you can make changes to colors, fonts, and more, that will reflect in the microstore.
Step 3: Theme Code
Widgets can be customized to match your brand’s identity, ensuring a seamless and visually cohesive user experience. There are many different theme properties that can be used,
The theme code uses HEX code to define the colors. Simply add the HEX color code.
<script>
window.BilberryCustomTheme = {
primaryColor: '#ff0000',
primaryColorContrast: '#ffffff',
secondaryColor: '#00ff00',
secondaryColorContrast: '#000000',
checkoutHeaderColor: '#222222',
checkoutHeaderColorContrast: '#ffffff',
checkoutHeaderPrimaryColor: '#ff0000',
lightestGrey: '#f5f5f5',
fontFamily: 'Arial, sans-serif',
bodyFont: 'Arial, sans-serif',
h1Font: 'Arial, sans-serif',
h2Font: 'Arial, sans-serif',
h3Font: 'Arial, sans-serif',
h4Font: 'Arial, sans-serif',
h5Font: 'Arial, sans-serif',
h6Font: 'Arial, sans-serif',
bookingWidgetColor: '#ffffff',
bookingWidgetPrimaryColor: '#ff0000',
bookingWidgetInputColor: '#f5f5f5',
bookingWidgetInputTextColor: '#333333',
iconUrl: 'https://example.com/logo.png',
fontSize: 14,
};
</script>💡 Example:
<script type="text/javascript">
window.BilberryWidgetsGlobal = window.BilberryWidgetsGlobal || {};
window.BilberryWidgetsGlobal.bilberryAccessToken = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJhdWQiOiIzIiwianRpIjoiMGRjMjM1NTE0ZTQ3MmNjZDJhY2UwNDcxNmI3ODFlMzAyYjY0NGI0YTZhZTE1YWJkMDQzZDUwYTJhOWU0NmE1YjI3MjUwNjJkYWYyZTFjZGQiLCJpYXQiOjE3NDExNzc4NzEsIm5iZiI6MTc0MTE3Nzg3MSwiZXhwIjo0ODY1MzE1NDcxLCJzdWIiOiIiLCJzY29wZXMiOltdfQ.Ej7wBCBIfuacCPSDvRB0zskehXbs8lw9sP9ORV6y8Gv0Qfk_2-oX0pz4_tPFV3KCC7enD_hbiNheGvFxGHmgQl6cQflPbB7Sf-eLG92HxBp3Oh-zxrMne9eFjJrvNZs-ulyxGpTqGQQjD6dJCaa2YdMtgHJlPEtpbJbBN0HYxNUfL4KybFRmBpMy2-gJYTHbNtxbPrL4nQo9C4hT-PWyUCNjHL03VfOuMAngINRjoK-v-6X_rH8rMIHLOUpx7wfqU-9BFKd0d_dg7Fa0jw-T5NAO82TceGrO3WN7LqL5gRdUyqmdpEyuxKbguEIHykxxLs7frzoloPm-fZM7B9vLZhxJVYt1vOMqijW8zJ4bNx-G_xrPhKQE8ct1EmjPUvHrUgsrLgTE6vLFZxL3H7nghQRKtB3hEkBAZ0UaPVOS0U5MU2Twyb5cxMtURSQ-63D4b9QL2otgJVUivWjDD9t7AT9QQFngbzBSq8SLOinNoAYJHNSUsBAyqVpLbu3EXSPE4G0IuTVd7LF3wmE1fCZBhdNb8xxYtlpB35LOLzclnIKNSoRCEBG14yTPtlT0qy4-FcMGAnDw-4dIzXo7_C77cB5z5_WxZbryzJ2euzhVL0eyQbF17LzsHevceYHHY_JLkQDU2o7_o1kwgq3q2nU8uHiDY9NJ2mWyv_xWDIZrJvI';
window.BilberryWidgetsGlobal.termsUrl = '<<URL TO YOUR TERMS AND CONDITIONS>>';
window.BilberryWidgetsGlobal.privacyUrl = '<<URL TO YOUR PRIVACY POLICY>>';
window.BilberryWidgetsGlobal.bilberryBaseApiUrl =
'https://<<NAME OF YOUR BILBERRY INSTANCE>>.bilberry.app';
window.BilberryWidgetsGlobal.language = document.documentElement.lang;
</script>
<script>
window.BilberryCustomTheme = {
primaryColor: '#ff0000',
primaryColorContrast: '#ffffff',
secondaryColor: '#00ff00',
secondaryColorContrast: '#000000',
checkoutHeaderColor: '#222222',
checkoutHeaderColorContrast: '#ffffff',
checkoutHeaderPrimaryColor: '#ff0000',
lightestGrey: '#f5f5f5',
fontFamily: 'Arial, sans-serif',
bodyFont: 'Arial, sans-serif',
h1Font: 'Arial, sans-serif',
h2Font: 'Arial, sans-serif',
h3Font: 'Arial, sans-serif',
h4Font: 'Arial, sans-serif',
h5Font: 'Arial, sans-serif',
h6Font: 'Arial, sans-serif',
bookingWidgetColor: '#ffffff',
bookingWidgetPrimaryColor: '#ff0000',
bookingWidgetInputColor: '#f5f5f5',
bookingWidgetInputTextColor: '#333333',
iconUrl: 'https://example.com/logo.png',
fontSize: 14,
};
</script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/vendor.js"></script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/main.js"></script>You can read more about theming in our documentation for developers.
Additional Scripts for Specific Features
Language
By default, the widgets will infer the language from the user’s browser settings. If the user has an unsupported language selected for the browser, the widgets will default to English.
If you wish to set the language for the widgets to Norwegian (or another language) explicitly, you can do so by adding the following code to the configuration:
<script type="text/javascript">
window.BilberryWidgetsGlobal.language = 'nb-NO';
</script>Remember to remove the default language code that is in the configuration code already:
window.BilberryWidgetsGlobal.language = document.documentElement.lang;
💡 Example:
<script type="text/javascript">
window.BilberryWidgetsGlobal = window.BilberryWidgetsGlobal || {};
window.BilberryWidgetsGlobal.bilberryAccessToken = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJhdWQiOiIzIiwianRpIjoiMGRjMjM1NTE0ZTQ3MmNjZDJhY2UwNDcxNmI3ODFlMzAyYjY0NGI0YTZhZTE1YWJkMDQzZDUwYTJhOWU0NmE1YjI3MjUwNjJkYWYyZTFjZGQiLCJpYXQiOjE3NDExNzc4NzEsIm5iZiI6MTc0MTE3Nzg3MSwiZXhwIjo0ODY1MzE1NDcxLCJzdWIiOiIiLCJzY29wZXMiOltdfQ.Ej7wBCBIfuacCPSDvRB0zskehXbs8lw9sP9ORV6y8Gv0Qfk_2-oX0pz4_tPFV3KCC7enD_hbiNheGvFxGHmgQl6cQflPbB7Sf-eLG92HxBp3Oh-zxrMne9eFjJrvNZs-ulyxGpTqGQQjD6dJCaa2YdMtgHJlPEtpbJbBN0HYxNUfL4KybFRmBpMy2-gJYTHbNtxbPrL4nQo9C4hT-PWyUCNjHL03VfOuMAngINRjoK-v-6X_rH8rMIHLOUpx7wfqU-9BFKd0d_dg7Fa0jw-T5NAO82TceGrO3WN7LqL5gRdUyqmdpEyuxKbguEIHykxxLs7frzoloPm-fZM7B9vLZhxJVYt1vOMqijW8zJ4bNx-G_xrPhKQE8ct1EmjPUvHrUgsrLgTE6vLFZxL3H7nghQRKtB3hEkBAZ0UaPVOS0U5MU2Twyb5cxMtURSQ-63D4b9QL2otgJVUivWjDD9t7AT9QQFngbzBSq8SLOinNoAYJHNSUsBAyqVpLbu3EXSPE4G0IuTVd7LF3wmE1fCZBhdNb8xxYtlpB35LOLzclnIKNSoRCEBG14yTPtlT0qy4-FcMGAnDw-4dIzXo7_C77cB5z5_WxZbryzJ2euzhVL0eyQbF17LzsHevceYHHY_JLkQDU2o7_o1kwgq3q2nU8uHiDY9NJ2mWyv_xWDIZrJvI';
window.BilberryWidgetsGlobal.termsUrl = '<<URL TO YOUR TERMS AND CONDITIONS>>';
window.BilberryWidgetsGlobal.privacyUrl = '<<URL TO YOUR PRIVACY POLICY>>';
window.BilberryWidgetsGlobal.bilberryBaseApiUrl =
'https://<<NAME OF YOUR BILBERRY INSTANCE>>.bilberry.app';
</script>
<script type="text/javascript">
window.BilberryWidgetsGlobal.language = 'nb-NO';
</script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/vendor.js"></script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/main.js"></script>Opening date
If you are open for booking, but the first bookable date is far in the future, you can default the start date in search forms or booking widgets to the first bookable date. This prevent the customer from having to click past several months.
Do this by adding the following code to your configuration:
window.BilberryWidgetsGlobal.openingDate = '2023-06-09';The date format is set to YYYY-MM-DD.
💡 Example:
<script type="text/javascript">
window.BilberryWidgetsGlobal = window.BilberryWidgetsGlobal || {};
window.BilberryWidgetsGlobal.bilberryAccessToken = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJhdWQiOiIzIiwianRpIjoiMGRjMjM1NTE0ZTQ3MmNjZDJhY2UwNDcxNmI3ODFlMzAyYjY0NGI0YTZhZTE1YWJkMDQzZDUwYTJhOWU0NmE1YjI3MjUwNjJkYWYyZTFjZGQiLCJpYXQiOjE3NDExNzc4NzEsIm5iZiI6MTc0MTE3Nzg3MSwiZXhwIjo0ODY1MzE1NDcxLCJzdWIiOiIiLCJzY29wZXMiOltdfQ.Ej7wBCBIfuacCPSDvRB0zskehXbs8lw9sP9ORV6y8Gv0Qfk_2-oX0pz4_tPFV3KCC7enD_hbiNheGvFxGHmgQl6cQflPbB7Sf-eLG92HxBp3Oh-zxrMne9eFjJrvNZs-ulyxGpTqGQQjD6dJCaa2YdMtgHJlPEtpbJbBN0HYxNUfL4KybFRmBpMy2-gJYTHbNtxbPrL4nQo9C4hT-PWyUCNjHL03VfOuMAngINRjoK-v-6X_rH8rMIHLOUpx7wfqU-9BFKd0d_dg7Fa0jw-T5NAO82TceGrO3WN7LqL5gRdUyqmdpEyuxKbguEIHykxxLs7frzoloPm-fZM7B9vLZhxJVYt1vOMqijW8zJ4bNx-G_xrPhKQE8ct1EmjPUvHrUgsrLgTE6vLFZxL3H7nghQRKtB3hEkBAZ0UaPVOS0U5MU2Twyb5cxMtURSQ-63D4b9QL2otgJVUivWjDD9t7AT9QQFngbzBSq8SLOinNoAYJHNSUsBAyqVpLbu3EXSPE4G0IuTVd7LF3wmE1fCZBhdNb8xxYtlpB35LOLzclnIKNSoRCEBG14yTPtlT0qy4-FcMGAnDw-4dIzXo7_C77cB5z5_WxZbryzJ2euzhVL0eyQbF17LzsHevceYHHY_JLkQDU2o7_o1kwgq3q2nU8uHiDY9NJ2mWyv_xWDIZrJvI';
window.BilberryWidgetsGlobal.termsUrl = '<<URL TO YOUR TERMS AND CONDITIONS>>';
window.BilberryWidgetsGlobal.privacyUrl = '<<URL TO YOUR PRIVACY POLICY>>';
window.BilberryWidgetsGlobal.bilberryBaseApiUrl =
'https://<<NAME OF YOUR BILBERRY INSTANCE>>.bilberry.app';
window.BilberryWidgetsGlobal.language = document.documentElement.lang;
window.BilberryWidgetsGlobal.openingDate = '2023-06-09';
</script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/vendor.js"></script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/main.js"></script>Limit Persons in Search Forms
You can set a max limit of how many people the user can add when searching for Accommodation or Activities. This provides the user with a better user experience, as you can ensure they will not perform searches which would exceed your maximum capacity. This also works for setting a max number of participants in the booking popup widget.
Add this limit by adding the following code to your configuration, changing the number as required:
window.BilberryWidgetsGlobal.personsMax = 10;💡 Example:
<script type="text/javascript">
window.BilberryWidgetsGlobal = window.BilberryWidgetsGlobal || {};
window.BilberryWidgetsGlobal.bilberryAccessToken = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJhdWQiOiIzIiwianRpIjoiMGRjMjM1NTE0ZTQ3MmNjZDJhY2UwNDcxNmI3ODFlMzAyYjY0NGI0YTZhZTE1YWJkMDQzZDUwYTJhOWU0NmE1YjI3MjUwNjJkYWYyZTFjZGQiLCJpYXQiOjE3NDExNzc4NzEsIm5iZiI6MTc0MTE3Nzg3MSwiZXhwIjo0ODY1MzE1NDcxLCJzdWIiOiIiLCJzY29wZXMiOltdfQ.Ej7wBCBIfuacCPSDvRB0zskehXbs8lw9sP9ORV6y8Gv0Qfk_2-oX0pz4_tPFV3KCC7enD_hbiNheGvFxGHmgQl6cQflPbB7Sf-eLG92HxBp3Oh-zxrMne9eFjJrvNZs-ulyxGpTqGQQjD6dJCaa2YdMtgHJlPEtpbJbBN0HYxNUfL4KybFRmBpMy2-gJYTHbNtxbPrL4nQo9C4hT-PWyUCNjHL03VfOuMAngINRjoK-v-6X_rH8rMIHLOUpx7wfqU-9BFKd0d_dg7Fa0jw-T5NAO82TceGrO3WN7LqL5gRdUyqmdpEyuxKbguEIHykxxLs7frzoloPm-fZM7B9vLZhxJVYt1vOMqijW8zJ4bNx-G_xrPhKQE8ct1EmjPUvHrUgsrLgTE6vLFZxL3H7nghQRKtB3hEkBAZ0UaPVOS0U5MU2Twyb5cxMtURSQ-63D4b9QL2otgJVUivWjDD9t7AT9QQFngbzBSq8SLOinNoAYJHNSUsBAyqVpLbu3EXSPE4G0IuTVd7LF3wmE1fCZBhdNb8xxYtlpB35LOLzclnIKNSoRCEBG14yTPtlT0qy4-FcMGAnDw-4dIzXo7_C77cB5z5_WxZbryzJ2euzhVL0eyQbF17LzsHevceYHHY_JLkQDU2o7_o1kwgq3q2nU8uHiDY9NJ2mWyv_xWDIZrJvI';
window.BilberryWidgetsGlobal.termsUrl = '<<URL TO YOUR TERMS AND CONDITIONS>>';
window.BilberryWidgetsGlobal.privacyUrl = '<<URL TO YOUR PRIVACY POLICY>>';
window.BilberryWidgetsGlobal.bilberryBaseApiUrl =
'https://<<NAME OF YOUR BILBERRY INSTANCE>>.bilberry.app';
window.BilberryWidgetsGlobal.language = document.documentElement.lang;
window.BilberryWidgetsGlobal.personsMax = 10;
</script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/vendor.js"></script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/main.js"></script>Stripe
If using Stripe as a payment provider you need to add the following code to your configuration:
window.BilberryWidgetsGlobal.paymentProvider = 'stripe';💡 Example:
<script type="text/javascript">
window.BilberryWidgetsGlobal = window.BilberryWidgetsGlobal || {};
window.BilberryWidgetsGlobal.bilberryAccessToken = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJhdWQiOiIzIiwianRpIjoiMGRjMjM1NTE0ZTQ3MmNjZDJhY2UwNDcxNmI3ODFlMzAyYjY0NGI0YTZhZTE1YWJkMDQzZDUwYTJhOWU0NmE1YjI3MjUwNjJkYWYyZTFjZGQiLCJpYXQiOjE3NDExNzc4NzEsIm5iZiI6MTc0MTE3Nzg3MSwiZXhwIjo0ODY1MzE1NDcxLCJzdWIiOiIiLCJzY29wZXMiOltdfQ.Ej7wBCBIfuacCPSDvRB0zskehXbs8lw9sP9ORV6y8Gv0Qfk_2-oX0pz4_tPFV3KCC7enD_hbiNheGvFxGHmgQl6cQflPbB7Sf-eLG92HxBp3Oh-zxrMne9eFjJrvNZs-ulyxGpTqGQQjD6dJCaa2YdMtgHJlPEtpbJbBN0HYxNUfL4KybFRmBpMy2-gJYTHbNtxbPrL4nQo9C4hT-PWyUCNjHL03VfOuMAngINRjoK-v-6X_rH8rMIHLOUpx7wfqU-9BFKd0d_dg7Fa0jw-T5NAO82TceGrO3WN7LqL5gRdUyqmdpEyuxKbguEIHykxxLs7frzoloPm-fZM7B9vLZhxJVYt1vOMqijW8zJ4bNx-G_xrPhKQE8ct1EmjPUvHrUgsrLgTE6vLFZxL3H7nghQRKtB3hEkBAZ0UaPVOS0U5MU2Twyb5cxMtURSQ-63D4b9QL2otgJVUivWjDD9t7AT9QQFngbzBSq8SLOinNoAYJHNSUsBAyqVpLbu3EXSPE4G0IuTVd7LF3wmE1fCZBhdNb8xxYtlpB35LOLzclnIKNSoRCEBG14yTPtlT0qy4-FcMGAnDw-4dIzXo7_C77cB5z5_WxZbryzJ2euzhVL0eyQbF17LzsHevceYHHY_JLkQDU2o7_o1kwgq3q2nU8uHiDY9NJ2mWyv_xWDIZrJvI';
window.BilberryWidgetsGlobal.termsUrl = '<<URL TO YOUR TERMS AND CONDITIONS>>';
window.BilberryWidgetsGlobal.privacyUrl = '<<URL TO YOUR PRIVACY POLICY>>';
window.BilberryWidgetsGlobal.bilberryBaseApiUrl =
'https://<<NAME OF YOUR BILBERRY INSTANCE>>.bilberry.app';
window.BilberryWidgetsGlobal.language = document.documentElement.lang;
window.BilberryWidgetsGlobal.paymentProvider = 'stripe';
</script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/vendor.js"></script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/main.js"></script>Custom Increments for Gift Card Purchases
If you would like to use your own increments in the gift card purchase widget, you can edit the standard intervals by adding the following code to the configuration:
window.BilberryWidgetsGlobal.giftCardPriceIncrements = [10, 25, 50, 100];For usability reasons, you should not add more than four, although it is possible. Feel free to use fewer increments. The prices are in the currency configured in your Bilberry instance.
💡 Example:
<script type="text/javascript">
window.BilberryWidgetsGlobal = window.BilberryWidgetsGlobal || {};
window.BilberryWidgetsGlobal.bilberryAccessToken = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJhdWQiOiIzIiwianRpIjoiMGRjMjM1NTE0ZTQ3MmNjZDJhY2UwNDcxNmI3ODFlMzAyYjY0NGI0YTZhZTE1YWJkMDQzZDUwYTJhOWU0NmE1YjI3MjUwNjJkYWYyZTFjZGQiLCJpYXQiOjE3NDExNzc4NzEsIm5iZiI6MTc0MTE3Nzg3MSwiZXhwIjo0ODY1MzE1NDcxLCJzdWIiOiIiLCJzY29wZXMiOltdfQ.Ej7wBCBIfuacCPSDvRB0zskehXbs8lw9sP9ORV6y8Gv0Qfk_2-oX0pz4_tPFV3KCC7enD_hbiNheGvFxGHmgQl6cQflPbB7Sf-eLG92HxBp3Oh-zxrMne9eFjJrvNZs-ulyxGpTqGQQjD6dJCaa2YdMtgHJlPEtpbJbBN0HYxNUfL4KybFRmBpMy2-gJYTHbNtxbPrL4nQo9C4hT-PWyUCNjHL03VfOuMAngINRjoK-v-6X_rH8rMIHLOUpx7wfqU-9BFKd0d_dg7Fa0jw-T5NAO82TceGrO3WN7LqL5gRdUyqmdpEyuxKbguEIHykxxLs7frzoloPm-fZM7B9vLZhxJVYt1vOMqijW8zJ4bNx-G_xrPhKQE8ct1EmjPUvHrUgsrLgTE6vLFZxL3H7nghQRKtB3hEkBAZ0UaPVOS0U5MU2Twyb5cxMtURSQ-63D4b9QL2otgJVUivWjDD9t7AT9QQFngbzBSq8SLOinNoAYJHNSUsBAyqVpLbu3EXSPE4G0IuTVd7LF3wmE1fCZBhdNb8xxYtlpB35LOLzclnIKNSoRCEBG14yTPtlT0qy4-FcMGAnDw-4dIzXo7_C77cB5z5_WxZbryzJ2euzhVL0eyQbF17LzsHevceYHHY_JLkQDU2o7_o1kwgq3q2nU8uHiDY9NJ2mWyv_xWDIZrJvI';
window.BilberryWidgetsGlobal.termsUrl = '<<URL TO YOUR TERMS AND CONDITIONS>>';
window.BilberryWidgetsGlobal.privacyUrl = '<<URL TO YOUR PRIVACY POLICY>>';
window.BilberryWidgetsGlobal.bilberryBaseApiUrl =
'https://<<NAME OF YOUR BILBERRY INSTANCE>>.bilberry.app';
window.BilberryWidgetsGlobal.language = document.documentElement.lang;
window.BilberryWidgetsGlobal.giftCardPriceIncrements = [10, 25, 50, 100];
</script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/vendor.js"></script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/main.js"></script>Hiding VAT Information from Summary
In some countries there are special rules, and potentially undetermined tax rates at the time of purchase. To accommodate this, you have the option to hide away the VAT information from the summary by adding the following code to your configuration:
window.BilberryWidgetsGlobal.hideVat = true;💡 Example:
<script type="text/javascript">
window.BilberryWidgetsGlobal = window.BilberryWidgetsGlobal || {};
window.BilberryWidgetsGlobal.bilberryAccessToken = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJhdWQiOiIzIiwianRpIjoiMGRjMjM1NTE0ZTQ3MmNjZDJhY2UwNDcxNmI3ODFlMzAyYjY0NGI0YTZhZTE1YWJkMDQzZDUwYTJhOWU0NmE1YjI3MjUwNjJkYWYyZTFjZGQiLCJpYXQiOjE3NDExNzc4NzEsIm5iZiI6MTc0MTE3Nzg3MSwiZXhwIjo0ODY1MzE1NDcxLCJzdWIiOiIiLCJzY29wZXMiOltdfQ.Ej7wBCBIfuacCPSDvRB0zskehXbs8lw9sP9ORV6y8Gv0Qfk_2-oX0pz4_tPFV3KCC7enD_hbiNheGvFxGHmgQl6cQflPbB7Sf-eLG92HxBp3Oh-zxrMne9eFjJrvNZs-ulyxGpTqGQQjD6dJCaa2YdMtgHJlPEtpbJbBN0HYxNUfL4KybFRmBpMy2-gJYTHbNtxbPrL4nQo9C4hT-PWyUCNjHL03VfOuMAngINRjoK-v-6X_rH8rMIHLOUpx7wfqU-9BFKd0d_dg7Fa0jw-T5NAO82TceGrO3WN7LqL5gRdUyqmdpEyuxKbguEIHykxxLs7frzoloPm-fZM7B9vLZhxJVYt1vOMqijW8zJ4bNx-G_xrPhKQE8ct1EmjPUvHrUgsrLgTE6vLFZxL3H7nghQRKtB3hEkBAZ0UaPVOS0U5MU2Twyb5cxMtURSQ-63D4b9QL2otgJVUivWjDD9t7AT9QQFngbzBSq8SLOinNoAYJHNSUsBAyqVpLbu3EXSPE4G0IuTVd7LF3wmE1fCZBhdNb8xxYtlpB35LOLzclnIKNSoRCEBG14yTPtlT0qy4-FcMGAnDw-4dIzXo7_C77cB5z5_WxZbryzJ2euzhVL0eyQbF17LzsHevceYHHY_JLkQDU2o7_o1kwgq3q2nU8uHiDY9NJ2mWyv_xWDIZrJvI';
window.BilberryWidgetsGlobal.termsUrl = '<<URL TO YOUR TERMS AND CONDITIONS>>';
window.BilberryWidgetsGlobal.privacyUrl = '<<URL TO YOUR PRIVACY POLICY>>';
window.BilberryWidgetsGlobal.bilberryBaseApiUrl =
'https://<<NAME OF YOUR BILBERRY INSTANCE>>.bilberry.app';
window.BilberryWidgetsGlobal.language = document.documentElement.lang;
window.BilberryWidgetsGlobal.hideVat = true;
</script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/vendor.js"></script>
<script type="module" src="https://bilberry-widgets.b-cdn.net/v4/main.js"></script>You can see our full list and read more about additional scripts for specific features in our documentation for developers.