Destul de des, la crearea unui site, devine necesar să inserați o hartă pe acesta care să indice locația organizației dumneavoastră. De fapt, harta de pe site este foarte convenabilă: în primul rând pentru utilizatorii tăi. Ei vor putea să vadă imediat, fără a părăsi resursa dvs., cum vă pot găsi, ce este în apropiere și să determine cât de departe se află organizația dvs. de locația lor. Nu toată lumea știe cum să insereze o hartă într-un site web. Și să o faci este foarte, foarte simplu!
În acest articol vă voi spune și vă arăt cum, în doar câteva minute, puteți introduce o hartă cu locația dorită în paginile site-ului dvs.
Cum să inserați o hartă într-un site web
Deci, pentru a introduce o hartă în site, vom folosi un serviciu de la Google.
1. Primul lucru pe care trebuie să-l facem este să mergem pe site-ul Google Maps.
2. Acum, pentru a efectua toate operațiunile de care avem nevoie, cel mai bine este să mergem la „Interfața clasică”.
Pentru a face acest lucru, faceți clic pe pictograma semn de întrebare din colțul din dreapta jos al ecranului.
În fața dvs. se va deschide un mic panou de meniu glisant, în care trebuie să selectați „Interfață clasică”.
După aceea, va apărea o altă fereastră pop-up, unde vi se va cere să spuneți de ce doriți să utilizați interfața clasică. Puteți bifa unul dintre elemente sau nu îl puteți bifa, dar faceți imediat clic pe linkul albastru „Interfață clasică” chiar mai jos.
După aceea, veți fi dus la interfața clasică Google Maps, unde există tot ce avem nevoie pentru a plasa harta pe pagina site-ului.
3. Acum introduceți adresa necesară în câmpul pentru adresă. Nu uitați că trebuie să specificați țara, orașul, strada și casa, adică adresa completă.
Ca urmare, veți primi locația dvs. pe hartă, marcată cu un marcator roșu.
4. Acum trebuie să introducem codul de încorporare în pagina noastră web, precum și să setăm unele setări.
Pentru a obține codul de încorporare, trebuie să facem clic pe pictogramă pentru a obține linkul sau codul (este situat în dreapta pictogramei cu imprimanta).
5. Aici ne interesează codul HTML de adăugat pe site (al doilea câmp).
Tot în acest cod puteți vedea câțiva parametri care pot fi modificați. Acestea sunt dimensiunile hărții, adică înălțimea și lățimea acesteia. De asemenea, puteți seta un cadru pentru hartă. În mod implicit, valoarea marginii este zero, dar o puteți modifica punând, de exemplu, una.
Dacă aveți nevoie, atunci modificați acești parametri, deși o puteți face din codul paginii web. Dacă nu este necesar, copiați tot codul.
6. Acum tot ce rămâne este să lipiți codul copiat în locul paginii dvs. web unde doriți să vedeți harta.
Puteți crea un bloc „div” separat special pentru harta dvs., pe care îl puteți stila ulterior prin fișierul foaie de stil.
Îmi voi introduce cardul chiar aici. Vezi cum va arata.
Ca rezultat, utilizatorul va vedea locația dvs. marcată cu un marcator. El va putea muta harta, mări și micșora.
De asemenea, deasupra marcatorului va fi afișată o fereastră cu adresa dvs. Iar mai jos va fi un link pentru a vizualiza harta la scară mai mare.
Gata, totul este foarte simplu, funcțional și convenabil.
Folosește-l pentru sănătatea ta!
M-aș bucura dacă această lecție ți-ar fi de folos. Ca mulțumire, lăsați comentariile voastre și distribuiți articolul folosind butoanele de rețele sociale situate chiar mai jos.
De asemenea, abonați-vă la actualizarea blogului dacă nu sunteți abonat încă. Vă promit o mulțime de materiale utile.
Anna Kotelnikova a fost cu tine.
Vă doresc succes și ne vedem curând.
Harta indicațiilor pe site cu adresa organizației este un ghid foarte convenabil pentru utilizatori. De acord, este foarte practic să intri pe site și să vezi locația companiei fără a deschide file suplimentare pentru a găsi adresa pe hartă. Acesta este un semn suplimentar mic plus în pușculița de loialitate din partea clientului față de organizație.
De obicei, harta locației este plasată pe pagina de contact sub datele specificate pentru comunicare. Se introduce folosind un cod de program special (script). Cel mai în moduri simple obținerea unui astfel de scenariu este utilizarea soluțiilor API gata făcute de la Google sau Yandex... Nu este nevoie de cunoștințe de programare pentru a introduce o hartă în site, urmând instrucțiunile de mai jos, veți primi o hartă vizuală și convenabilă.
Introduceți un card folosind Yandex Maps
1. În acest moment (începutul anului 2013) constructorul de hărți Yandex este disponibil în versiunea 2.0, ceea ce este foarte convenabil și logic. Nici măcar nu trebuie să fii un utilizator autorizat pentru a crea un card. Primul pas este să creați cardul propriu-zis cu adresa. Pentru a face acest lucru, urmați linkul http://api.yandex.ru/maps/tools/constructor/ și introduceți adresa companiei în câmpul de intrare de jos. După ce faceți clic pe butonul „găsiți”, sistemul va afișa variante ale adreselor găsite.
2. Puneți un punct la adresa dorită și în câmpul de descriere indicați numele organizației. Este mai bine să alegeți culoarea punctului în funcție de stilul site-ului pe care va fi amplasată harta. Constructorul vă permite, de asemenea, să marcați alte repere pe hartă, de exemplu, obiecte mari cunoscute, să întindeți harta la dimensiunea dorită, să desenați un traseu dintr-o oprire de transport folosind instrumentul de desenare a liniilor și să editați scara.
3. Apoi, accesați fila vizualizare. Aici puteți alege dacă harta dvs. este statică sau interactivă. Este mai bine să alegeți a doua opțiune, astfel încât utilizatorul să poată vedea zona din apropiere și să se orienteze.
4. Fila „Cod încorporat” vă solicită să citiți acordul de utilizare. După confirmare, vi se va prezenta un cod de încorporare. Puteți să-l editați puțin, de exemplu, să eliminați linkul către Yandex, să ajustați dimensiunea mai precis, dar este mai bine să nu faceți modificări semnificative.
5. Copiați acest cod și inserați-l în pagina de contact prin editorul HTML după text.
6. Salvați modificările efectuate și verificați rezultatul pe pagina site-ului.
Inserați o hartă folosind Google Maps
1. Algoritmul acțiunilor este similar cu cel descris mai sus. Urmați linkul http://maps.google.ru/maps și introduceți adresa organizației în bara de căutare. De asemenea, puteți vedea cum arată de pe satelit. Apoi, pentru a obține codul, faceți clic pe semnul de link din stânga. Puteți copia codul existent sau puteți face clic pe linkul „Configurați și previzualizați harta încorporată”.
2. Când alegeți să editați, se va deschide o fereastră suplimentară unde puteți ajusta dimensiunile acesteia.
3. Copiați codul rezultat și inserați-l prin editorul html de pe pagina site-ului. Va arăta exact la fel ca în previzualizare. Spre deosebire de hărțile Yandex, Hărți Googleîntotdeauna doar interactiv, există mai puține oportunități de a edita harta în sine, dar puteți privi terenul de pe un satelit, relief cu numele obiectelor și o hartă 3D.
Pentru ca un site să fie căutat pe Yandex.Maps, acesta trebuie să fie înregistrat în Yandex.Directory.
Pentru a plasa un fragment al hărții pe site-ul dvs., trebuie să completați câteva câmpuri în constructor. Presupun că este mai bine să instalați codul unei scheme statice pe pagina HTML, cu un link către Yandex.Maps, deoarece scriptul poate fi nedorit pe dispozitivele cu conexiuni lente la internet. 
Rezultat:
adresa_de la_constructor"alt =" (! LANG: Numele companiei!}"/>Modul Panoramă poate fi adăugat și pe site-ul dvs 
Rezultat (conținutul poate fi rotit, dacă prindeți o secțiune din acesta cu mouse-ul, deplasați-vă de-a lungul străzilor făcând clic pe săgeți):
Urmărește acest videoclip pentru a te inspira:
Adăugați o hartă pe site: două imagini una lângă alta (HTML / CSS)
Puteți pune o imagine a organizației lângă hartă. Când fereastra browserului este redusă, imaginile vor fi reduse proporțional.
 |
 |
