Сообщений в теме: 10

[moskvin]

Здравствуйте!
Помогите, пожалуйста, неспециалисту (но готовому учиться человеку)
Хочется на страницу "Доставка" добавить код js, загружающий схему проезда yandex-карт.
Вот ссылка на сервис: http://api.yandex.ru...ls/constructor/
Если код добавлять в файлы "HTML" или "Страница" с помощью редактора шаблона, то это отразится на всех страницах, а требуется только для конкретной.
А в редакторе страницы код java-script, насколько я понял, вставлять нельзя.
Какой правильный путь?
Илья.

[support]

moskvin (17 Сентябрь 2010 - 19:52) писал:

Здравствуйте!
Помогите, пожалуйста, неспециалисту (но готовому учиться человеку)
Хочется на страницу "Доставка" добавить код js, загружающий схему проезда yandex-карт.
Вот ссылка на сервис: http://api.yandex.ru...ls/constructor/
Если код добавлять в файлы "HTML" или "Страница" с помощью редактора шаблона, то это отразится на всех страницах, а требуется только для конкретной.
А в редакторе страницы код java-script, насколько я понял, вставлять нельзя.
Какой правильный путь?
Илья.

Здравствуйте, Илья!

Доставка отображается в 2х местах:
- контент страница (Панель управления магазином -> вкладка "Сайт" -> пункт меню "Страницы" -> там страница доставки)
- при оформлении заказа (Настройка производится во вкладке "Настройки" -> "Доставка" -> нужный вариант доставки. Отображение производится в файле "товар" и в файле "Оформление заказа" расположенными в редакторе тем, вкладка "Сайт")

1) Чтобы изменить контент-страницу откройте её. В визуальном редакторе нажмите самую нижнюю, правую иконку с названием "HTML". Появится исходный код, там вставьте нужный код карты.

2) Чтобы изменить информацию в оформлении заказа, нужно отредактировать html файл, в редакторе тем, "Оформление заказа". Там прописать нужный код в соответствующем блоке и все заработает. Хотя конечно же логичней информацию по доставке размещать на странице доставки до момента оформления заказа, т.е. как указано выше, в первом варианте.

[moskvin]

support (20 Сентябрь 2010 - 08:13) писал:

Здравствуйте, Илья!

Доставка отображается в 2х местах:
- контент страница (Панель управления магазином -> вкладка "Сайт" -> пункт меню "Страницы" -> там страница доставки)
- при оформлении заказа (Настройка производится во вкладке "Настройки" -> "Доставка" -> нужный вариант доставки. Отображение производится в файле "товар" и в файле "Оформление заказа" расположенными в редакторе тем, вкладка "Сайт")

1) Чтобы изменить контент-страницу откройте её. В визуальном редакторе нажмите самую нижнюю, правую иконку с названием "HTML". Появится исходный код, там вставьте нужный код карты.

2) Чтобы изменить информацию в оформлении заказа, нужно отредактировать html файл, в редакторе тем, "Оформление заказа". Там прописать нужный код в соответствующем блоке и все заработает. Хотя конечно же логичней информацию по доставке размещать на странице доставки до момента оформления заказа, т.е. как указано выше, в первом варианте.

Да, я бы хотел изменить именно контент-страницу, то есть пойти по первому варианту.
Я уже пробовал делать, так как Вы описываете. Я вставлял нижеуказанный код (простите за длинное сообщение) в исходный код страницы, который открывается после нажатия на кнопку HTML в визуальном редакторе. Но при этом на странице ничего не появляется, кроме надписи "Создано с помощью инструментов Яндекс.Карт". В то же время, если вставить тот же код в какой-либо файл шаблона в редакторе тем, то на соответствующей странице появится карта. Этот последний факт говорит о том, что код карты нормальный. Так что же я делаю не так при попытке добавления этого кода в контент-страницу?
Илья.
<!-- Этот блок кода нужно вставить в ту часть страницы, где вы хотите разместить карту  (начало) -->
<script src="http://api-maps.yand...rd=constructor" type="text/javascript"></script>
<script type="text/javascript">
    YMaps.jQuery(window).load(function () {
        var map = new YMaps.Map(YMaps.jQuery("#YMapsID-5250")[0]);
        map.setCenter(new YMaps.GeoPoint(37.356532,55.846385), 9, YMaps.MapType.MAP);
        map.addControl(new YMaps.Zoom());
        map.addControl(new YMaps.ToolBar());
        map.addControl(new YMaps.TypeControl());

        YMaps.Styles.add("constructor#pmlbmPlacemark", {
            iconStyle : {
                href : "http://api-maps.yand...arks/pmlbm.png",
                size : new YMaps.Point(28,29),
                offset: new YMaps.Point(-8,-27)
            }
        });


        YMaps.Styles.add("constructor#FF3732c85Polyline", {
            lineStyle : {
                strokeColor : "FF3732c8",
                strokeWidth : 5
            }
        });
       map.addOverlay(createObject("Placemark", new YMaps.GeoPoint(37.510341,55.827837), "constructor#pmlbmPlacemark", "точка1"));
       map.addOverlay(createObject("Placemark", new YMaps.GeoPoint(37.232936,55.980588), "constructor#pmlbmPlacemark", "точка2"));
       map.addOverlay(createObject("Polyline", [new YMaps.GeoPoint(37.482875,55.864923),new YMaps.GeoPoint(37.232936,55.963645)], "constructor#FF3732c85Polyline", "линия"));
        
        function createObject (type, point, style, description) {
            var allowObjects = ["Placemark", "Polyline", "Polygon"],
                index = YMaps.jQuery.inArray( type, allowObjects),
                constructor = allowObjects[(index == -1) ? 0 : index];
                description = description || "";
            
            var object = new YMaps[constructor](point, {style: style, hasBalloon : !!description});
            object.description = description;
            
            return object;
        }
    });
