Manual för webbpublicering. Enköpings kommun

Transkript

1 Manual för webbpublicering Enköpings kommun

2 Innehåll ATT LOGGA IN I SWWWING 3 Inloggningsrutan 3 GRÄNSSNITTET 4 Filhanteraren 4 Content Management 4 Verktyget Notify - Dags att uppdatera 4 SKAPA OCH REDIGERA WEBBSIDOR 6 Content Management 6 Sitehanteraren 7 Sitehanterarens mappträd 9 Sitehanteraren - Skapa ny sida 9 SKAPA NY SIDA OCH INFOGA TEXT 10 Skapa ingresser och underrubriker 11 Innan jag Sparar checklista: 14 Infoga länk 15 Infoga bild 17 Länka till pdf 19 Infoga tabell 22 Ändra befintlig sida 24 Infoga och redigera högermeny (för relaterat innehåll) 25 FILHANTERAREN 29 Ladda upp pdf-filer 29

3 Manual för webbpublicering, uppdaterad Att logga in i Swwwing 1. Öppna Internet Explorer. (Swwwing kräver minimum version 5.5 ). 2. För att komma till Swwwing skriver jag i adressfältet: och trycker sedan på Enter. Inloggningsrutan 1. Här skriver jag in mitt användarnamn och lösenord som jag fått efter genomförd utbildning i Swwwing. 2. Klickar på Logga in 3. Jag slussas nu in i Swwwing

4 Manual för webbpublicering, uppdaterad Gränssnittet Filhanteraren Filhanteraren används uteslutande till att ladda upp filer (exempelvis pdf-filer) till servern samt döpa om eller lägga in kommentarer till filerna. Observera att allt bildmaterial ska laddas upp av Pontus eller Kristina. Bilder som publiceras utan att ha gått igenom kommunikationsavdelningen kommer att tas bort. Content Management Det är under den här ingången Content Management som vi hittar vår webbplats. Det är här vi går in för att publicera sidor på webbplatsen, flytta om sidor, påverka ordning i menyn etc.. Verktyget Notify - Dags att uppdatera Längst nere till vänster på sidan finns en gul ikon (se bilden nedan). Jag klickar på ikonen och får upp ett nytt fönster som visar de publicerade sidor som nu blivit dags att uppdatera. Ska sidan inte uppdateras vidare, utan tas bort, markerar jag i klickrutan till höger och väljer sedan Ta bort längst ner i fönstret för att utföra åtgärden.

5 Manual för webbpublicering, uppdaterad

6 Manual för webbpublicering, uppdaterad Skapa och redigera webbsidor Content Management Jag väljer Content Management i menyn till vänster. Det är här inne all publicering för webben sker. Jag får upp nedanstående gränssnitt: som kan se mycket ut, fastän vi egentligen bara behöver använda några få saker som finns här. På nästa sida delar jag in gränssnittet i olika delar så ser du hur jag menar

7 Manual för webbpublicering, uppdaterad Gränssnittet innehåller två större delar: 1. Den vänstra delen (se bild ovan), mappträdet s k Sitehanteraren. 2. Den högra delen (se bild ovan), högermeny s k Subitem (se särskilt avsnitt Infoga & redigera högermeny). Sitehanteraren

8 Manual för webbpublicering, uppdaterad Sitehanterarens verktygsfält Förhandsgranska Jag markerar den sida/mapp i mappträdet jag vill se och klickar på ikonen Ändra/ Redigera sida Markerar den sida/mapp i mappträdet jag vill ändra och klickar på ikonen Sök efter sida Öppnar ett litet fönster där du skriver in sidan du söker efter, exempelvis bibliotek. Verktyget markerar då sidan du sökt Skapa sidlänk Här skapas interna länkar som placeras i menyn. Fungerar på samma sätt som Flytta sida nedan. Flytta sida Markerar den sida/ mapp i mappträdet jag vill flytta, klickar på ikonen. Markerar sedan vart sidan/ mappen ska flyttas. Jag får då en förfrågan om den ska flyttas. Klickar ok och den flyttas. Egenskaper Det är här jag ändrar en publicerad sida till mapp, ändrar ett felstavat menynamn (sid- eller mappnamn). Jag markerar den sida/ mapp i mappträdet jag vill ändra egenskaper på och klickar på ikonen. Jag får då upp nedanstående fönster där jag kan ändra sida till mapp, menynamn, göra en sida/ mapp gömd (visas inte i menyn på webbplatsen, men sidan finns och går att länka till etc. som vanligt) eller ändra sorteringsordning i menyn. För att spara klickar jag OK. Radera sida/ mapp Markerar sida/ mapp i mappträdet som ska raderas och klickar sedan på ikonen.

