iFrame (HTML)

Intro

Denna artikeln beskriver hur Wondr publiceras på en hemsida som inte är byggd via Wordpress. Är din hemsida byggd i Wordpress? Läs då artikeln Wordpress.

För att Wondr ska integreras på hemsidan behöver nedan HTML-kod klistras in i en iFrame. Nedan följer beskrivning för hur detta görs.

Tips! I Wondr kan du gå till Inställningar - Hemsida - Inbäddning. Läs mer om detta smidiga hjälpmedel i kapitlet "Inbäddningsfunktion", om du vill ha koderna direkt från denna artikel fortsätt till kapitlet "Kod".

Inbäddningsfunktion

I Wondr kan du gå till Inställningar - Hemsida - Inbäddning. Här kan du hämta koder för all inbäddning på externa hemsidor samt förhandsgranska hur det kommer se ut när du väl har publicerat innehållet på din hemsida.

Du väljer vilket typ av innehåll du vill bädda in i fältet "View".

Registrering - Medlemskap
Schemat - Aktivitetsbokning
Schema idag - Endast dagens aktiviteter
Bokningsflöde - Särskilda flöden för t-ex PT och massage
Registrera - Mina medlemskap - Endast för befintliga medlemmar, länk till inloggning och de kommer till sin sida

För varje val av "View" så får du olika extra val. Dessa använder du för att styra hur innehållet ska visas på din hemsida. T.ex om du väljer "Registrering" kan du välja att bara visa en viss kategori av medlemskap eller medlemskap kopplade till en särskild anläggning.

Väljer du istället "Schemat" kan du t.ex styra vilken bokningstyp som ska visas, endast "Prova på" eller dölja vyväxlare.

Så anpassa innehållet först, du ser hela tiden en förhandsgranskning längre ner på sidan som visar hur det kommer se ut och hur dina val påverkar.

När du är nöjd med innehållet så har du alla koder på högersidan.

Direktlänk: Detta är en fullständig länk, används om du inte vill bädda in innehållet på sidan utan länka via t.ex en vanlig knapp eller sociala medier. Då tar du bara länken här och klistrar in på valfri plats.

IFrame: För inbäddning av innehåll på alla externa hemsidor förutom de byggda i Wordpress. Kopiera länken och klistra in i ett kodblock på din hemsida. Toggle för jQuery finns precis under där du enkelt aktiverar och stänger av den funktionen. Mer info om vad jQuery innebär finns längre ner i denna artikel i kapitlet "Vad är jQuery?".

En närbild av sektionen ”Codes for implementation” för att generera inbäddningskoder till en webbplats. Sektionen innehåller textfält med kopieringsikoner för en direktlänk, en Wordpress-kod [wondr url="/schema/"] och en IFrame-kod. Det finns även två turkosa reglage: ett för att inkludera domän i URL och ett för att inkludera en jQuery-tagg.

Kod

Kopiera och klistra in koden nedan i en iFrame på din hemsida för att göra "Medlemskapssidan" publik. Kom ihåg att ersätta "anläggningsdomän" till din egna anläggningsdomän på varje rad.

Om "rutan" inte justerar höjden automatiskt (oftast får du en skroll i rutan) då saknar din hemsida/sitebuilder högst troligt jQuery.

Byt då ut koden mot "Om jQuery saknas" så ska problemet vara åtgärdat.

jQuery finns:

Om jQuery saknas:

Vad är jQuery? (onödigt men roligt vetande)

jQuery används på de flesta moderna webbsidor och hanterar allt från sökningar på sidan, grafiska gränssnitt och bildväxlare. Det finns även ett stort antal färdiga plugin till jQuery som utökar funktioner ytterligare. Vissa är avancerade och utvecklas regelbundet tex jQuery UI, medan andra inte förändras så mycket övertid.

Övrig info

För att göra schemat publikt på hemsidan byter du ut "register/" i https://anläggningsdomän.wondr.se/register/ till "schema".

För att lägga ut Formulär byter du ut "register/" (notera att Snedstrecket ska bort) och lägg in länken från formuläret som du får fram genom att granska formuläret (klicka på ögat) i Wondr.

Exempel: "https://anläggningsdomän.wondr.se/w_application/applicants/form_view/5f46741c-452c-492f-8751-0e1b0a0002b2"

Relaterad artikel

Wordpress

Senast uppdaterat: 4/5-2025