</script>

<div id="YMapsID-5250" style="width:450px;height:350px"></div>
<div style="width:450px;text-align:right;font-family:Arial"><a href="http://api.yandex.ru...s/constructor/" style="color:#1A3DC1">Создано с помощью инструментов Яндекс.Карт</a></div>
<!-- Этот блок кода нужно вставить в ту часть страницы, где вы хотите разместить карту (конец) -->

[support]

Разобрались в чем проблема. wysiwyg редактор, который мы используем по какой-то причине удаляет пустой див

moskvin (20 Сентябрь 2010 - 14:37) писал:

<div id="YMapsID-5250" style="width:450px;height:350px"></div>

и поэтому карта не отображается. Это опенсурс проект, мы его периодически обновляем, но видимо они не считают удаление пустых тегов ошибкой. Для того чтобы сейчас код яндекса начал вставляться достаточно вставить пробел в этот див или любой печатный символ. (Пробел в html пишется как "&nbsp;")
Вместо вышеуказанного кода получится:

<div id="YMapsID-5250" style="width:450px;height:350px">&nbsp;</div>

Можно вставить что-то типа "карта загружается..." или "Загружаюсь...", тогда получится:

<div id="YMapsID-5250" style="width:450px;height:350px">Загружаюсь...</div>

Отображаться эта надпись будет в момент загрузки карты с яндекса, пользователю станет удобней и понятней что здесь происходит. А ссылку можно убрать т.к она не обязательна.

Далее можно сделать еще такое преобразование для магазина - убрать отображение этого блока для пользователей, у которых не подключен javascript.

<div id="YMapsID-5250" style="width:450px;height:350px;display:none;">Загружаюсь...</div>

В этом случае при загрузке страницы не будет появляться пустого блока 450 на 350 для пользователей без включенного javascript что несомненно повысит удобство просмотра сайта магазина. Для большинства пользователей с включенным javascript-ом все останется по прежнему, т.к яндекс перед загрузкой блока делает его видимым средствами javascript.

Итоговый код у нас получился таким:

<!-- Этот блок кода нужно вставить в ту часть страницы, где вы хотите разместить карту (начало) -->
<script src="http://api-maps.yandex.ru/1.1/?key=AD2Rk0wBAAAApqEpUgMAdZocgBwUA-Nb1D4762yVMDrF-TcAAAAAAAAAAAB9i2APJoYMiTYxk27_AUuXzRB1yQ==&wizard=constructor" type="text/javascript"></script>
<script type="text/javascript">
	YMaps.jQuery(window).load(function () {
		var map = new YMaps.Map(YMaps.jQuery("#YMapsID-5250")[0]);
		map.setCenter(new YMaps.GeoPoint(37.356532,55.846385), 9, YMaps.MapType.MAP);
		map.addControl(new YMaps.Zoom());
		map.addControl(new YMaps.ToolBar());
		map.addControl(new YMaps.TypeControl());

		YMaps.Styles.add("constructor#pmlbmPlacemark", {
			iconStyle : {
				href : "http://api-maps.yandex.ru/i/0.3/placemarks/pmlbm.png",
				size : new YMaps.Point(28,29),
				offset: new YMaps.Point(-8,-27)
			}
		});
		YMaps.Styles.add("constructor#FF3732c85Polyline", {
			lineStyle : {
				strokeColor : "FF3732c8",
				strokeWidth : 5
			}
		});
		map.addOverlay(createObject("Placemark", new YMaps.GeoPoint(37.510341,55.827837), "constructor#pmlbmPlacemark", "точка1"));
		map.addOverlay(createObject("Placemark", new YMaps.GeoPoint(37.232936,55.980588), "constructor#pmlbmPlacemark", "точка2"));
		map.addOverlay(createObject("Polyline", [new YMaps.GeoPoint(37.482875,55.864923),new YMaps.GeoPoint(37.232936,55.963645)], "constructor#FF3732c85Polyline", "линия"));

		function createObject (type, point, style, description) {
			var allowObjects = ["Placemark", "Polyline", "Polygon"],
			index = YMaps.jQuery.inArray( type, allowObjects),
			constructor = allowObjects[(index == -1) ? 0 : index];
			description = description || "";

			var object = new YMaps[constructor](point, {style: style, hasBalloon : !!description});
			object.description = description;

			return object;
		}
	});