9 Manual för webbpublicering, uppdaterad Sitehanterarens mappträd Mappträdet är enkoping.se - vår webbplats. Sidorna i trädet utgör menyn till vänster och upptill på webbplatsen. För att se alla undersidor klicka på plustecknet vid respektive mapp. Det är här i Sitehanterarens mappträd vi väljer vart våra blivande sidor ska ligga och vilken sida/ mapp som ska redigeras/ ändras. Sitehanteraren - Skapa ny sida I fältet längst ner på gränssnittet hittar vi skapa ny sida. Det är här vi väljer vilken mall vi ska publicera sidan med- hur sidan ska se ut. Mallen Standard som ska användas på alla vanliga sidor är alltid förvald.

10 Manual för webbpublicering, uppdaterad Skapa ny sida och infoga text Jag väljer först vart jag vill placera den nya sidan. Detta gör jag i Sitehanterarens mappträd. Vill du ändra/redigera en befintlig sida, se listan över verktyg i avsnittet Content Management. Jag väljer sedan vilket utseende min sida ska få vilken mall jag ska använda Mallen Standard är förinställd och är den som ska användas. Jag klickar sedan på Skapa. Jag får upp nedanstående gränssnitt redigeringsläget, där jag nu kan klistra in text, genom att använda verktyget: Självklart går det även bra att skriva sin text direkt, men fördelen med att skriva sin text i Word först, för att sedan kopiera den och klistra in i Swwwing, är att varje publicerare då kan köra rättstavning på sin text, så inga felstavningar kommer med ut på webbplatsen.

11 Manual för webbpublicering, uppdaterad Tips: Bekanta dig med verktygsfältet genom att rulla över varje ikon med pekaren, för att få upp beskrivning av respektive verktyg. Skapa ingresser och underrubriker För att få en ökad struktur av innehållet, väljer jag att arbeta med ingress och underrubriker. Detta underlättar för besökaren då denne snabbt kan få en översikt av innehållet på sidan, istället för att bara ha en kompakt textmassa. Om jag på min sida först nu vill skapa en ingress av mitt första stycke, gör jag det genom att i rullgardinsmenyn Teckenformat välja förinställningen Ingress. Se bild nedan.

12 Manual för webbpublicering, uppdaterad Vill jag infoga en underrubrik, väljer jag denna istället, i rullgardinsmenyn Teckenformat. Se bild nedan.

13 Manual för webbpublicering, uppdaterad Förhandsgranskar jag sidan, ser den nu ut så här:

14 Manual för webbpublicering, uppdaterad Innan jag Sparar checklista: Fyll i Bäst-före-datum för sidan, genom att klicka på den blå kanten Sidattribut högst upp i redigeringsläget. Välj ditt namn i listan av publicerare (den som skapat sidan är förvald). Fyll i fälten för menynamn, titel och rubrik Nöjd med sidan, har förhandsgranskat och kollat att alla länkar och hjälptexter (alt-texter) fungerar? Till sist publicera sidan genom att klicka på Spara.

15 Manual för webbpublicering, uppdaterad Infoga länk I Swwwing skapar jag enkelt en extern länk eller e-postlänk genom att skriva in webbadressen eller e- postadressen och sedan trycka Enter/ Radbrytning. Nu ska vi infoga en extern länk av en textrad jag skrivit, som tydligt beskriver vart länken leder någonstans, se bilden här nedanför: Jag markerar texten jag vill skapa en länk av och klickar sedan på verktyget Infoga länk och får upp rutan Länk där flera flikar finns, se bild nedan. Under första fliken, Länkinformation, kan jag nu skriva in webbadressen där besökaren ska hamna när hon/han klickar på länken jag skapat.

16 Manual för webbpublicering, uppdaterad Men innan jag är klar, måste jag kolla att en hjälptext (alt-text) är inlagd. Jag väljer fliken Avancerad där jag skriver in en text som förklarar vad det är för länk och vart länken leder (hjälptext/ alt-text). Detta gör jag i fältet Titel. När jag är klar klickar jag OK.

