1
Добавление кода js на одну страницу
Автор moskvin, 17 сент. 2010 19:52
Сообщений в теме: 10
#1
Отправлено 17 Сентябрь 2010 - 19:52
Здравствуйте!
Помогите, пожалуйста, неспециалисту (но готовому учиться человеку)
Хочется на страницу "Доставка" добавить код js, загружающий схему проезда yandex-карт.
Вот ссылка на сервис: http://api.yandex.ru...ls/constructor/
Если код добавлять в файлы "HTML" или "Страница" с помощью редактора шаблона, то это отразится на всех страницах, а требуется только для конкретной.
А в редакторе страницы код java-script, насколько я понял, вставлять нельзя.
Какой правильный путь?
Илья.
Помогите, пожалуйста, неспециалисту (но готовому учиться человеку)
Хочется на страницу "Доставка" добавить код js, загружающий схему проезда yandex-карт.
Вот ссылка на сервис: http://api.yandex.ru...ls/constructor/
Если код добавлять в файлы "HTML" или "Страница" с помощью редактора шаблона, то это отразится на всех страницах, а требуется только для конкретной.
А в редакторе страницы код java-script, насколько я понял, вставлять нельзя.
Какой правильный путь?
Илья.
#2
Отправлено 20 Сентябрь 2010 - 08:13
moskvin (17 Сентябрь 2010 - 19:52) писал:
Здравствуйте!
Помогите, пожалуйста, неспециалисту (но готовому учиться человеку)
Хочется на страницу "Доставка" добавить код js, загружающий схему проезда yandex-карт.
Вот ссылка на сервис: http://api.yandex.ru...ls/constructor/
Если код добавлять в файлы "HTML" или "Страница" с помощью редактора шаблона, то это отразится на всех страницах, а требуется только для конкретной.
А в редакторе страницы код java-script, насколько я понял, вставлять нельзя.
Какой правильный путь?
Илья.
Помогите, пожалуйста, неспециалисту (но готовому учиться человеку)
Хочется на страницу "Доставка" добавить код js, загружающий схему проезда yandex-карт.
Вот ссылка на сервис: http://api.yandex.ru...ls/constructor/
Если код добавлять в файлы "HTML" или "Страница" с помощью редактора шаблона, то это отразится на всех страницах, а требуется только для конкретной.
А в редакторе страницы код java-script, насколько я понял, вставлять нельзя.
Какой правильный путь?
Илья.
Доставка отображается в 2х местах:
- контент страница (Панель управления магазином -> вкладка "Сайт" -> пункт меню "Страницы" -> там страница доставки)
- при оформлении заказа (Настройка производится во вкладке "Настройки" -> "Доставка" -> нужный вариант доставки. Отображение производится в файле "товар" и в файле "Оформление заказа" расположенными в редакторе тем, вкладка "Сайт")
1) Чтобы изменить контент-страницу откройте её. В визуальном редакторе нажмите самую нижнюю, правую иконку с названием "HTML". Появится исходный код, там вставьте нужный код карты.
2) Чтобы изменить информацию в оформлении заказа, нужно отредактировать html файл, в редакторе тем, "Оформление заказа". Там прописать нужный код в соответствующем блоке и все заработает. Хотя конечно же логичней информацию по доставке размещать на странице доставки до момента оформления заказа, т.е. как указано выше, в первом варианте.
#3
Отправлено 20 Сентябрь 2010 - 14:37
support (20 Сентябрь 2010 - 08:13) писал:
Здравствуйте, Илья!
Доставка отображается в 2х местах:
- контент страница (Панель управления магазином -> вкладка "Сайт" -> пункт меню "Страницы" -> там страница доставки)
- при оформлении заказа (Настройка производится во вкладке "Настройки" -> "Доставка" -> нужный вариант доставки. Отображение производится в файле "товар" и в файле "Оформление заказа" расположенными в редакторе тем, вкладка "Сайт")
1) Чтобы изменить контент-страницу откройте её. В визуальном редакторе нажмите самую нижнюю, правую иконку с названием "HTML". Появится исходный код, там вставьте нужный код карты.
2) Чтобы изменить информацию в оформлении заказа, нужно отредактировать html файл, в редакторе тем, "Оформление заказа". Там прописать нужный код в соответствующем блоке и все заработает. Хотя конечно же логичней информацию по доставке размещать на странице доставки до момента оформления заказа, т.е. как указано выше, в первом варианте.
Доставка отображается в 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>
<!-- Этот блок кода нужно вставить в ту часть страницы, где вы хотите разместить карту (конец) -->
#4
Отправлено 21 Сентябрь 2010 - 13:22
Разобрались в чем проблема. wysiwyg редактор, который мы используем по какой-то причине удаляет пустой див
и поэтому карта не отображается. Это опенсурс проект, мы его периодически обновляем, но видимо они не считают удаление пустых тегов ошибкой. Для того чтобы сейчас код яндекса начал вставляться достаточно вставить пробел в этот див или любой печатный символ. (Пробел в html пишется как " ")
Вместо вышеуказанного кода получится:
Можно вставить что-то типа "карта загружается..." или "Загружаюсь...", тогда получится:
Далее можно сделать еще такое преобразование для магазина - убрать отображение этого блока для пользователей, у которых не подключен javascript.
Итоговый код у нас получился таким:
Вставляйте его на любую контент-страницу вашего интернет магазина, проблем не возникнет.
moskvin (20 Сентябрь 2010 - 14:37) писал:
<div id="YMapsID-5250" style="width:450px;height:350px"></div>
Вместо вышеуказанного кода получится:
<div id="YMapsID-5250" style="width:450px;height:350px"> </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> <!-- Этот блок кода нужно вставить в ту часть страницы, где вы хотите разместить карту (конец) -->
Вставляйте его на любую контент-страницу вашего интернет магазина, проблем не возникнет.
#5
Отправлено 22 Сентябрь 2010 - 13:38
Спасибо, с непустым div все работает.
Однако при добавлении свойства "display:none" карта не загружается.
Браузеры Google Chrome 6.0.472.62 и IE 8.0.
Однако при добавлении свойства "display:none" карта не загружается.
Браузеры Google Chrome 6.0.472.62 и IE 8.0.
#6
Отправлено 22 Сентябрь 2010 - 16:20
moskvin (22 Сентябрь 2010 - 13:38) писал:
Спасибо, с непустым div все работает.
Однако при добавлении свойства "display:none" карта не загружается.
Браузеры Google Chrome 6.0.472.62 и IE 8.0.
Однако при добавлении свойства "display:none" карта не загружается.
Браузеры Google Chrome 6.0.472.62 и IE 8.0.
#7
Отправлено 22 Сентябрь 2010 - 23:48
Да, действительно что-то не пашет...
Можно сделать тогда следующее, для пользователей без яваскрипта:
оставить свойство display:none и добавить дополнительный яваскрипт код, делающий карту видимой.
В целом код тогда получится такой:
Можно сделать тогда следующее, для пользователей без яваскрипта:
оставить свойство 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> <!-- Этот блок кода нужно вставить в ту часть страницы, где вы хотите разместить карту (конец) -->
#8
Отправлено 24 Сентябрь 2010 - 18:20
Спасибо, так работает.
Правда (не сочтите за занудство) теперь, кажется, не показывается надпись "Загружаюсь".
Так и должно быть?
Илья.
Правда (не сочтите за занудство) теперь, кажется, не показывается надпись "Загружаюсь".
Так и должно быть?
Илья.
#10
Отправлено 09 Февраль 2011 - 14:52
А как можно добавить поиск в карту от яндекса http://deka-shop.ru/page/dostavka#
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных