Föreningar kan lägga in sk. widgets från sociala medier. Dessa kan t.ex. vara flöden från Facebook/Twitter eller bildalbum från Instagram. I den här manualen kommer vi gå igenom hur man lägger in widgets från några populära tjänster.

 

Alla dessa widgets läggs i grunden in på samma sätt på er IdrottOnline-sida. Det man gör är att klistra in en kod i HTML-läget i redigerarläget på IdrottOnline.


1. Logga in på föreningens IdrottOnline-sida.


2. Klicka på "Redigeraläge" i välkomstrutan som visas. 


3. På höger sida klickar ni sedan så att ni är inne under redigerarläget "Alla egenskaper" som har följande symbol: 



4. Skrolla ner på sidan under "Innehåll". 

5. Klicka på "HTML".


blob1478605708971.png


6. Klistra in widget-koden.
7. Klicka på "Publicera?" och sedan "Publicera ändringar" för att spara. 



Här nedan kan ni se hur man får fram widget-koder för respektive socialt media: 


Twitter

Logga in på Twitter och gå in under inställningar och välj Widgets i menyn till vänster. Skapa där en ny widget. Gör dina inställningar och spara sedan dina ändringar. Då dyker det upp en ruta med kod under förhandsgranskningen. Markera all kod i rutan (kan göras genom att klicka i rutan och trycka Ctrl+a) och kopiera den (Ctrl+c). Nu har du kopierat koden och kan klistra in den i HTML-läget i IdrottOnline.

blob1478605733173.png


Facebook

Facebook-flöde:

För att lägga in ett Facebook-flöde används widgeten som kallas Page-plugin. Facebooks verktyg för att generera en sådan widget kan hittas på den här sidan:

https://developers.facebook.com/docs/plugins/page-plugin

På den sidan fyller ni i informationen om Facebooksidan vars flöde ni vill visa och klickar sedan på ”Get Code”. Då kommer det fram en ruta som på denna bild:

blob1478605758123.png

Koden som är i den röda rutan ska bara läggas in på er sida en gång. Den behöver alltså inte läggas in två gånger om man både vill ha en Like-knapp och ett Facebook-flöde (eller visa flera flöden). Koden i den blå rutan är den som specificerar var Flödet ska synas. Man kan alltså till exempel ha koden i den röda rutan i anslagstavlan så läses den in på alla sidor, och sedan ha olika flöden på olika sidor.


Like-knapp:

Verktyget som genererar kod för en like-knapp hittas på den här länken:

https://developers.facebook.com/docs/plugins/like-button

Där fyller ni i informationen om Facebook-sidan som like-knappen ska kopplas mot och klicka sedan på ”Get Code”. Då möts ni av den här ruta:

blob1478605796610.png
Koden i rutan som är inramad med rött är exakt samma för alla Facebook-widgetar. Den behöver bara finnas en gång på er sida. Så om ni redan har lagt in t.ex. ett flöde så behöver ni inte lägga in den koden igen. Då är det bara att kopiera in koden som finns i den blå rutan i HTML-läget där ni vill att knappen ska synas. Annars behöver ni lägga in koden i både den röda och den blå rutan.


Youtube

Youtube erbjuder inbäddning av både enskilda videor och spellistor. Koden att klistra in hittas via Dela-knappen som finns både när man är inne på en video eller spellista. När man klickat på den väljer man fliken Bädda in. Så här ser det ut på en spellista:

blob1478605832971.png

Här finns dela-knappen på en video:

blob1478605850636.png