17 Manual för webbpublicering, uppdaterad Infoga bild Nu ska jag infoga en bild på sidan så jag klickar på verktyget Infoga bild och får upp rutan Infoga bild där flera flikar finns. Väljer fliken Bilder och markerar mappen bilder, enligt bild nedan. Strukturen känner jag igen sedan tidigare det är ungefär samma uppbyggnad som i Sitehanteraren. Eftersom jag nu arbetar på en sida som ska publiceras i Näringsliv, letar jag upp bilden jag ska ha ur bildmappen med samma namn ( Näringsliv ). För att se om jag har valt rätt bild, markerar jag bildnamnet. Bilden syns då till höger i fönstret, se bild nedan.

18 Manual för webbpublicering, uppdaterad När jag hittat bilden jag vill ha, ska jag välja placering och precis som med infogandet av länkar, måste jag kolla att en alt-text följer med bilden. Jag väljer fliken Bildinformation och får upp följande fält som ska fyllas i (se även bild nedan): Alternativ text (alt-text): Här skriver jag en text som förklarar vad bilden föreställer, samt fotograf till bilden. Horisontell marginal: Fyller i värdet 5 Vertikal marginal: Fyller i värdet 5 I rullgardinsmenyn Justering : väljer jag Vänster När du är klar klickar du OK. Om du i efterhand behöver ändra i beskrivningstexten av bilden markera bilden och klicka på verktyget Infoga bild så kommer du tillbaka och kan ändra. För att verkställa justeringen klicka återigen OK. (Observera att beskrivningstexten du skrev in första gången kan försvinna här, så du måste ev. lägga in den på nytt).

19 Manual för webbpublicering, uppdaterad Länka till pdf För att kunna skapa en länk till en pdf-fil, eller infoga en pdf-fil på sidan, krävs att jag först laddat upp filen på servern via Filhanteraren (se avsnittet Ladda upp pdf-filer ). Jag har förberett en textrad som tydligt beskriver vad pdf-filen jag länkar till innehåller, se bilden här nedanför. Eftersom jag har laddat upp min pdf-fil i förväg kan jag nu bara markera min textrad och gå direkt in på verktyget Infoga länk (det är ju trots allt bara en länkning vi gör till vår pdf-mapp på servern där vi har våra pdf:er). Observera att om du har en blankett i form av en pdf, ska den ligga i mappen för Blanketter. Jag väljer fliken Länkarkiv och sedan fliken Filer innan jag klickar in mig i mappen pdf (se bilden nedan). Här känner jag igen mig det är återigen liknande struktur i mappträdet som i Sitehanteraren. Min sida ska ju publiceras i Näringsliv och där har jag också tidigare laddat upp min pdf, via Filhanteraren (se avsnittet Ladda upp pdf-filer ). Så jag går in i mappen Näringsliv.

20 Manual för webbpublicering, uppdaterad Men innan jag är klar, måste jag välja både mål och kolla att en alt-text är inlagd. Jag väljer fliken Mål. Eftersom alla pdf-filer på webbplatsen ska öppnas i nya fönster, väljer jag Nytt fönster. Till sist väljer jag fliken Avancerad, där jag skriver in en text som förklarar vad det är för fil-innehåll. Detta gör jag i fältet Titel, se nedan:

21 Manual för webbpublicering, uppdaterad När jag är klar klickar jag OK. Klart!

22 Manual för webbpublicering, uppdaterad Infoga tabell Jag placerar pekaren där jag vill ha min tabell och väljer verktyget Infoga tabell. I fönstret Tabellegenskaper kan jag välja hur jag vill att min tabell ska se ut, se bild nedan för inställningar vad gäller bredd (procent är att föredra framför fasta pixelvärden vilka begränsar dynamiken på sidan om användaren ändrar sina webbläsarinställningar för hur text ska visas), kantstorlek, justering och cellavstånd/cellutfyllnad. När jag är klar klickar jag direkt på OK. För att fylla i cellerna, klickar jag i respektive cell och skriver min text. För att justera tabellen i efterhand, kan jag markera min tabell genom att klicka på kanten av den (se bild nedan för att hur en markerad tabell ser ut) och sedan återigen välja verktyget Infoga tabell. Jag får då återigen upp rutan med Tabellegenskaper och kan göra mina justeringar. Verkställ genom att klicka OK. Tips: Genom att högerklicka i en cell kan du bl. a. radera eller lägga till rader och kolumner. Se bild nedan.

23 Manual för webbpublicering, uppdaterad

24 Manual för webbpublicering, uppdaterad Ändra befintlig sida I Mappträdet i Sitehanteraren markerar jag den sida jag vill ändra/redigera. Sen väljer jag verktyget Ändra/ Redigera sida för att öppna sidan.

