Jag minns fortfarande när jag försökte sälja en unik möbel online, men vanliga foton kunde helt enkelt inte göra den rättvisa. Potentiella köpare ville se varje enskild vinkel innan de fattade ett beslut.
Du kanske oroar dig för att lägga till 360-gradersbilder kräver dyr programvara eller kommer att sakta ner din webbplats. Lyckligtvis är det inte så, och du behöver inte skicka besökare till en tredjepartswebbplats.
Efter att ha testat olika verktyg hittade vi rätt plugins för att hjälpa dig att lägga till dessa uppslukande visuella element. I den här guiden visar vi dig hur du enkelt lägger till interaktiva 360-gradersbilder i WordPress.
Lägg till 360-gradersbilder utan specialprogramvara
Om du driver en webbutik, då vet du redan utmaningen med att sälja produkter som kunderna inte kan se i verkligheten. 360-gradersbilder är ett sätt att överbrygga detta gap genom att låta shoppare utforska en produkt från alla vinklar.
Detta är mycket mer engagerande än att be kunder att scrolla igenom ett bildgalleri som visar föremålet från olika vinklar.
Om du har en fastighetswebbplats, kan du använda 360-bilder för att skapa virtuella rundturer så att potentiella köpare kan utforska fastigheten, eller helt enkelt använda dessa bilder för att skapa nya och engagerande upplevelser. Till exempel, om du har en reseblogg, kan läsare använda interaktiva bilder för att utforska olika platser.
Trots alla positiva aspekter finns det vissa utmaningar. När dessa stora filer används felaktigt kan de sakta ner din webbplats, vilket skadar besökarupplevelsen och din SEO. Besökare kan också ha svårt att navigera i bilden om navigeringen inte är tydlig, eller så kan 360-gradersbilderna vara helt inkompatibla med deras enhet eller webbläsare.
Därför har vi provat alla alternativ och hittat två plugins som låter dig lägga till användarvänliga, responsiva och optimerade 360-gradersbilder till din webbplats. Ett plugin låter dig till och med skapa dessa interaktiva bilder direkt i WordPress-instrumentpanelen!
Precis som med alla andra bilder är det fortfarande viktigt att du optimerar din 360-bild för webben.
Med det sagt, låt oss se hur du kan lägga till en interaktiv 360-gradersbild till din WordPress-blogg eller webbplats.
Metod 1: Hur man lägger till en interaktiv 360-graders bild i WordPress
Det enklaste sättet att lägga till 360-graders roterande bilder till WordPress är att använda Panorama Viewer. Detta kostnadsfria WordPress-plugin lägger till ett anpassat block som låter dig bädda in sfäriska bilder enkelt.
Det enklaste sättet att lägga till 360-graders roterande bilder till WordPress är att använda Algori 360 Image. Detta kostnadsfria WordPress-plugin lägger helt enkelt till ett nytt block, vilket gör pluginet mycket enkelt att använda.
Pluginet hjälper dock inte till att skapa en 360-gradersbild, bara att visa den. Du måste ta fotot först med en 360-graders kameraapp eller en dedikerad kamera.
För att detta ska fungera behöver du en fullständig 360-gradersbild (ibland kallad en ekvidistant bild). Notera att ett vanligt 'Panorama'-läge på din telefon vanligtvis bara fångar en platt remsa. För att få en fullständig 360-vy bör du använda en dedikerad 360-fotoapp eller hårdvara som en Insta360-kamera.
När det är gjort behöver du installera och aktivera Algori 360-pluginet. För mer information, se vår steg-för-steg-guide om hur man installerar ett WordPress-plugin.
Vid aktivering finns det inga inställningar för dig att konfigurera, så du kan börja använda pluginet direkt.
När du har en 360-gradersbild, gå helt enkelt till inlägget eller sidan där du vill visa den interaktiva bilden.
Klicka här på '+' -knappen och börja skriva '360 Image'. När rätt block visas, klicka på det för att lägga till det på sidan.
Klicka på knappen 'Mediebibliotek' inuti blocket.
Välj sedan antingen en 360-gradersbild från biblioteket eller ladda upp en ny fil från din dator.
Beroende på storleken på 360-gradersbilden kan du behöva vänta på att WordPress bearbetar den. Efter några ögonblick ser du 360-gradersbilden i inläggsredigeraren.
Du kan sedan helt enkelt klicka på knappen 'Uppdatera' eller 'Publicera' för att göra bilden live.
Nu, om du besöker din WordPress-webbplats, kan du dra för att rotera 360-gradersbilden.
Om du har ett VR-headset kan du klicka på knappen 'VR' för att utforska 360-bilden i virtuell verklighet.
Var bara medveten om att interaktiva bilder kan sakta ner din webbplats. Med det sagt, kanske du vill se vår ultimata guide om hur man ökar WordPress hastighet och prestanda.
Det är också en bra idé att testa hur 360-gradersbilden ser ut och fungerar på mobila enheter. För steg-för-steg-instruktioner, se vår guide om hur man visar mobilversionen av WordPress-sajter från skrivbordet.
Metod 2: Hur man lägger till en 360-graders produktbild i din WooCommerce-butik
Som nämnts tidigare, låter interaktiva bilder shoppare se en produkt från alla vinklar, så de är särskilt användbara för online-marknadsplatser och butiker.
Om du har en WooCommerce-butik, låter SR Product 360° View dig skapa en 360-graders roterande produktbild för varje artikel i din butik.
Ta helt enkelt en serie foton av produkten från varje vinkel och ladda sedan upp bilderna i den ordning du vill visa dem.
För bästa resultat rekommenderar vi att du placerar din produkt på en skivspelare och använder ett stativ. Om du håller kameran i handen kommer dina foton inte att linjera perfekt, och produkten kommer att verka hoppa eller skaka när den roterar.
Pluginet kommer sedan att kombinera dessa bilder till en 360-graders roterande animation.
Notera: Eftersom du laddar upp en serie bilder är det viktigt att optimera och komprimera dina bilder innan du laddar upp dem för att förhindra långa laddningstider.
Med det sagt behöver du ingen specialistprogramvara för att skapa dessa interaktiva bilder, eftersom du kan hantera allt i WordPress-instrumentpanelen som du redan är bekant med.
Först måste du installera och aktivera SR Product 360 view-pluginet. Om du behöver hjälp, se vår guide om hur man installerar ett WordPress-plugin.
Gå sedan till Produkter » Alla produkter och öppna produkten där du vill lägga till en 360-gradersbild.
I produktredigeraren, scrolla ner till den nya sektionen Product 360 Degree View. Klicka här på knappen ‘Add 360 images’.
Du kan nu välja alla bilder du vill inkludera i 360-gradersanimationen.
Se till att du väljer bilderna i den ordning de ska visas i animationen.
SR Product 360° View kommer nu att visa alla dessa filer i avsnittet Product 360 Degree View. Du kan ändra ordning på bilderna med dra-och-släpp.
När du är nöjd med dessa bilder, klicka antingen på knappen ‘Update’ eller ‘Publish’ för att göra 360-graders animationen live.
Bonus: Vill du ta din WooCommerce-butik till nästa nivå? Prova att använda FunnelKit funnel builder och automationsplattform för att lägga till dynamiska upsells, korsförsäljning, order bumps och fullständiga säljtrattar i WooCommerce.
Vanliga frågor om 360-gradersbilder i WordPress
Många av våra läsare har frågor om hur man lägger till interaktiva 360-gradersbilder på sina webbplatser. Här är svaren på några av de vanligaste frågorna vi ser.
1. Behöver jag en speciell kamera för att skapa 360-graders bilder?
Inte nödvändigtvis. Medan en dedikerad 360-kamera (som Insta360 eller GoPro) ger bäst resultat, kan du använda specialiserade appar på din smartphone för att sätta ihop en hel sfär.
Standardlägen för 'panorama' skapar dock vanligtvis bara en bred, platt bild, inte en helt uppslukande 360-sfär.
För produktrotationer behöver du bara en serie foton från olika vinklar, som ett plugin sedan kan sammanfoga till en interaktiv bild.
2. Kommer 360-gradersbilder att sakta ner min WordPress-webbplats?
Dessa bilder kan vara stora, så de har potential att påverka din webbplats hastighet. Men om du optimerar dina bilder för webben innan du laddar upp dem, kan du avsevärt minska deras filstorlek. Att använda ett kvalitetsplugin och pålitlig WordPress-hosting hjälper också till att säkerställa att din webbplats förblir snabb.
3. Kan jag lägga till 360-gradersbilder på mina WooCommerce-produktsidor?
Ja, och det är ett utmärkt sätt att öka försäljningen. Vi rekommenderar SR Product 360° View-plugin specifikt för detta ändamål. Det låter dig ladda upp en sekvens av produktfoton och förvandlar dem till en roterande 360-gradersvy direkt på produktsidan.
4. Är dessa interaktiva bilder mobilvänliga?
Absolut. WordPress-pluginen som täcks i den här guiden är utformade för att vara helt responsiva. Det innebär att dina 360-graders bilder automatiskt anpassas för att passa alla skärmstorlekar, vilket ger en sömlös upplevelse för besökare på stationära datorer, surfplattor och smartphones.
5. Behöver jag kodningskunskaper för att lägga till 360-graders bilder?
Nej, du behöver inte kunna koda. De plugins vi rekommenderar lägger till ett enkelt block i WordPress-redigeraren eller integreras med WooCommerce-gränssnittet. Detta gör det lika enkelt att lägga till interaktiva bilder som att ladda upp en vanlig bild.
Ytterligare resurser för engagerande visuella element
Vi hoppas att den här artikeln hjälpte dig att lära dig hur du lägger till interaktiva 360-gradersbilder. Här är några andra guider som du kan ha nytta av för att göra din webbplats mer visuellt tilltalande:
- Bästa WordPress-plugins för fotogallerier – Att välja rätt gallerوضح plugin kan hjälpa dig att visa dina bilder vackert. Den här guiden jämför de bästa alternativen för prestanda och funktioner.
- Bästa WordPress-plugins för bildreglage – Bildreglage är ett annat bra sätt att visa flera bilder eller kampanjer på ett kompakt utrymme. Kolla in våra experters val för bästa prestanda.
- Hur man skapar Flipbox-överlägg och hovringar – Lägg till ytterligare ett lager av interaktivitet till dina bilder med coola hovringseffekter och flipboxar, utan att behöva skriva någon kod.
Om du gillade den här artikeln, prenumerera gärna på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.
Jiří Vaněk
För resebloggar eller fastighetsbyråer är detta en utmärkt funktion. Personligen gillar jag den verkligen, men den fungerade aldrig ordentligt för mig. Tack för den detaljerade guiden. Detta är precis vad jag behövde för mina researtiklar på min blogg, så jag kan infoga 360-gradersfoton från mina besökta platser. Tack.