Dodaci za web sajt https://developers.facebook.com/docs/plugins
Facebook dodaci
• https://developers.facebook.com/docs/plugins
• Na ovoj stranici se nalaze svi dodaci za web sajt koje nudi Facebook.
Facebook like and share
• https://developers.facebook.com/docs/plugins/like-button
Facebook like and share
• Pronaći Like Butto Configurator na stranici.
Facebook like and share
• U tekstualno polje URL to Like uneti adresu do svog sajta ili Facebook strane.
Facebook like and share
• Kliknuti na taster Get Code .
Facebook like and share
• Pojaviće se prozor kao a sli i. • Kliknuti na IFrame tab.
• Kopirati dobijeni kod unutar svog sajta.
Facebook like and share
https://www.youtube.com/
Youtube dodatak
• Otići a stra i u https://www.youtube.com/ .
• Pro aći video koji želite da prikažete u okviru svog sajta.
Youtube dodatak
• Kliknite na Share .
Youtube dodatak
• Zatim kliknuti na ta E ed . • Kopirati dobijeni kod u okviru svog sajta.
Youtube dodatak
https://developers.google.com/maps/documentation/javascript/adding-a-google-map
Google Maps dodatak
• https://developers.google.com/maps/documentation/javascript/adding-a-google-map .
Google Maps dodatak
• Da bismo na naše sajtu prikazali apu, potre o je u okviru svoje stra i e dodati sledeći kod kako bismo pristupili Google Maps API-u:
• <script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"> </script>
API key
• Da bismo autentifikovali našu aplika iju u Google Maps, moramo ga dobiti API key.
1. Ulogovati se na svoj Google nalog i zatim otići a stra i u https://console.developers.google.com/flows/enableapi?apiid=maps_backend,geocoding_backend,directions_backend,distance_matrix_backend,elevation_backend,places_backend&reusekey=true&pli=1 .
API key nastavak API key nastavak
API key nastavak API key nastavak
• Vratiti se u kod i promeniti putanju za ucitavanje Google Maps API-a.
• Umesto YOUR_API_KEY ubaciti dobijeni API key.
Google Maps marker
• Kada smo povezali stranicu sa Google Maps API, sada trebamo u napraviti div u kome će o prikazati loka iju koju želi o.
Google Maps marker
1. U okviru svoje stranice napraviti div i zadati proizvoljan id.
2. Zatim je potrebno definisati u CSS-u width i heigth tog div-a, kako bismo definisali dimenzije okvira za prikaz mape.
Google Maps marker
3. Sledeći korak je da u JavaS ript-u napravimo funkciju kojom se u napravljenom div-u prikazuje mapa.
• google-map je id atribut napravljenog div-a.
<script type="text/javascript">
function initMap() {
var lokacija = {lat: 44.814514, lng: 20.483899};
var map = new
google.maps.Map(document.getElementById('google-map'),
{
zoom: 17,
center: lokacija
});
var marker = new google.maps.Marker({
position: lokacija,
map: map
});
}
</script>
Google Maps marker
Google Maps marker
• Rezultat:
Promena pozicije pokazivača
• U prethod o pri eru s o pokazivač postavili a loka iju škole. • Pokazivač se ože postaviti a ilo koje esto a api. • U prethodnom kodu treba promeniti vrednosti za lat i lng koje će o
do iti po oću Google Maps.
Pro e a pozicije pokazivača
• Otići a Google Maps. https://www.google.rs/maps/ .
Pro e a pozicije pokazivača
• Pro aći eku loka iju a api. • Desni klik na lokaciju i izabrati Šta je ovde?
Pro e a pozicije pokazivača
• Na d u stra i e će se prikazati lat i lng te lokacije, razdvojene zarezom.
Pro e a pozicije pokazivača
• Kopirati dobijene vrednosti i promeniti u kodu.
Promena pozicije pokazivača
Dodaci za web sajt
Top Related