Kategoriarkiv: Bädda in

Hur gör jag för att lägga till en Twitter-widget?

Meh!NjaeOkejGrymtToppen! (1 röster, med ett snitt på: 5,00 av max 5)
Loading...
Många frågor har kommit in kring hur man lägger upp en Twitter-widget som visar sin tidslinje eller annat. Du behöver först ha aktiverat och anslutit dig till Jetpack.

1. Först ska vi skapa en widget på twitter.com. Gå till (eller klicka på länken) till https://twitter.com/settings/widgets

t1

Klicka på ”Skapa ny” efter att du har loggat in.

2. Nu ska vi välja vad vi vill visa i vår widget. Det som kommer upp per default är din tidslinje. Till höger ser du en förhandsgranskning över hur det kommer att se ut. Du behöver inte bry dig om höjd och annat, utan det viktigaste är att vi väljer vilket innehåll vi vill ha.
Du skulle t ex kunna välja en hashtag eller annat också. Då får du välja ”Sök” i verktygsfältet och skriva in den taggen.

t2

När du är nöjd klickar du på ”Skapa widget”.

3. När din widget har skapats får du titta uppe i adressfältet på din webbläsare. Efter https://twitter.com/settings/widgets/ kommer en serie av siffror. Dessa ska du kopiera (för att i nästa steg klistra in i din Twitter-widget på din blogg). På bilden här under har jag ”suddat ut” dessa siffror.

t3

4. Logga in på din blogg och gå till ”Widgets” under ”Utseende”. Aktivera widgeten ”Twitter Timeline (Jetpack)” genom att dra upp den dit du vill ha den. Klistra sedan in numret du kopierade i föregående steg under ”Widget ID”

t4

Här kan du även välja till lite i utseende som att ta bort ramar mm. Den är bara att testa. Glöm inte att spara inställningarna längst ned i widgeten.

5. Klart

t5

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.

Bädda in Google Drive-dokument

Meh!NjaeOkejGrymtToppen! (Ingen röst ännu. Vill du bli först?)
Loading...
När du vill bädda in ett Google Drive-dokument i ditt inlägg är det viktigt att först välja att publicera dokumentet på webben.

Skärmavbild 2013-05-27 kl. 21.05.12

När du gjort det får du en dokumentlänk. Kopiera den, inte inbäddningskoden. Klistra nu bara in den länken i ditt inlägg på bloggen där du vill att dokumentet ska dyka upp.

Skärmavbild 2013-05-27 kl. 21.05.37

Det funkar likadant oavsett vilken typ av Google Drive-dokument du vill bädda in.

Varför kan jag inte bädda in vissa saker?

Meh!NjaeOkejGrymtToppen! (3 röster, med ett snitt på: 4,33 av max 5)
Loading...
Moobis.se är en WordPress Multisite. Egentligen är det precis som en vanlig WordPress-sajt, med skillnaden att alla bloggar och sajter i en multisite delar på alla systemfiler. Varje blogg är givetvis skyddad och ni har givetvis bara tillgång till ert eget matrial, men på grund av detta är säkerheten högre satt.

Många undrar varför det inte går att lägga in inbäddningskod från vissa sajter, medans det går från andra. Det beror på att WordPress tar bort kod (så kallat strippar kod) från era inlägg för att det inte ska gå att lägga in skadlig kod som kan kompromissa hela systemet.
Därför funkar det helt smärtfritt om ni t ex driver en helt egen WordPressblogg på ett eget webbhotell, men där står ni även för säkerheten.

Så vad fungerar då?
Jo, WordPress jobbar med ett format som kallas oEmbed. Det innebär att man bara behöver klistra in en länk till t ex en Youtubefilm, så bäddas den in i inlägget. I dagsläget så finns det stöd för dessa tjänster:

  • Animoto
  • blip.tv
  • CollegeHumor
  • DailyMotion
  • EmbedArticles
  • Flickr
  • FunnyOrDie.com
  • Hulu
  • Imgur
  • Google docs – maps (eget tillägg)
  • Instagram
  • iSnare
  • Issuu
  • Kickstarter
  • Meetup.com
  • Mixcloud
  • Padlet (eget tillägg)
  • Photobucket
  • PollDaddy
  • Rdio
  • Revision3
  • Scribd
  • SlideShare
  • SmugMug
  • SoundCloud
  • Spotify
  • TED
  • Tumblr
  • Twitter
  • Vimeo
  • Vine
  • WordPress.tv
  • YouTube

Håll koll på denna sida, då den kommer att uppdateras. Fler sajter läggs till och i vissa fall kan vi själva lägga till stöd för vissa sajter.

Här kan ni läsa mer om oEmbed på wordpress.org – http://codex.wordpress.org/Embeds

Hur bäddar jag in en Youtube-film i mitt inlägg?

Meh!NjaeOkejGrymtToppen! (4 röster, med ett snitt på: 5,00 av max 5)
Loading...
Här visar vi dig hur du bäddar in en Youtube-film i ett inlägg. Kolla texten under filmen för lite extra tips om det inte funkar.

En del hör av sig då länken till filmen bara blir… en länk och inte en inbäddad film. Det har vissa fall att göra med att vissa webbläsare samt WordPress försöker tänka lite smart åt dig och automatiskt gör en klickbar länk av din länk. Men det vill ju inte vi i detta fall.

Så… växla till ”Text”-läget i stället för ”Visuell” och klistra in Youtube-länken där i stället. Textläget innebär att man ser själva koden för ditt inlägg. Kom ihåg också att länken till filmen måste stå på en egen rad, så ska du skriva text, se till att du hoppar ned en rad.

Skärmavbild 2013-11-05 kl. 22.23.40