25 Manual för webbpublicering, uppdaterad Infoga och redigera högermeny (för relaterat innehåll) Innan jag kan börja skapa min högermeny, måste jag i Sitehanteraren välja vilken sida min nya högermeny ska placeras vid. Det gör jag genom att (i Sitehanteraren) markera aktuell sida/mapp. Bra. Min sida är markerad och för att nu skapa själva högermenyn för relaterat material (relaterade dokument och länkar till innehållet på huvudsidorna ) kommer jag nu att arbeta i den högra delen av gränssnittet, delen för Subitem/Sidelement. Jag öppnar rullgardinsmenyn Skapa sidelement, där jag väljer Spalt och klickar sedan på Skapa (se bild nedan). Nu är det dags att fylla högermenyn med innehåll, men först döper jag den nya menyn i fältet Namn på sidelement, i det här fallet Högermeny.

26 Manual för webbpublicering, uppdaterad Då det i riktlinjerna står att vi ska ha en viss ordning i högermenyn och att den endast ska innehålla relaterat material och då i ordningen Relaterade dokument först och sedan Relaterade länkar, skriver jag in detta samt namnen på de filer eller länkar som ska infogas i menyn. Här är det viktigt att jag gör en hel radbrytning (tryck Enter) mellan varje objekt, för att menyn ska se okej ut vid publicering. (Se bild nedan). När jag har gjort enligt ovan, ska jag nu applicera rätt utseende. Relaterade dokument är rubrik i högermenyn och ska se lite fetare ut, så jag markerar den textraden och i rullgardinsmenyn Teckenformat väljer jag Högerrubrik. Se bild nedan. Nästa steg är att dokumentlänken ska få sitt utseende. Jag markerar min dokumentlänk och klickar på Infoga punktlista. Se bild nedan.

27 Manual för webbpublicering, uppdaterad Jag repeterar sedan samma procedur som ovan för delen Relaterade länkar i min blivande högermeny för att den ska få ett enhetligt utseende och följa riktlinjerna för webbplatsen. När detta är klart, är det dags att skapa länkar av mitt relaterade innehåll, i det här fallet ska Marknadsplan länkas till en pdf-fil och Sveriges Närmaste Stad ska länkas till en intern sida på webbplatsen. Läs om hur du infogar länkar i avsnittet Skapa & redigera webbsidor. Nu ser min högermeny ut så här: Efter att ha ställt in Bäst-före-datum under Egenskaper för sidelement är jag klar. Dags att spara och kika om min högermeny ser bra ut. Tyvärr går det inte att förhandsgranska högermenyn utan att ha publicerat den först. Min högermeny ser ut som tänkt, se bild nedan.

28 Manual för webbpublicering, uppdaterad Är den inte ok, får jag gå tillbaka och ändra min högermeny. Det gör jag genom att markera högermenyn och välja verktyget Ändra sidelement. Se bild nedan. I samma verktygsfält finns även möjligheten att flytta sin högermeny eller radera.

29 Manual för webbpublicering, uppdaterad Filhanteraren Ladda upp pdf-filer Istället för att gå in på Content Management i Swwwings meny till vänster, ska vi nu gå in i Filhanteraren. I mappträdet Webfiler finns flera mappar, men vi ska bara ladda upp pdf-filer nu, så vi koncentrerar oss på den biten (oavsett om det är en PowerPoint-presentation eller en pdf-fil är det samma förfarande, man väljer då powerpointmappen istället för som i det här fallet, pdf-mappen). Se bilden här nedan. Om jag klickar på + -tecknet vid mappen pdf, får jag upp en liknande struktur som jag känner igen sedan tidigare från Sitehanteraren. Här i exemplet ska jag ladda upp en pdf som sedan ska till Näringslivs sidor och börjar med att välja (markera) var i mappstrukturen jag vill placera pdf-filen. Till höger finns valet Uppladdning och eftersom det är endast en fil jag ska tanka upp, väljer jag En fil. Se markeringar på bilden nedan.

30 Manual för webbpublicering, uppdaterad Jag kommer då till platsen där jag ska ladda upp min pdf-fil och döpa den. Jag väljer Bläddra för att plocka upp filen från min dator. (Observera den gula rutan på bilden ovan. Är filen feldöpt eller har mellanrum i filnamnet, kommer inte filen att fungera). När jag hittat filen på min dator- och har valt den - klickar jag på Öppna.

31 Manual för webbpublicering, uppdaterad Jag sätter en rubrik som beskriver innehållet, se bilden nedan. Sen är jag klar och för att verkställa (tanka upp filen) klickar jag Spara.

32