Cum să încorporați Google Photo Spheres pe blog sau pe site-ul dvs.

Afișarea unei sfere foto se simte aproape ca în picioare în locul în care a fost făcută imaginea, dar, ca o nouă formă de imagine digitală, împărtășirea sferelor foto este încă puțin cam greoaie.

În acest tutorial vă voi arăta cum să încorporați sfere foto Google pe o pagină Web. Dacă aceasta este prima dată când introduceți codul într-o pagină web, nu vă faceți griji. Toată munca grea a fost făcută pentru noi: trebuie doar să adunăm trei elemente și să le punem împreună. Veți avea nevoie de un program de editor de text deschis în timpul acestui proces pentru a lipi și edita fragmente de text sau de cod pe măsură ce le adunați.

Găsiți sau Creați o Photo Sphere

Puteți căuta prin Google Street View și puteți găsi orice sferă de fotografii din întreaga lume și să o încorporați în blogul dvs. Sau puteți crea o fotografie sferică utilizând telefonul smartphone sau DSLR și o puteți contribui la Google Maps. Vedeți tutorialele mele despre crearea unei sfere foto cu un smartphone sau un DSLR.

Găsiți numărul de identificare Panorama

Găsiți fotografia sferică sau panorama pe Hărți Google și faceți clic pentru a o vizualiza. Copiați și inserați adresa URL în editorul de text. Veți observa că adresa URL este foarte lungă și împărțită în segmente diferite care corespund diferitelor biți de date. Undeva în această adresă lungă este adresa URL Pano ID. Uitați-vă la adresa URL până când veți găsi expresia = date. Acesta este un indiciu de unde să începeți să căutați. Pano ID este localizat după această expresie și între caractere !1s și următoarea ! semn de exclamare. De exemplu, în șir date =! 3m6! 1E1! 3m4! 1sWijofm0bDHKz2mc4rSk-dg! 2e0! 7i13312! 8i6656, personajele Wijofm0bDHKz2mc4rSk-dg sunt Pano ID. Copiați aceste caractere în editorul de text pentru a le utiliza ca Pano ID.

De asemenea, puteți extrage Pano ID folosind javascript. Din fericire, unii oameni au creat deja un simplu instrument online pe care să-l putem folosi pentru a-l apuca Pano ID. Instrumentul Panoid vă permite să trageți pe Pegman la orice loc din Google Maps și returnează Pano ID în colțul din stânga jos. Copiați Pano ID și lipiți-l în editorul de text.

Obțineți codul de încorporare

Accesați API-ul Google Maps Embed și faceți clic pe Afișați vizualizarea Street View sau o panoramă personalizată fila.

Plasați Pano ID în Personalizat pentru panorama cutie. După ce faceți clic pe acea căsuță, sfera dvs. foto va apărea în previzualizare. Dacă nu apare, verificați din nou Pano ID.

Sfera de fotografii trebuie să fie aprobată de Google Maps și adăugată la Google Maps pentru a fi utilizabilă Pano ID.

Când previzualizați corect fotografia sferică, copiați codul de încorporare din partea de jos a paginii și inserați-l în editorul de text.

Obțineți o cheie API

Păstrați în API-ul Google Maps, faceți clic pe Arata bine buton. Apoi faceți clic pe Inregistreaza-te butonul din pagina următoare. Înregistrați-vă un API înregistrând, revizuind și acceptând termenii și condițiile. Odată ce sunteți de acord cu termenii, va fi creat un nou proiect pentru dvs. și va fi generată o cheie API. De asemenea, veți fi dus la consola dezvoltatorului.

În consola dezvoltatorului, faceți clic pe cheia browserului. Veți fi luați la Browser API Key Pagină. Pe această pagină, copiați Cheia API și lipiți-l în editorul de text.

Mai există un câmp care trebuie completat înainte de a putea utiliza cheia. Trebuie să configurați referitori în ultimul câmp. Referrer dvs. va fi site-ul dvs. cu un wildcard caracter (*) înainte și după el. De exemplu: * .Yoursite.com / * Aceasta va spune API-ului că orice pagină de pe www.yoursite.com are permisiunea de a utiliza API-ul. Restricționează, de asemenea, utilizarea altor site-uri Cheia API cu excepția cazului în care sunt adăugate aici.

Adăugați-vă Cheia API la Cod ascuns prin înlocuirea ... în cheie = ... de dumneavoastră Cod ascuns cu tine Cheia API.

Utilizați fragment de cod pentru a încorpora

Dacă utilizați un manager de conținut precum Wordpress, creați o pagină nouă sau un blog. Apoi faceți clic pe comutați la HTML buton. Odată ajuns în acest mod, puteți introduce cod HTML personalizat. Inserați codul de încorporare și faceți clic pe butonul de salvare. Puteți reveni mai târziu la modul obișnuit pentru a adăuga orice text sau alte elemente pe care le doriți.

Continuați și vizualizați pagina. Dacă apare sfera foto, o treabă excelentă ați făcut-o! Dacă nu apare, ar trebui să vedeți un mesaj de avertizare. Mesajul de avertizare vă va spune dacă aveți o problemă cu Pano ID sau cu Cheia API. Dacă nu apare nicio sferă de fotografie sau avertizare, problema poate fi în fragmentul de cod. Copiați-l din nou și inserați-l în pagina dvs. Web.

Dacă utilizați Adobe Muse, faceți clic pe Obiect meniu și selectați Introduceți cod HTML. Apoi lipiți fragmentul de cod în caseta de dialog și faceți clic pe O.K. Glisați caseta la locația dorită din pagină și redimensionați-o la 600 x 450 pixeli. Pentru a vedea sfera foto, va trebui să publicați site-ul pe web. Deci, mergeți mai departe și faceți clic pe Publica. Odată publicat, navigați la pagina cu sfera foto pentru ao vizualiza.

Iată o privire la codul meu de încorporare pe care l-am inserat în pagina mea: