Så lägger du till en videowidget i Framer

Hur installerar du CompleteGreet på Framer?

Installera CompleteGreet genom att kopiera widgetens skript till projektets anpassade kod i Framer. Publicera sedan webbplatsen. Skriptet laddar den flytande widgeten på dina sidor.

1. Öppna widgetens inställningar i CompleteGreet och kopiera installationsskriptet. Använd skriptet för den widget du har ställt in, inte en inbäddningskod för en video som ska ligga inne på en sida.

2. Öppna projektet i Framer och välj Project Settings, sedan Custom Code i vänstermenyn. Klicka på Add Script, eller på +-ikonen om du redan har lagt till kod. Ge posten ett namn som du känner igen senare.

3. Välj början av head som placering och välj All pages. Klistra in hela skriptet i kodfältet utan att ändra det.

4. Spara posten, gå tillbaka till sidredigeraren och klicka på Publish. Ändringar i Project Settings syns på webbplatsen först när en ny publicering är klar. Kontrollera den publicerade adressen.

Du hittar Custom Code i Project Settings, utanför redigeraren där du bygger sidans layout.

Använd den offentliga adressen för den första kontrollen. Förhandsvisningen i redigeraren skiljer sig från den publicerade webbplatsen. Ett privat webbläsarfönster hjälper dig att utesluta en gammal kopia av sidan eller en befintlig inloggning.

Om du till exempel har publicerat en portfoliosida, öppna startsidan och vänta några sekunder på den flytande widgeten. Klistra sedan in adressen till en annan sida i webbläsaren för att kontrollera att All pages även gäller där.

Kontrollera samma adress i en smal mobilvy, ungefär 390 pixlar bred, och på dator. Om widgeten syns på datorn men inte på mobilen, kontrollera först om en fast navigeringsmeny eller ett cookiemeddelande täcker den innan du ändrar installationsskriptet.

Om widgeten inte syns någonstans, gå tillbaka till Custom Code. Kontrollera att posten är sparad, aktiverad och fortfarande placerad i början av head. Rätta till inställningarna, publicera igen och ladda om den publicerade sidan.

Vad kan du anpassa på Framer?

På en Framer-webbplats styr du vilka sidor widgeten visas på, dess knappar, formulär och utseende i widgettjänsten, inte i Framers sidredigerare. Framer styr layouten runt widgeten.

Ställ in widgeten så att den visas på vissa adresser. Kontrollera sedan den publicerade sidan på exakt den adress du har valt. Ett snedstreck i slutet av adressen kan ställa till det vid ett snabbt test, så använd den publicerade adressen och förlita dig inte enbart på redigerarens förhandsvisning.

Välj den åtgärd som passar sidan: en länk, bokning, chatt, samtal, länk till en produktsida eller ett formulär. Ge huvudknappen en tydlig text så att besökaren vet vad som händer innan de trycker.

Ett formulär låter besökare skicka sina uppgifter utan att lämna sidan. Testa de obligatoriska fälten och vart uppgifterna skickas på den publicerade webbplatsen, inte bara i inställningarna.

Det finns en praktisk gräns för hur du kan anpassa utseendet: Framers sidstilar styr inte automatiskt en inbäddad widget. CompleteGreets BUILD-plan innehåller möjligheten att ta bort märkningen Built With. Kontrollera widgetens slutliga utseende i förhandsvisningen innan du publicerar.

Vad bör du kontrollera innan du lanserar?

Testa den publicerade sidan på både dator och mobil. Kontrollera att videobubblan inte ligger över navigeringen, cookiemeddelanden eller fasta knappar. En förhandsvisning räcker inte.

Öppna bubblan på datorn och prova alla reglage. Stäng den och kontrollera att sidan fortfarande går att skrolla som vanligt. På mobilen, tryck på stängknappen och varje knapp i videon. Små klickytor som fungerar med en mus kan vara svåra att träffa med tummen.

Kontrollera också layouten vid den smalaste mobilbrytpunkten, alltså den bredd där mobilens layout ändras. I Framer kan elementen hamna närmare varandra där.

Testa separat vilka sidor bubblan visas på. Öppna exakt den adress där den ska synas. Kontrollera sedan startsidan och en närliggande sida där den ska vara dold.

CompleteGreet kan visa bubblor på specifika adresser. Testa både sidor där varje regel ska visa bubblan och sidor där den ska dölja den. Att en bubbla är dold bevisar inte i sig att inställningen är rätt. Kontrollera att regeln matchar den publicerade sidans sökväg, särskilt för en sida längre ner i strukturen, till exempel en produktsida under en kategori. Ha en kort lista med testadresser när du justerar regeln, så att varje ändring kontrolleras mot samma sidor.

Vanliga frågor

Vilket Framer-element kan ta emot ett skript för en videowidget?

För en flytande CompleteGreet-widget klistrar du in installationsskriptet i Project Settings, sedan Custom Code, enligt stegen ovan. Framers Embed-komponent är till för innehåll som placeras inne på sidan, bland annat iframe-inbäddningar och skript som skapar dem. Kontrollera den publicerade webbplatsen efter att du har lagt till skriptet för att se att widgeten laddas där den ska.

Vad bör jag kontrollera när en Embed-komponent i Framer förblir tom?

För en iframe-inbäddning kontrollerar du att adressen eller skriptet har lagts in i Embed-komponenten och att källan tillåter inbäddning. Vissa webbplatser blockerar detta med HTTP-headers. För den flytande CompleteGreet-widgeten kontrollerar du skriptet i Project Settings, sedan Custom Code, och att reglerna för sidvisning omfattar den publicerade sidans adress. Testa den publicerade sidan innan du drar slutsatsen att installationen misslyckades.

Fungerar Framers Video-komponent som en flytande videobubbla?

Nej. Framers Video-komponent visar video inne i sidans layout, medan en flytande CompleteGreet-hälsning använder ett inbäddat widgetskript. Använd Framers Video-komponent för uppladdat eller externt lagrat videomaterial, med alternativ som automatisk uppspelning och en förhandsbild. Använd Project Settings, sedan Custom Code, för den flytande CompleteGreet-hälsningen.

Kan CMS-fält i Framer styra vilken video som visas på varje detaljsida?

Ja. Lägg till ett textfält av typen Video URL för en extern video, eller ett File-fält för en uppladdad fil i ett format som MP4. Koppla sedan fältet till Framers Video-komponent med en variabel. Videon kan ändras för varje CMS-post. En CompleteGreet-hälsning är en separat inbäddad widget, inte ett CMS-fält för video inne på sidan.