ManualReferenceOffers
Embeds
Under Embed, fepli generates the code with which another website shows the offers of a season or a single offer.
Embeds
An embed is a piece of code for another website. It loads the details from fepli on every visit and therefore always shows the current state.
| Embed | Location | Shows |
|---|---|---|
| Offer list | Tab Embed of the season | The offers of one or more seasons as a list or cards. An offer opens in a dialog on the other website. |
| Registration card | Tab Embed of the offer | Picture, name, date, fee and the button Apply |
| The offer in full | Tab Embed of the offer | Picture, dates, age, fee, places, meeting point and description |
| Link to the registration | Tab Embed of the offer | Not an embed: the address of the offer page with the registration form |
An embed shows the same offers as the offer pages: published, public and in a season that is online (Links and visibility). Families do not register in the embed. Apply leads to the offer page of fepli.
| Prerequisite | Setting |
|---|---|
| Embeds are turned on. | The app Embed in a website is switched on (App-Store). As long as it is off, the tab Embed is missing on seasons and offers, and embeds on other websites show nothing. |
| There is a public key. | Public keys (Settings) |
| Families reach the offer pages. | In installations with tenants, a domain has the purpose Public site (Settings). Apply leads there, even if the tenant does not maintain a website of its own. |
Embedding at the season
Location: tab Embed of the season. The tab is visible to admins as long as embeds are turned on.
beispiel.fepli.eu/admin/saisons/summer-holidays-2027/einbinden
F
☀️
Seasons/Summer holidays 2027/EmbedNew⌘ ↵
☀️Summer holidays 2027
Offers
42
OverviewEdit EExportStatisticsEmbed
Show on other websites
SeasonsSummer holidays 2027Add a season
LayoutListCards
Filter barFamilies filter by category and age themselves.
Look
Accent colourfepli red
CornersSquareSoftRound
FontAs the pageSystem
Public keyManage →Elmsbrück websiteWorks on elmsbrueck.de
1 · Once per page, in the <head>
<script type="module" src="https://beispiel.fepli.eu/embed.js" data-key="pk_9f3a2c71e4b05d18a6c2e7f0"></script>
2 · Where the list should appear
<fepli-offers edition="summer-holidays-2027"></fepli-offers>
PreviewWideNarrow
AllAny age
Wed 14 Jul · 09:00Canoe tripSportverein Elmsbrück · 9–14 years12 places left12 €
The tab Embed of the season Summer holidays 2027.
| Element | Content | Default |
|---|---|---|
| Seasons | The season of the tab. Add a season adds further seasons to the same list; archived seasons cannot be chosen. A season whose offers are not published carries “not published”. | only this season |
| Layout | List or Cards | List |
| Filter bar | “Families filter by category and age themselves.” | on |
| Look | Accent colour as colour field or hex value, with Back to fepli red; Corners: Square, Soft, Round; Font: As the page or System. “Stands in the code as a CSS variable. Everything else the embed takes from the page.” | fepli red, Round, As the page |
| Public key | The key that is in the code. Below it “Works on {sites}”. Manage leads to the settings and is visible to super admins. | the oldest key |
| “1 · Once per page, in the <head>” | The code that loads the embeds, with the key. Copy the code copies it. | – |
| “2 · Where the list should appear” | The code of the offer list with the chosen settings. Copy the code copies it. | – |
| Preview | The offer list with the offers of the season and the chosen settings; Wide or Narrow | Wide |
The page does not save anything. Every setting is in the code, and anyone who reloads the page sees the default values again.
| State | Display |
|---|---|
| The offers of the season are not published | “The offers of this season are not published at the moment – the embed shows nothing.” |
| No public key | “No public key yet.” with “An embed needs a public key. It decides on which websites the embed may run.” |
To the API settings below the note is visible to super admins.
Embedding at the offer
Location: tab Embed of the offer. As long as embeds are turned on, the tab is visible to every account that may open the offer.
beispiel.fepli.eu/admin/angebote/…/einbinden
F
☀️
Offers/Summer holidays 2027/Canoe trip/EmbedNew⌘ ↵
Canoe tripView offer page ↗Copy link
Status
Publishedchange
Date
Wed, 14.07.2027, 09:00
places
12 / 12
Registration deadline
30.06.2027
DetailsEdit EParticipant listAllocateProofAccessEmbed
Link to the registration
https://beispiel.fepli.eu/o/summer-holidays-2027/…Copy linkOpen ↗
Registration card<fepli-offer-card>
DatesNextAll
Places left
<fepli-offer-card offer="0192a4f1-6e3b-7c85-b1d2-8f4e6a9c3b03"></fepli-offer-card>
The offer in full<fepli-offer>
Register button
<fepli-offer offer="0192a4f1-6e3b-7c85-b1d2-8f4e6a9c3b03"></fepli-offer>
Look
Accent colourfepli red
CornersSquareSoftRound
Public keyManage →Elmsbrück websiteWorks on elmsbrueck.deWith it, once per page, the script with the key in the <head>:
<script type="module" src="https://beispiel.fepli.eu/embed.js" data-key="pk_9f3a2c71e4b05d18a6c2e7f0"></script>
PreviewRegistration cardThe offer in full
Summer holidays 2027 · 9–14 yearsCanoe tripWed 14 Jul · 09:0012 €12 places leftApply →
The tab Embed of the canoe trip.
| Element | Content | Default |
|---|---|---|
| Link to the registration | Address of the offer page at the position of the registration form, with Copy the link and Open. “Works anywhere: website, email, social media, notice board. Needs no key.” Only with the visibility Public on the website. | – |
| Registration card | Dates: Next or All; Places left; the code with Copy the code | Next, on |
| The offer in full | Register button; the code with Copy the code | on |
| Look | Accent colour and Corners. They apply to the registration card and the offer in full. | fepli red, Round |
| Public key | The key that is in the code. Below it “With it, once per page, the script with the key in the <head>:” with the code that loads the embeds. A page needs it once, also for several embeds. | the oldest key |
| Preview | The Registration card or The offer in full with the chosen settings | Registration card |
| State | Display |
|---|---|
| The offer is not published, not public or its season is not online | “Not publicly visible yet. You can hand on link and code already – they show something once the offer is published.” Instead of the previews it says “Preview once the offer is published.” |
| No public key | The same note as at the season |
The button Apply of an embed appears only for offers with registration via the website that are not cancelled.
What a website shows without a valid key
| Case | Embed on the website |
|---|---|
| The app Embed in a website is off | Nothing: The website does not load the embeds. |
| The code contains no key | “The offers could not be loaded.” |
| The key is revoked | “The offers could not be loaded.” |
| The website is not under Allowed websites of the key | “The offers could not be loaded.” |
| The season is not online | “No offers found.” |
The fepli developers describe the embeds.