Create and edit an integration
An integration is a combination of blocks that you embed on your website. You build it in the Manager under Website Integration. For this you need the Website Integration addon, see Website integration.
Create a new integration
- Open Manager → Website Integration, or directly app.bookicorn.net/integrationen.
- Tap + at the top, or New Integration on a computer.
- Under Integration name, enter a name, for example "Schedule" or "Pricing".
- Tap Save.
The new integration then opens for editing. It starts out empty and takes on the design of your booking page. The name is used to create the integration's identifier, which appears in the code.
Only admins can create and edit integrations.
The integrations overview
Under Website Integration, you see all integrations as cards. Each card shows whether the integration is Active or Inactive, how many blocks it has and whether it follows the booking page ("Follows booking page") or has its own design.
When you tap a card, a menu appears with Edit, Copy code, Preview, Deactivate (for inactive ones, Activate now) and Delete.
Above the cards, under Global settings, you find the Default settings (colors for all widgets) and Analytics.
Edit an integration on your phone
On a phone and in narrow browser windows, the integration shows its blocks as a list:
- Use the handle on the left (three lines) to drag a block to another position.
- Tap the name to open the block's settings.
- The red minus removes the block.
- Add widget opens the list of all blocks.
Below that are Colors (the integration's design), Copy code, Templates and Dimensions, and at the very bottom Save. At the top right, the eye icon opens the Preview.
Edit an integration on a computer
On a computer, the screen is split into three areas:
- on the left, a bar with the Widget library tab (all blocks, with search) and the Design tab,
- in the middle, Current blocks, the list of your blocks,
- on the right, the preview of the widget.
You add a block with one click in the bar or drag it into the list. At the top are Preview and Save.
On a computer, you reach Copy code via the integration's card in the overview. The editor currently only shows Templates and Dimensions in the narrow view. To get there, make your browser window narrower or open the integration on your phone.
Save and publish an integration
An integration is live as soon as you save it. There's no draft and no second step: after you Save, the embedded widget on your website shows the latest version. Until you save, the old version stays visible.
All blocks of the website integration
The blocks are split into six groups:
| Group | Blocks |
|---|---|
| Booking | Hero, Schedule, Course cards, Next sessions, Available slots |
| Members | Sign-in button, My bookings, Member home, Profile, Wallet |
| Pricing | Packages, Memberships, Gift cards, Credit balance |
| Team | Team overview, Single profile |
| Marketing | Reviews, Opening hours, Map, FAQ, Contact |
| Layout | Heading, Text block, Call to action, Tabs, Spacer, Divider |
Important: Memberships, Member home, Profile and Wallet are in the list, but in the embedded widget they currently only show the note "Widget … will be available soon". So don't use them yet.
Settings of the most important blocks
Tap a block to open its settings. Many blocks have Title and Show title.
- Schedule: View (Day, Week, Month, Tiles), Tiles per row, Show filter and the filters Filter by category, Filter by person, Filter by room, Filter by offering.
- Course cards: Columns, Count, Show image, Show description, Show person and the four filters.
- Next sessions: Count, Show person and the four filters.
- Available slots: for offerings with free time selection. Columns, Layout, Show image, Show description, Show person, plus the filters by category, person and offering.
- Hero: Title, Subtitle, Image, Button text, Button target, Height (Slim (title only), Compact, Normal, Large), Overlay opacity and Show studio name.
- Packages: Layout, Sort by, Maximum items and Highlight popular.
- Team overview: Layout, Maximum items, Show bio, Show specialisations.
- Single profile: Person (one trainer), Show courses, Course view, Course columns, Maximum courses, filters by room and offering, Contact link.
- Reviews: Style, Count, Minimum rating, Allow reviews.
- Map: Show directions, Height, Zoom level.
- Contact: Show address, Show phone, Show email, Show website, Show social links.
- Call to action: Title, Description, Button text, Button target, Background image, Background colour.
- Heading: Text, Level (Extra large, Large, Medium), Size, Alignment.
- Text block: Content, Alignment.
Within one filter, a single match is enough. Across filters, all of them have to match. With filters, you can for example build an integration that only shows your yoga offerings.
Sign-in button, My bookings and Credit balance on your website
The Sign-in button, My bookings and Credit balance blocks are meant for signed-in customers. On your website, My bookings and Credit balance show a prompt to sign in ("Log in to view your bookings"). Log In opens your booking page in a new tab. There, customers sign in and see their bookings and credits.
Use a template for an integration
A template is a ready-made layout to start from. You find it in the integration under Templates:
| Template | Blocks |
|---|---|
| Complete booking page | Hero, Schedule, Packages, Team overview, Reviews, FAQ |
| Schedule only | Schedule in the week view |
| Mini booking | Next sessions, Call to action |
| Studio showcase | Hero, Team overview, Reviews, Call to action |
| Member area | Schedule, My bookings, Wallet, Profile |
| Pricing | Heading, Packages, Call to action |
A template replaces the existing layout. If the integration already has blocks, the Manager asks first. Then Save.
The Member area template contains Wallet and Profile. In the embedded widget, both currently only show "will be available soon". Remove them after applying the template or choose a different template.
Preview an integration
Preview opens the widget in a new window, the way it looks when embedded. On a computer, you also see the preview on the right in the editor. It shows the saved version.
Deactivate or delete an integration
In the overview, tap the integration:
- Deactivate: the integration is kept, but the embedded widget shows the German system message "Widget nicht gefunden" (widget not found). With Activate now, you switch it back on.
- Delete: permanently removes the integration after a confirmation. The code on your website then also shows "Widget nicht gefunden".
Frequently asked questions
Where do I edit the individual widgets on my website? Under Website Integration: tap the integration's card, Edit, then tap the block.
Why does a block show "will be available soon"? Memberships, Member home, Profile and Wallet aren't implemented in the embedded widget yet. Remove them from the integration.
How do I show only certain offerings in the schedule? In the Schedule block, use the filters by category, person, room or offering.
I changed something, but it doesn't show up on my website. Did you tap Save? Only after saving does the widget show the latest version.
Where do I find templates and dimensions on a computer? The editor currently only shows these items in the narrow view. Make the browser window narrower or open the integration on your phone.