</script>

<div id="YMapsID-5250" style="width:450px;height:350px;display:none;">Загружаюсь...</div>
<div style="width:450px;text-align:right;font-family:Arial"><a href="http://api.yandex.ru/maps/tools/constructor/" style="color:#1A3DC1">Создано с помощью инструментов Яндекс.Карт</a></div>
<!-- Этот блок кода нужно вставить в ту часть страницы, где вы хотите разместить карту (конец) -->

Вставляйте его на любую контент-страницу вашего интернет магазина, проблем не возникнет.

[moskvin]

Спасибо, с непустым div все работает.
Однако при добавлении свойства "display:none" карта не загружается.
Браузеры Google Chrome 6.0.472.62 и IE 8.0.

[support]

moskvin (22 Сентябрь 2010 - 13:38) писал:

Спасибо, с непустым div все работает.
Однако при добавлении свойства "display:none" карта не загружается.
Браузеры Google Chrome 6.0.472.62 и IE 8.0.

тоже в хроме тестировал, работало. В течение 3-5 вечерних часов выделю время, посмотрю почему может не работать и отпишусь в этой теме.

[support]

Да, действительно что-то не пашет...
Можно сделать тогда следующее, для пользователей без яваскрипта:
оставить свойство display:none и добавить дополнительный яваскрипт код, делающий карту видимой.

$('#YMapsID-5250').show();

В целом код тогда получится такой:

<!-- Этот блок кода нужно вставить в ту часть страницы, где вы хотите разместить карту (начало) -->
<script src="http://api-maps.yandex.ru/1.1/?key=AD2Rk0wBAAAApqEpUgMAdZocgBwUA-Nb1D4762yVMDrF-TcAAAAAAAAAAAB9i2APJoYMiTYxk27_AUuXzRB1yQ==&wizard=constructor" type="text/javascript"></script>
<script type="text/javascript">
	YMaps.jQuery(window).load(function () {
		$('#YMapsID-5250').show();
		var map = new YMaps.Map(YMaps.jQuery("#YMapsID-5250")[0]);
		map.setCenter(new YMaps.GeoPoint(37.356532,55.846385), 9, YMaps.MapType.MAP);
		map.addControl(new YMaps.Zoom());
		map.addControl(new YMaps.ToolBar());
		map.addControl(new YMaps.TypeControl());

		YMaps.Styles.add("constructor#pmlbmPlacemark", {
			iconStyle : {
				href : "http://api-maps.yandex.ru/i/0.3/placemarks/pmlbm.png",
				size : new YMaps.Point(28,29),
				offset: new YMaps.Point(-8,-27)
			}
		});
		YMaps.Styles.add("constructor#FF3732c85Polyline", {
			lineStyle : {
				strokeColor : "FF3732c8",
				strokeWidth : 5
			}
		});
		map.addOverlay(createObject("Placemark", new YMaps.GeoPoint(37.510341,55.827837), "constructor#pmlbmPlacemark", "точка1"));
		map.addOverlay(createObject("Placemark", new YMaps.GeoPoint(37.232936,55.980588), "constructor#pmlbmPlacemark", "точка2"));
		map.addOverlay(createObject("Polyline", [new YMaps.GeoPoint(37.482875,55.864923),new YMaps.GeoPoint(37.232936,55.963645)], "constructor#FF3732c85Polyline", "линия"));

		function createObject (type, point, style, description) {
			var allowObjects = ["Placemark", "Polyline", "Polygon"],
			index = YMaps.jQuery.inArray( type, allowObjects),
			constructor = allowObjects[(index == -1) ? 0 : index];
			description = description || "";

			var object = new YMaps[constructor](point, {style: style, hasBalloon : !!description});
			object.description = description;

			return object;
		}
	});
</script>

<div id="YMapsID-5250" style="width:450px;height:350px;display:none;">Загружаюсь...</div>
<div style="width:450px;text-align:right;font-family:Arial"><a href="http://api.yandex.ru/maps/tools/constructor/" style="color:#1A3DC1">Создано с помощью инструментов Яндекс.Карт</a></div>
<!-- Этот блок кода нужно вставить в ту часть страницы, где вы хотите разместить карту (конец) -->

[moskvin]

Спасибо, так работает.
Правда (не сочтите за занудство) теперь, кажется, не показывается надпись "Загружаюсь".
Так и должно быть?
Илья.

[support]

moskvin (24 Сентябрь 2010 - 18:20) писал:

кажется, не показывается надпись "Загружаюсь".

Видимо карта яндекса закэшировалась браузером и поэтому загружалась практически мгновенно.
В моих тестах сообщение вроде горело пару мгновений

[Frescobaldi]

А как можно добавить поиск в карту от яндекса  http://deka-shop.ru/page/dostavka#

[support]

Думаю для этого достаточно будет скопировать код предложенный яндексом из поля "Ссылка на YMapsML-файл":