Widget Builder
Build the widget for your needs, then, simply copy and paste the provided code. No technical experience required.
You can use the widget builder to design it for your needs, then, simply copy and paste the provided code. No technical experience required.
There is a glossary of terms you can use below.
Widget Configuration
Hover to expand
Headlines
Elements
Location Settings
Colors
Dimensions
| Name | Example | Description |
|---|---|---|
| apiKey | "pk_..." | Your InBe public API key is required. You can get one from the dashboard. |
| container | document.getElementById("inbe-widget") | The container id is required. This is where the widget will render. |
| headline | "Let's find some unforgettable restaurants" | Main heading text. Defaults to "Let's find some unforgettable restaurants". |
| secondary | "Add your preferences and needs, and we'll find the perfect places for you" | Support text below the headline. Defaults to descriptive text. |
| templateType | ["location","preferences","search"] | Which sections are shown. Remove any sections you don't want to show. Defaults to ["location","search","preferences"]. |
| locations | [{ label: "London" }] or [{ lat: 51.5, lon: -0.12, label: "London" }] | Starting location context. Defaults to []. |
| smartHeadline | false | Automatically adds location into the headline when available. Defaults to true. |
| primaryColor | "#222222" | Main brand color. Defaults to "#1A0C29". |
| secondaryColor | "#00AEEF" | Accent/action color. Defaults to "#FF164E". |
| backgroundColor | "#F7F7F7" | Widget background. Defaults to "#FFFFFF". |
| height | "600px" | Widget height. Defaults to "100%". |
| width | "100%" | Widget width. Defaults to "100%". |
| maxHeight | "800px" | Max height. Defaults to "stretch". |
| minHeight | "400px" | Min height. Defaults to "150px". |
| maxWidth | "1200px" | Max width. Defaults to "stretch". |
| minWidth | "320px" | Min width. Defaults to "300px". |