Другие разделы
Наши партнеры
Реклама на сайте
  • Статистика
  • Пользователи

    Другие счетчики
    Проверка сайта Rambler's Top100

    Счетчики материалов
    Комментарии: 123
    Форум: 15/75
    Дневник: 8
    Новости: 30
    Файлы: 592
    Статей: 80
    Сайты: 4444
    Фото-галлерея: 845
    Объявления: 19
    FAQ: 8
    Гостевая книга: 28


    Наша кнопка
    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0


    Сегодня нас посетил:

Опросы
Считаете ли Вы Набрань одним элитных зон отдыха?
Всего ответов: 52
Популярные фотоснимки


Скрипт карты на подобие Picasa из фотоальбома Ucoz

Саламалейкум всем! Данный урок о том как можно встроить Google карту в модуль фотоальбом Ucoz.
Прежде всего заменяем стандартные надписи > ищем Форма добавления модуля "Фотоальбомы" > и там изменяем > "Краткое описание" на "Координаты". Главная » Фотоальбомы » Управление категориями. и Создаем категории к примеру, Москва, Петербург итд и в описание категории вставляем координаты города или села. А так же при добавления фотографии вставляем в поле "Координаты" координаты той местности который сделан снимок и выглядит примерно так "41.74376402131704,48.70391607284546" Потом создаем 2 информера с следующими параметрами > [ Фотоальбомы · Материалы · Дата добавления материала D · Материалы: 300 · Колонки: 1 · Определенные материалы ] и называем его Карта (1 часть) и Карта (2 часть) Почему я выбрал опцию Определенные материалы? Потому что у меня в модуле более 300 фотоснимков отелей и по этому не все отображаются на карте, Теперь вот этот часть кода вставляем в первый информер
Code
  var onMarkerClick$NUMBER$ = function() {  var marker = this;  var latLng = marker.getPosition();  infoWindow.setContent('<font color="#ff0000" id="firstHeading" class="firstHeading">$CAT_NAME$</font>  <br>  <a title="Перейти на страницу фотоальбома $CAT_NAME$" href="$CAT_URL$">$PHOTO$</a>');    infoWindow.open(map, marker);  };  google.maps.event.addListener(map, 'click', function() {  infoWindow.close();  });    var iconImage$NUMBER$ = new google.maps.MarkerImage('http://www.nabran.ru/Iconki/maps/5.png', <!-- Иконки на карте -->  new google.maps.Size(100,50),  new google.maps.Point(0,0),  new google.maps.Point(20,40)  );  var iconShadow$NUMBER$ = new google.maps.MarkerImage('http://www.nabran.ru/Iconki/maps/5.png', <!-- Иконки на карте -->  new google.maps.Size(100,50),  new google.maps.Point(0,0),  new google.maps.Point(20, 40)  );  var marker$NUMBER$ = new google.maps.Marker({  map: map,  icon: iconImage$NUMBER$,  shadow: iconShadow$NUMBER$,  title:"$CAT_NAME$ [Координаты $PHOTO_DESCR$]",  position: new google.maps.LatLng($PHOTO_DESCR$)  });    
И во второй информер вставляем этот часть
Code
    google.maps.event.addListener(marker$NUMBER$, 'click', onMarkerClick$NUMBER$);    
Дальше идем редактировать шаблон фотоальбома До тега вставляем вот это На главную страницу фотоальбома и на страницу со списком фотографий раздела можно вставит так
Code
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />  <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>    <script type="text/javascript">  google.maps.event.addDomListener(window, 'load', function() {  var map = new google.maps.Map(document.getElementById('map'), {  zoom: 10, <!-- Увеличение карты -->  center: new google.maps.LatLng(41.74376402131704,48.70391607284546), <!-- Сюда координаты -->  mapTypeId: google.maps.MapTypeId.SATELLITE  });    var infoWindow = new google.maps.InfoWindow;  $MYINF_23$ <!-- информер номер 1 -->  $MYINF_24$ <!-- информер номер 2 -->  });  </script>      <style type="text/css">  #map{width:555px; height:500px;} <!-- Размеры карты -->  .mappp{background:url('http://www.nabran.ru/images/loaders/loader4525.gif')no-repeat;background-position:250px 250px;}  #bodyContent {text-align:left;font-weight:normal;font-size:10pt;color:#FF0000;}  </style>    
А вот на страницу со списком фотографии альбома вставляйте точно в таком форме
Code
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />  <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>    <script type="text/javascript">  google.maps.event.addDomListener(window, 'load', function() {  var map = new google.maps.Map(document.getElementById('map'), {  zoom: 15, <!-- Увеличение карты -->  center: new google.maps.LatLng($CAT_DESCR$), <!-- Сюда координаты или тег $CAT_DESCR$ -->  mapTypeId: google.maps.MapTypeId.SATELLITE  });    var infoWindow = new google.maps.InfoWindow;  $MYINF_23$ <!-- информер номер 1 -->  $MYINF_24$ <!-- информер номер 2 -->  });  </script>      <style type="text/css">  #map{width:555px; height:500px;} <!-- Размеры карты -->  .mappp{background:url('http://www.nabran.ru/images/loaders/loader4525.gif')no-repeat;background-position:250px 250px;}  #bodyContent {text-align:left;font-weight:normal;font-size:10pt;color:#FF0000;}  </style>    
Между тегами и вставляем следующее
Code
    <fieldset><legend><b><font color="#00ff00" size="1">$CAT_NAME$ на карте</font></b></legend>  <div class="mappp" id="map"></div>  </fieldset>    
Ну вот и все ребята smile только не забудьте заменить коды информеров, координаты на свои и изменить прочие мелкие настройки в роде как размер карты и текст на свое предпочтения, просьба статью читать по внимательнее, на работоспособность я гарантирую на все 100% так как я скопировал все коды с шаблона моего сайта. Если у меня работало то и у вас тоже должна работать, вот живой пример на главном странице моего сайта www.nabran.ru А если у кого получится по круче, я бы с удовольствием попробовал вашу версию. Удачи при установке.


Тип лицензии - Бесплатно
Имя автора - Азер Исмиханов
Источник: www.nabran.ru
Категория: Скрипты для Ucoz | Добавил: | Теги: Скрипт, Google maps, юкоз+ПСД, скрипты ucoz, фотоальбом Ucoz, Picasa, google карты Просмотров: 2582 | Загрузок: 0 | Рейтинг: 5.0/3/5 35 5.0
Материал добавлен , 03:01


Схожие материалы
Комментариев всего: 0




Комментариев НЕТ
Стань первым, кто прокомментирует



avatar
Хостинг от uCoz Топ сайтов ucozon.ru Catalog-Moldova - Ranker, Statistics Туристический каталог Санатории курорта Саки Create a free website Каппадокия - Турция: форум, информация, достопримечательности, статьи, фотографии, карты Каталог лучших сайтов конструктора uCoz Турция.Ру Индия.Ру Непал.Ру Пакистан.Ру Тибет.Ру Египетский Клуб. Обмен ссылками. Каталог сайтов: Туризм Наш сайт в каталоге Главной Московской доски объявлений 495RU.ru Каталог сайтов Всего.RU Каталог сайтов Bi0 Каталог сайтов OpenLinks.RU Каталог сайтов и статей iLinks.RU Каталог Ресурсов Интернет Каталог сайтов :: Развлекательный портал iTotal.RU
Все права защищены Nabran.ru © 2008-2021
Копирование информации запрещено без указания индексирующего гиперссылки на наш сайт!
Дизайн от Азер Исмиханов
Сайт оптимизирован под браузеры
opera firefox chrome safari Internet Explorer