Redaktörsmanual för korpföreningar i IdrottOnline 1
Innehåll: Inledning s.3 Logga in s.3 Design responsive, version 2.0 s.3 Layout s.6 Grundinställningar s.9 Boxinställningar s.10 Toppflikar s.11 Information för utövare s.11 Information för företag s.14 Infoarmtion om föreningen s.14 Bildhantering i ImageVault s.15 Lägg till video från Youtube s.19 Facebook eller Twitter på er sida s.20 Kalender s.26 Sökmotoroptimering s.26 Panel s.27 Språk s.28 Hemsideadress s.28 Operativssyetm och webbläsare s.28 Hjälp och support s.29 2
Storleken på Korpens föreningar skiljer sig. En del föreningar har tusentals medlemmar, en mängd olika aktiviteter och arrangemang medan andra föreningar har färre och inte lika stort utbud. Men oavsett storlek är det förstås viktigt att alla föreningar har hemsidor där det är enkelt för besökaren att hitta det den söker. Ju tydligare sida föreningen har, desto lättare för besökaren att hitta rätt information. I den här manualen får du som sköter er korpförenings hemsida i IdrottOnline tips och stöd i hur man gör för att skapa en så användarvänlig och funktionell sajt som möjligt. Det är alltså ingen manual för hela IdrottOnline, som hur man arbetar med medlemsregister, Lag TA eller liknande. Manualen kräver att du har förkunskaper i hur man arbetar i IdrottOnline. En fullständig manual i hur man arbetar med hemsidor i IdrottOnline hittar du här: http://www1.idrottonline.se/imagevaultfiles/id_440991/cf_87178/f-reningens_hemsid.pdf Börja med att logga in Du loggar in med ditt idrotts-id som börjar med nollor eller ditt personnummer och lösenord, via hänglåset längst upp i sidans högra hörn. Välj därefter Redigeraläge. Instruktionerna i denna manual utgår från att du är inloggad. Design - Responsive Version 2.0 Nytt sedan december 2012 är att man kan välja att ha en version av sin Idrottonlinesida som är anpassad för andra enheter än bara datorer, till exempel även för surfplattor och mobiltelefoner. Sidans utsnitt ändras beroende på vilken enhet man besöker sidan på, vilket gör den lättare att läsa. Detta kallas Responsiv. Under fliken Design kan ni välja om ni vill använda responsiv versionen 2.0 eller behålla den version som ni haft fram tills nu, version 1.0. 3
All information som text och bilder på er hemsida kommer automatiskt att överföras och hamna i den nya designversionen så fort som ni klickar i rutan för version 2.0. (OBS! Har ni en egen CSS så sker inte denna överföring automatiskt utan er stilmall måste byggas om!). Om ni inte har arbetat i IdrottOnline tidigare utan startar en ny sida väljer ni självklart version 2.0 Fördelen med att välja den här versionen är att hela sidan syns även om du öppnar IdrottOnline på en mindre skärm så som mobiltelefon eller surfplatta. Till en början kommer du kunna växla tillbaka till version 1.0 men tanken är att alla sidor ska ha utsnittet version 2.0 inom en snar framtid. I och med att man använder sig av version 2.0 ändras designen på sajten så att man bland annat kan välja de färger man ha på rubriker och bakgrund. (Korpens föreningar använder sig av samma färger, se nedan). Gör inställningarna i den ordningen som de är numrerade. 1. Grund Klicka på pilen till vänster om Grund menyn för att välja kontrast för brödtext. Här väljer du Mellan. Förhandsgranskning syns direkt till höger. 4
2. Anpassa Här väljer du färg på rubrik, länkar och bakgrund samt väljer typsnitt för rubriker och brödtext. Färgkoden till den önskade färgen du vill ha skriver du in direkt i textfältet: Rubrikfärg: #67756e Länkfärg: #0db14c bakgrundsfärg: #0db14c Du ser även här förhandsgranskningen direkt till höger. 3. Typsnitt för rubriker och brödtext Välj önskat typsnitt för rubriker genom att klicka på pilen till höger i det grå fältet. Listan med alternativ syns och du klickar här på det önskade typsnittet (Ve3rdana). Förhandsgranskning syns direkt i rutan till höger. När du gjort önskade inställningar och ändringar för din nya responsive version 2.0 sida så glöm ej att klicka på Spara och publicera högst upp på sidan. 5
Layout - Webbplatsens förstasida Efter designinställningarna så är det dags att skapa sin sida ut efter den layout alltså hur hemsidan ska vara uppbyggd - som vi använder oss av. Layouten på sidan ställer man in under Boxinställningar: På webbplatsens förstasida använder vi oss av två större boxar med tre under: 6
Ställ in boxhöjd Boxhöjden ställer man in för att boxarna på förstasidan ska vara fasta i storlek. Gå till toppfliken redigerarläge och Boxinställningar för att ställa in Boxhöjd. För box 1 och 2: 300. Boxhöjd för box 3, 4 och 5: 200. Glöm ej att kryssa i Använd fasta boxhöjder. När man valt vad som ska vara i respektive box (mer om detta nedan) så får man en förstasida som ser ut så här: 7
Anledningen till att vi valt denna startsida är för att den ger en god överblick. Här kan man lyfta upp ett par viktiga saker men det är samtidigt en lösning som inte känns plottrig. 1). Här loggar du in via hänglåset. Här finns också en funktion för att söka på sajten, hjälp och webbkarta. 2). Topphuvud: Alla föreningar använder sig av samma typ av topphuvud som är korpgrönt med texten Korpen och föreningens namn under. Om er förening inte har ett sådant så hjälper Korpen riks till med det kontakta den föreningsutvecklare på Korpen riks som arbetar i din region. 3). Toppflikar: Använd få toppflikar. Här ska man inte visa upp allt som föreningen har utan koncentrera sig till sina målgrupper. Det gör att besökaren enklare hittar dit den ska där 8
övrig information finns, samt att det inte ser stökigt ut på sidan. 4). Toppbild: En fast bild som inte ändras ofta. Använd gärna bilden i exemplet (som du får av föreningsutvecklaren i din region) eller en bild som på ett träffande sätt beskriver er verksamhet. Klicka på fliken längst upp till vänster, gå till Innehåll och i redigerarläge lägger du till bilden (mer om bilder nedan). 5). Reklam från idrottens sponsorer som man kan välja att ta bort. 6. Nyhetsbox: Ställ in så att tre nyheter visas åt gången (se nedan). 7). Stor box: här lyfter man upp saker som är på gång i föreningen kanske är det en cup som arrangeras, att fotbollssäsongen eller gruppträningen startar eller liknande. 8). Har er förening en Gilla-sida på Facebook (eller Twitter som exemplet) kan ni integrera den på första sidan. Mer om det nedan. 9). Kalender. 10). Liten box för valfritt innehåll. 11). Liten box för valfritt innehåll. 12). Fast box med adress- och kontaktuppgift. Grundinställningar: 9
Sidhuvud: Här laddar du upp din korpförenings logotyp. Saknar er förening en sådan så hör av er till er föreningsutvecklare så ordnar de en sådan. Vill du att man ska se vad som finns under varje kategori när man ställer sig över knappen så kryssa i Toppmeny med rullgardinsmeny och vänstermeny under Grundinställningar så ser det ut så här: Boxinställningar: Under Boxinställningar väljer man vad man vill ha i boxarna på första sidan. Först går man till artikeln man vill ha. Där väljer man (i redigerarläge) Boxinställningar där man lägger till bild och skriver en kort text (mer om detta nedan i kapitlet Bildhantering): 10
Sen väljer man i vilken box artikeln ska ligga i detta fall den stora boxen: så hamnar den på första sidan: 11
Toppflikar Skapa inte för många toppflikar, det blir lätt rörigt. Toppflikarna är inte till för att visa upp all er verksamhet utan för att guida besökaren vidare så att den hittar informationen för just sin målgrupp. Många korpföreningar har aktiviteter riktade mot utövare och mot företag. Då räcker det med följande: Utövare, Företag, Om oss: Toppbild Toppbilden behöver sällan uppdateras. Vill du använda samma bild som på exemplet be din föreningsutvecklare om en sådan. Ställ dig i rutan och ladda upp bilden via ImageVault. Information för utövare 12
Utövarna är varje korpförenings primära målgrupp. Här ska det självklart finnas information om föreningens aktiviteter men även om hur besökarna gör för att komma igång och liknande. I vänsterspalten har vi valt följande: Kom i gång hos oss Lagidrott Gruppträning Individuella idrotter Övrig verksamhet Försäkring Bli ledare/domare hos oss Köp träningskläder och matchställ Vilka flikar föreningen har beror ju självklart på de idrotter och aktiviter ni har. Använd underflikar, som under Lagidrott och Gruppträning nedan, där det finns möjlighet. Kom i gång hos oss: Information om hur man gör för att komma igång med sin aktivitet hos föreningen. Under fliken Lagidrott har vi en rad underflikar med info de lagidrotter föreningen arrangerar och tabeller och resultat: Samma upplägg är det under Gruppträning: 13
Individuella idrotter: info om t.ex. tennis, konståkning och bordtennis. Övrig verksamhet: info om t.ex. tipspromenader, promenader och boule. Försäkring: info om utövarnas försäkring. Bli ledare/domare hos oss: bra flik att ha om föreningen söker ledare och domare. Köp träningskläder och matchställ: info om att utövaren kan köpa kläder genom Korpens webbshop eller om föreningen har ett eget avtal med en sportaffär. Information för företag Om er förening har aktiviteter som riktar sig mot företag så ska dessa enkelt hittas på sidan. Företagen är viktiga för många föreningar och informationen ska vara tydlig och lätt att hitta, som exemplet nedan: 14
Information om föreningen Övergripande information om er förening. Här har vi valt flikarna Kontakt, Organisation Kalender. Bildhantering i ImageVault All hantering av bilder i IdrottOnline sker i verktyget ImageVault. Först laddar man in bilden i Imagevault för att sedan infoga denna vart på hemsidan man vill att den ska vara. Varje gång du ska infoga en bild (inte dokument) ställer du markören i fältet där bilden ska infogas och klickar på ImageVault symbolen. Du kliver nu in i ImageVault och får tillgång till de mappar och filer där du sparat dina bilder och album. Symbolen för ImageVault ser ut så här: Infoga bild i ImageVault Gå till ImageVault som du hittar längst upp i trädstrukturen i vänsterspalten när du är i redigerarläge: 15
Där väljer du Ladda upp fil och sparar din bild där du vill att den ska ligga: När du sparar bilden så klicka i Visa i bild-/dokumentarkivet på hemsidan. För att skapa ett nytt album så ställ dig på Bilder och vänsterklicka: 16
Nu finns den i ImageVault så att du kan lägga till den i en artikel: Redigera bilder: För att ändra mått eller beskära din bild inne i ImageVault: högerklicka på bilden i ImageVault (eller om du har laddat upp en bild inne i en artikel som du vill ändra klicka då på Hämta fil) och gå till Editera bild. Där ändrar du pixlar under Ändra storlek. Vill du beskära din bild om den till exempel är för hög klickar du på Beskära och gör det där. 17
Bildmått Bild i artiklar 550 pixlar bred och 320 pixlar hög Bild i stor box på startsida: 550 pixlar bred och 320 pixlar hög Bild i liten box på startsidan: 253 pixlar bred och 120 pixlar hög Bild i box på första sidan För att välja bilder som ska ligga i boxarna på startsidan går man till Boxinställningar i redigerarläge i den artikel man vill länka till och väljer bild där. Skriv in en boxtext (tänk på att den inte får vara för lång, då syns inte Läs mer-länken på första sidan) som ger en förklaring och väcker en nyfikenhet att läsa mer. Spara och publicera... så lägger den sig på startsidan: Bildspel i box Vill du istället ha ett album som skiftar bilder i boxen väljer du att lägga till ett album istället för en bild. Klicka på rutan med tre punkter, Välj de album med max 15 bilder som du vill ska skifta bilder och klicka på Spara och publicera. OBS! Boxbilden måste vara tom. Detta val ger en rörlig och levande effekt till er sida. 18
Klicka också i rutan Gör boxbilden till klickabar länk Lägg till video från Youtube Klicka på Infoga/redigera inbäddad video Och kopiera in din länk från Youtube: 19
och så ser det ut så här: Filmer om gruppträning, lagidrott och om Korpen hittar du på vår Youtubekanal - https://www.youtube.com/channel/uchjsnfxnh0-k12e3447l-ua/videos Använd dem! Facebook eller Twitter på er sida Använder er förening Facebook eller Twitter kan man använda sig av en så kallad plug-in för att integrera en av dessa på er sida (man kan inte ha båda av de som visas nedan uppe på samma gång). Facebook Gåt till https://developers.facebook.com/docs/plugins och där väljer man att använda en Likebox: https://developers.facebook.com/docs/reference/plugins/like-box Finn ditt Facebook-ID, vilket du skall klistra in i Facebook Page URL. Detta letar du upp genom att surfa dig in på din Facebook sida och titta på adressen enligt nedan. Du kopierar därefter hela adressen till Facebook utvecklingssidan 20
https://developers.facebook.com/docs/reference/plugins/like-box Klistra in din adress längst upp på Facebook Page URL. Width (bredd) 186 (195?) passar bra att ha på sidan på din Idrottonline sajt. Klicka på Show Faces, då får du med bilder på de som har valt att gilla din sida. Du kan också välja, show stream, då kommer man att kunna se vad som postas på din Facebook sida. När du är klar med din design på din ruta så klickar du på Get Code längst ned i fönstret. Välj IFRAME i listan och kopiera koden som finns i rutan. 21
Gå till din sida i IdrottOnline. Stå längst upp i hierarkin på sidan till vänster och klicka på redigera fliken i mitten på sidan och sedan på fliken Grundinställningar. Bläddra ned en bit på sidan tills du kommer till Anslagstavla. 22
Klicka på HTML knappen och då kommer du att få upp ett fönster i HTML och källkodsläge. Klistra här in din kod som du har kopierat från Facebook. Klicka på uppdatera i fönstret, och det kommer då att stängas. Du skall nu se ett Facebookfönster i Anslagstavlan fönstret på din Idrottonline sida. Skrolla dig längst upp på sidan och klicka på spara och publicera för att få den publicerad på din hemsida. Kontrollera så att måtten stämmer med din design. Twitter 23
Klicka dig till http://twitter.com/about/resources/widgets/widget_profile Här fyller du i namnet på Twitterkontot och har möjlighet att ge boxen ett nytt utseende färgmässigt. På storlek skriver du i 186. När du är klar trycker du på Avsluta & Hämta kod. Kopiera koden och logga in på din föreningssida och gå till redigerarläge. Ställ dig längst upp på sidan till vänster och klicka på redigera i mitten och sen på grundinställningar: Bläddra ner till du kommer till Anslagstavla. 24
Klicka på HTML-knappen och då kommer du få upp ett fönster där du klistrar in koden från Twitter. Tryck på Spara och publicera längst upp på sidan nu har du en box för Twitter! 25
Kalender Gå till kalendern och till redigerarläge där du hittar knappen Skapa aktivitet där du fyller i uppgifterna om arrangemanget (inte mer än en rad i rutan Beskrivning). Om du väljer att ha kalendern på första sidan så visar den saker som sker inom den närmsta månaden. Hur många aktiviteter som ska visas på första sidan väljer du under Boxinställningar (förslagsvis tre): Sökmotoroptimering Sökmotoroptimering betyder att man arbetar för att få sin hemsida att synas så högt upp som möjligt bland resultaten vid sökningar i sökmotorer (Google och liknande). Söker en person till exempel på gruppträning Gävle vill ju Korpen Gävle att deras hemsida kommer högt upp på Google. För att sökmotorerna ska visa de resultat man vill finns det ett par enkla knep man kan göra i IdrottOnline. Gå till huvudsidan i redigerarläge, fyll där i Beskrivning av sidan och Sidans titel : I rutan Beskrivning av sidan fyller du i en kort kärnfull text om föreningen där du skriver vilka de viktigaste aktiviteterna och arrangemangen är, exempel: Hos Korpen Göteborg kan du gruppträna, lagidrotta och tävla i individuella idrotter. Populära idrotter är fotboll, innebandy, rinkbandy, Zumba, gympa och bordtennis. Vi arrangerar Korpen Pressbyrån Cup och Sweden Floorball Cup. På korpen.se har vi valt texten Korpen är ett av Sveriges största idrottsförbund och en del av den samlade idrottsrörelsen. Vi erbjuder lagidrott, gruppträning och individuella idrotter vilken presenterar Korpen när man googlar: 26
I rutan Sidans titel så skriv där en mycket kort beskrivning: Korpen Göteborg erbjuder gruppträning och lagidrott (Rutan Standardsökord för sidor kan du däremot lämna tom eftersom att sökmotorerna sedan ett antal år tillbaka inte längre söker efter så kallade keywords, då dessa användes för att manipulera sökmotorernas resultat). När du skriver texter till hemsidan är det viktigt att i rubrik och ingress skriva ut de ord man vill att sökmotorerna ska snappa upp. Undvik därför att skriva Träna med oss i höst utan se till att rubriken innehåller de ord som är viktiga för er: Gruppträna med Korpen Hede i höst. När någon söker på Google efter gruppträning och Hede är det då enklare för Google att hitta den sidan. Att skriva ut den typen av nyckelord är viktigt att göra i rubriker och ingressen, men även när du publicerar bilder. Se till att alltid ge en beskrivning av bilden i Alt-texten: Sökmotorerna tar också hänsyn till länkar som leder till ens sida ju fler som länkar till en sida desto bättre resultat hos Google. Så var gärna frikostig att länka till andra korpföreningar om ni har ett samarbete eller så. Se då till att skriva ut nyckelorden i länktexten. Skriv inte bara Läs mer utan Mer information om Blodomloppet finns på Korpen Umeås hemsida >> 27
Skriv även ut vad det handlar om när du länkar till sidor på er egen hemsida. Undvik alltså Läs mer utan beskriv i texten vad länken handlar om. Panel 1. Infoga/redigera bokmärke 20. Ångra/ gör om framåt / gör om tillbaka 2. Citat 21. Redigera HTML källkoden 3. Lägg till/redigera bild med ImageVault 22. Slå av/på fullskärmsläge 4. Lägg till/redigera länk med Meridium 23. Sök LinkEditor 5. Infoga/redigera inbäddad media 24. Fet text 6. Klistra in som text 25. Kursiv text 7. Klistra in från Word 26. Understruken text 8. Infoga/redigera ny tabell 27. Format 9. Radera tabell 28. Typsnitt 10. Tabellradinställningar 29. Typstorlek 11. Tabellcellinställningar 30. Teckenfärg 12. Infoga kolumn före 31. Bakgrundsfärg 13. Infoga kolumn efter 32. Ta bort formatering 14. Radera kolumn 33. Vänsterställd 15. Infoga ny rad före 34. Centrera 16. Infoga ny rad efter 35. Högerställd 17. Radera rad 36. Skapa punktlista 18. Separera sammansatta celle 37. Nummerlista 19. Sammanfoga celler 38. Infoga horisontell skiljelinje Språk Korpen stavar vi förstås alltid med stort k i sammanhang som Korpens föreningar eller i år 28
har Korpen vuxit med tio nya föreningar men i sammansatta ord skrivs Korpen med liten bokstav, som korpföreningarna eller korpfotboll (och skriv aldrig särstavningar som grupp träning det är ju ett ord: gruppträning). Tal skrivs normalt med bokstäver till och med tolv (undvik dock att blanda siffror och bokstäver som två barn, elva och 13 år, tränade.). Börja helst inte ett nytt stycke eller en ny mening med siffror. Välj då hellre bokstäver: Femton personer kom på träningen. Mer tips och råd finns alltid på TT: http://www.tt.se/ttsprak/ttspraket.pdf Hemsideadress När föreningen startar igång i IdrottOnline får man en adress av typen http://www8.idrottonline.se/korpforeningsolvesborg-korpen/ Att skaffa sig ett nytt domännamn är vare sig dyrt eller krångligt. Det finns en rad olika leverantörer att välja bland, tex företaget (tidigare Cedel). Det är bara att höra av sig till företaget så hjälper de till med att ändra adressen. När man köper ett domännamn får man själv ange vilket namn man vill ha. Korpen riks rekommenderar medlemsföreningarna att använda domännamnet www.korpenföreningsnamn.se - som till exempel www.korpenstockholm.se Operativsystem och webbläsare Administration av IdrottOnline Klubb sker bäst i PC-miljö och med webbläsaren Internet Explorer (IE8 och IE9), Firefox och Chrome. Andra webbläsare garanteras inte att IdrottOnline fungerar helt korrekt. Hjälp och support På www.idrottonline.se finns en flik som heter Stöd för användare. Där har RF samlat all information och hjälp du som användare av IdrottOnline kan behöva. Exempelföreningar, frågor och svar, utbildning, manualer samt övrig information. Får du inte hjälp där kontakta då deras supportavdelning: helpdeskf@rf.se eller en föreningsutvecklare i din region. 29