|
Sculptura „Patria cheamă!” 
De la autor: Va salut prieteni! În acest scurt articol, vom învăța cum să inserăm o hartă Yandex într-un site WordPress. Problema adăugării unei hărți pe orice site este destul de populară în rândul utilizatorilor, ceea ce nu este surprinzător. La urma urmei, aproape orice site are o pagină de contact și, dacă există o adresă fizică, să zicem, un magazin sau un studio, atunci este mai ușor și mai bine să o demonstrezi într-o formă care este pe înțelesul vizitatorului - pe o hartă Yandex.
Deci, pentru a adăuga o hartă pe site, mai întâi trebuie să o creați. Acest lucru se poate face folosind generatorul de site-uri web din serviciul Yandex. Acest serviciu este disponibil la următoarea adresă - https://tech.yandex.ru/maps/tools/constructor/.
După cum puteți vedea, ni se oferă să alegem un card gata făcut sau să creăm unul nou. Rețineți că, totuși, pentru a crea o hartă, precum și pentru a lucra cu alte servicii de la Yandex, aveți nevoie de un cont pe Yandex. Dacă nu aveți unul sau nu sunteți autentificat, atunci Yandex vă va oferi să vă creați propriul cont sau să vă conectați la unul existent. Deci, faceți clic pe butonul Creați card nouși, cel mai probabil, veți vedea o hartă a orașului în care vă aflați.
Dacă acesta nu este orașul dvs. sau aveți nevoie doar de un alt oraș, îl putem schimba în continuare atunci când căutăm adresa sau obiectul dorit pe hartă.
De exemplu, să creăm o hartă cu strada principală din Kiev - Khreshchatyk. Pentru a face acest lucru, utilizați bara de căutare din partea de sus a hărții și introduceți adresa de interes pentru noi.
Ca urmare, se va găsi strada necesară sau adresa exactă, dacă ați introdus-o. Apoi puteți utiliza un set de butoane sub bara de căutare, în special butonul Locații, care vă permite să plasați un marcator de locație pe obiectul de pe hartă dorit.
Pentru o etichetă, puteți seta un text (descriere), puteți stabili culoarea și tipul acestuia. După aceea, faceți clic pe butonul Terminare. După aceea, în partea stângă a paginii, vom găsi butonul Salvați harta și vom obține un link și faceți clic pe el.
După salvare, vom vedea o previzualizare a hărții, unde puteți ajusta dimensiunea acesteia prin simpla glisare a glisoarelor de pe părțile laterale ale hărții.
Schimbând dimensiunea hărții Yandex, în partea stângă a paginii, vom vedea imediat parametrii lățimii și înălțimii sale, iar acest lucru este foarte convenabil. După finalizarea modificărilor, faceți clic pe butonul Obțineți codul cardului.
După ce facem clic pe butonul din tooltip, vom vedea codul de hartă gata făcut, care rămâne de inserat în pagina WordPress dorită.
Am deja o pagină de contact pe site-ul meu WordPress, pe această pagină voi lipi codul copiat. Vă rugăm să rețineți că acesta este codul HTML care include scriptul, așa că acest cod trebuie inserat în pagină nu în modul vizual, ci în modul Text.
Să salvăm pagina și să vedem modificările din zona de utilizator a site-ului WordPress. După cum puteți vedea, harta Yandex a apărut cu succes pe site-ul WordPress.
Totul este extrem de simplu și întregul proces a durat literalmente câteva minute. Ceea ce este foarte convenabil este că putem, dacă dorim, să plasăm o hartă Yandex pe orice pagină a site-ului WordPress și chiar în orice parte a site-ului. De exemplu, putem forma cu ușurință o hartă în miniatură și o putem introduce în bara laterală. Pentru a face acest lucru, trebuie doar să utilizați widgetul Text, care vă permite să introduceți cod HTML. Ei bine, asta e tot pentru mine. Noroc!
Daca doresti introduceți o hartă bună pe site cu o indicație a locației de pe el, de exemplu, biroul, depozitul dvs., apoi utilizați instrumente web cunoscute precum Harta site-ului de la Yandex sau Sitemap de la google.
În acest articol vă vom spune de ce și cum să inserați o hartă Yandex pe site.
Așa arată, de exemplu, harta Yandex, pe care am introdus-o pe site-ul centrului comercial. Ar fi putut fi mai detaliat, cu imagini cu case pe diagramă, dar în în acest caz era mai important să se indice locația centrului comercial în raport cu cele mai apropiate sate, așa că s-a ales o scară mică.
De ce ai nevoie de o hartă pe site?
S-ar putea să zâmbești după ce ai citit această întrebare aparent retorică. „Este nevoie de o hartă pentru ca vizitatorii să știe unde ne aflăm” este un răspuns simplu prea simplu pentru a înțelege rolul unei hărți, mai ales pentru un site comercial. Iată câteva aspecte importante ale unei hărți pe un site web:
- Acordați o atenție deosebită: prezența unui card crește foarte mult gradul de încredere în resursa dvs. Afișarea vizuală a locației companiei, biroului, magazinului, eliberează în mod subconștient un potențial client (ameliorează temerile, cum ar fi: „Dacă trișează și dispar?”), ceea ce înseamnă că crește probabilitatea ca un vizitator al site-ului să devină clientul tău adevărat.
- Prezența unei hărți interactive (spre deosebire de o imagine-hartă) permite utilizatorului să se orienteze mai bine pe teren, să vadă cel mai apropiat metrou, șoferilor să verifice traseul pe abordările îndepărtate de obiect. În plus, harta interactivă vă permite să vizualizați terenul din spațiu.
- Ei bine, bineînțeles, este nevoie de o hartă pe site pentru ca vizitatorii și clienții site-ului să cunoască locația magazinului, biroului, depozitului tău.
Cum să inserați o hartă Yandex într-un site web (instrucțiuni pas cu pas)
Ar trebui folosit Constructor API Yandex.Maps.
În acest articol, oferim o aproximativă instrucțiuni pas cu pas, care, sperăm, vă va ajuta să introduceți o hartă Yandex în site-ul dvs.:
Pasul 1. Configurarea inițială a sitemapului Yandex:
- Deschideți pagina de designer Yandex.Maps pentru site.
- Găsiți locul geografic necesar pe hartă după adresă sau manual (folosind glisorul de scalare și deplasând harta cu mouse-ul).
- Alegeți o scară care este convenabilă pentru munca dvs. Este mai bine să setați scara finală la sfârșitul lucrării. Vom desena etichete pe hartă, linii (drumuri de acces) și contururi ale clădirilor sau teritoriilor.
- Introduceți numele viitorului card în câmpul corespunzător.
- Să trecem la setul de instrumente de serviciu: butoane pentru desenarea punctelor (etichete pe hartă), linii, poligoane (contururi) și dimensiunile hărții.
Pasul 2. Desenați puncte (semne) pe hartă:
- Faceți clic pe butonul pentru desenarea punctelor.
- Punem un semn (punct) în locul de care avem nevoie. De exemplu, pe clădirea dvs. de birouri. Un sitemap de la Yandex vă permite să introduceți nu una, ci mai multe etichete (de exemplu, dacă aveți mai multe magazine, depozite sau birouri).
- Se trece la setarea proprietăților etichetei instalate (inserarea textului, alegerea unei culori etc.).
Pasul 3. Configurarea proprietăților etichetei instalate pe hartă:
- Faceți clic direct pe eticheta pe care am desenat-o.
- În fereastra care se deschide, selectați proprietățile de care avem nevoie (culoarea, numărul etichetei de pe hartă), scrieți textul după cum doriți (mai târziu textul va fi vizibil utilizatorului când face clic pe etichetă).
- Orice etichetă poate fi eliminată din caseta de proprietăți corespunzătoare.
- Deci, am inserat eticheta biroului dvs. pe harta Yandex a site-ului, am configurat proprietățile acestuia și acum trecem la trasarea liniilor. De exemplu, liniile alee de acces la birou.
Pasul 4. Trasarea liniilor pe hartă:
- Faceți clic pe butonul de desen linie.
- Făcând clic pe hartă, obținem o polilinie a oricărei traiectorii. Poate fi folosit pentru a contura orice obiect sau pentru a trasa un traseu de apropiere de obiect.
- Prin mutarea mânerelor pătrate și rotunde, puteți edita forma liniei.
- Prin analogie cu etichetele, dacă faceți clic pe linie, va apărea o fereastră de proprietăți, în care puteți seta culoarea, grosimea, transparența liniei, precum și să introduceți textul care va fi afișat utilizatorului.
- Acum să trecem la desenarea poligoanelor.
Pasul 5. Desenați poligoane umplute cu culoarea căii:
- Faceți clic pe butonul pentru a desena poligoane.
- Spre deosebire de linii, care pot fi folosite și pentru a contura orice poligon, aceste poligoane sunt contururi cu un mijloc umplut.
- Făcând clic pe hartă, puteți desena orice poligon umplut. Tehnica de desenare, editare și setare a proprietăților este aceeași ca și pentru desenarea liniilor.
- Acum să trecem la redimensionarea hărții.
Pasul 6. Redimensionarea hărții site-ului:
- Faceți clic pe butonul de redimensionare.
- Tragând mânerele pătrate de-a lungul conturului hărții, puteți redimensiona după cum este necesar. E simplu.
- Se trece la crearea finală a hărții.
Pasul 7. Obținerea codului hărții pentru site (Yandex):
- Oferim hărții aspectul final, setând scara finală a hărții și poziția finală (coordonatele).
- În această etapă, crearea unei hărți pentru site (Yandex) poate fi considerată completă. Faceți clic pe butonul galben mare „Salvați și obțineți codul”.
- Chiar și după salvarea hărții, puteți reveni oricând la editare.
- Vă rugăm să rețineți că harta poate fi nu doar o diagramă, ci și o fotografie din spațiu, un hibrid sau un element al „Hărții Poporului”.
- În plus, sunteți liber să faceți harta interactivă sau o imagine simplă. O hartă interactivă este mai interesantă, mai funcțională, dar se poate încărca mai mult decât o simplă imagine. Alegerea este a ta.
- Puteți insera o hartă Yandex în site-ul dvs. plasând codul html al hărții în locul dorit de pe pagină.
Mulțumim tuturor cititorilor interesați de instrucțiunile noastre pas cu pas.
Crearea unei hărți pentru un site de la Yandex este o acțiune ușoară, care nu necesită cunoștințe și abilități speciale pe fondul unor probleme mult mai complexe ale construcției site-ului. Dacă întâmpinați dificultăți mai grave la crearea site-ului dvs., vă rugăm să ne contactați. Vom face tot posibilul pentru a vă rezolva problemele!
Dacă ți-a plăcut instrucțiunile noastre, le poți recomanda prietenilor și cunoscuților tăi. „Butoanele sociale” sunt în dreapta. Acesta este micul nostru interes personal.