Etikettarkiv: google+

Hur lägger jag till en Google-kalender?

Meh!NjaeOkejGrymtToppen! (4 röster, med ett snitt på: 4,00 av max 5)
Loading...
UPPDATERAD: 2 nov, 2015

Många undrar hur man lägger till / bäddar in en Google kalender då man inte kan använda sig av embed-koden. Här visar jag hur du gör med hjälp av pluginet och widgeten Google Calendar Events.
Bli inte orolig över att det ser mycket ut. Man kan göra massor om man vill, men bara lite räcker. 🙂

1.

1

Börja med att logga in på Google och gå till din kalender. Jag utgår från att du redan har en kalender i Google och om inte, så googla lite på hur du gör en. Den måste också vara publik, så att alla kan se den.
På bilden ovan har jag bläddrat ned lite på sidan och klickar på den lilla pilen bredvid ”Mina kalendrar” och klickar sedan på ”Inställningar”.

2.

2

I detta exemplet vill jag bädda in matsedeln på min blogg. Därför klickar jag på kalendern ”Matsedel” i listan.

3.

epostkalender

Om man bläddrar lite nedåt på sidan ser du detta. Till höger om ”Kalenderadress” finns länken till din kalender, det som står inom parentes efter ”Kalender-ID. Det ser ut som en lååång e-postadress.
Markera och kopiera hela den adressen (alltså bara det som står efter ”Kalender-ID:” och utan parenteser).

4.

Skärmavbild 2014-12-07 kl. 09.40.37

Nu är det dags att gå till din blogg. Logga in och gå till adminpanelen. Nånstans runt mitten hittar du ”GCal Events” och under den, ”Add new”. Klicka på den, så ska vi skapa en ny kalender.

OBS! Om du använder mallen klassblogg finns redan en demo-feed inlagd. Klicka då på ”All GCal Feeds” och klicka sedan på ”Matsedel” för att redigera den feeden, alternativt klickar du på ”Papperskorg” och tar bort demo-feeden och kör denna instruktion från början.

5.

kalender1

Börja med att döpa din kalender till något. Vad, spelar ingen roll egentligen, utan är till för att du ska veta vilken kalender det är. Du kan nämligen lägga till flera kalendrar om du vill.

Sen ska vi ”bygga” vad som ska visas på din sida. Som ni ser, finns det en massa kod i fönstret. I sin enkelhet kan ni göra så att ni tar bort allt, förutom det som jag strukit under med rött, dvs [event-title].
Eftersom jag bara vill visa maten för dagen bryr jag mig inte om klockslag och annat.
När ni gjort det, ska det alltså se ut som på bilden under.

Skärmavbild 2014-12-07 kl. 09.52.53

6.

Skärmavbild 2014-12-07 kl. 09.58.33

Nu är det dags att klistra in adressen till vår kalender, som vi kopierade i steg 3. Detta gör vi vid ”Google Calendar ID”, lite längre ned på sidan.

Nu kan vi hoppa över allt annat och klicka på ”publicera” längst upp till höger på sidan. Detta innebär att vi skapat en koppling mellan vår google-kalender och sajt. Nu är det dags att lägga till widgeten som ska visa upp detta.

Skärmavbild 2014-12-07 kl. 10.00.32

7.

Google har skärpt sina krav för användandet av deras kalender-API. Ett API är förenklat bryggan som gör det möjligt att hämta ut data från deras tjänster, i detta fall google calendar, och visa upp på exempelvis externa sajter som inte tillhör google.

Så vad göra? Jo,  gå till  ”GCal Events” > ”Allmänna inställningar” så ser du en ruta där du måste lägga in din API-nyckel. Precis under där ser du en länk ”Instructions on how to generate and set your own Google API key”. 

Följ den och skapa – därefter klistra in er API-nyckel och spara så funkar allt igen.

Skärmavbild 2015-11-02 kl. 08.23.52

 

8.

feedid

Innan vi lägger till widgeten, så måste vi ta reda på ”Feed ID” som vår kalender har. Gå tillbaka till ”GCal Events” och klicka på ”All GCal feeds” så listas alla kalendrar du lagt till. Notera ditt ”Feed ID” (numret som i mitt fall är 323) som du kommer behöva lite längre fram.
Om du vill visa upp fler kalendrar (om du har fler kalendrar) i samma widget får du notera alla ”Feed-ID”.

9.

gcalwid

Nu har vi gjort våra inställningar i pluginen och går då till ”Utseende” > ”Widgets”. Leta efter widgeten som heter ”Google Calendar Events” och dra den till den position du vill den ska ha. Klicka på den lilla pilen bredvid titeln på widgeten så du kommer åt inställningarna.

10.

Skärmavbild 2014-12-07 kl. 10.25.12

Börja med att döpa widgeten under ”Title”. Jag döper min till ”Matsedel”. Detta kommer att synas på din sajt.

Under ”Feeds to display” ska vi lägga in ”Feed-ID” som vi letade fram i steg 7. Om du har flera kalendrar så separerar du ID med ett kommatecken.

Under ”Display events as:” har jag valt ”Grouped list”. Det gör att alla händelser samlas under ett datum, i stället för att samma datum visas för varje händelse.

”Show paging links” kan ni välja om ni vill bocka eller ej. Om det är på, så visas en liten framåt- och bakåtlänk så att det går att hoppa framåt till kommande händelser.

Under ”Number of events per Page” kan ni välja hur många dagar framåt som widgeten ska visa händelser för. Testa er fram vad som ser bäst ut för er.

Under ”Display Title on tooltip…” har jag valt att plocka bort texten som stod där, då jag bara vill ha datumet utan text framför.

GLÖM NU INTE ATT KLICKA PÅ SPARA, LÄNGST NED I WIDGETEN!

Skärmavbild 2014-12-07 kl. 10.56.04

Voila! Klart. Har ni problem, tveka inte att höra av er.

Hur gör jag om jag vill ha ”dela-knappar”?

Meh!NjaeOkejGrymtToppen! (2 röster, med ett snitt på: 5,00 av max 5)
Loading...
Om du vill lägga till sociala media-länkar, som t ex Facebook- och Twitterknappar visar vi dig hur du gör här. Dock måste du ha aktiverat Jetpack-tillägget. Om du inte gjort det, kolla in den filmen först.

OBSERVERA! Du måste först gå in på Jetpack-inställningarna, genom att klicka på Jetpack-fliken i adminpanelen och ”aktivera” delning först. Sedan kan du se denna film. 🙂