| Опубликовать | Tweet |
Сегодняшний пост будет состоять из трех частей, каждая из которых будет про Яндекс. Приступим:
1. Яндекс и Первомай
2. Плюсы Яндекс Директа
3. Установка API Яндекс.Карт на сайт + добавление точек со своим стилем и балуном.
Яндекс и Первомай
К Первому мая Яндекс изменил свой логотип. На этот раз на нем изображена лопата – дерево и добавлена надпись Весна + Труд = Любовь.
+ Яндекс.Директа
Сегодня мне хотелось бы обсудить плюсы контекстной рекламы от Яндекса.
+ Первый плюс – это цена: от 30 копеек за клиента.
+ Если у вас коммерческий сайт, то пользоваться рекламой Яндекса эффективнее.
+ Гораздо проще получить целевой трафик так, чем оплачивая продвижение.
+ Более быстрая эффективность.
+ За размещение такой рекламы сайт точно не забанят.
+ Возможно при размещении рекламы от Яндекса индексация сайта улучшится.
Попасть в Директ не так просто, для этого надо пройти модерацию.
Установка Яндекс.Карт на свой сайт API средствами + добавляем на Яндекс.Карту маркеры с балунами.
Если у вас есть сайт и вы хотите разместить на нем карту, то можно воспользоваться Яндекс.Картами и получить на выходе не статическую карту со своими элементами управления, точками и описаниями.
Сегодня на конкретном примере, который я недавно реализовал при помощи Яндекс.Карт я хотел бы поделиться с вами технологией установки карты средствами JavaScript API, а также навыки работы с геокодером.
Прежде всего представляю вашему вниманию HTML код страницы с размещенной на ней картой:
<head>
<meta http-equiv=”Content-Type” content=”text/html” />
<meta http-equiv=”X-UA-Compatible” content=”IE=7″/>
// Прежде всего подключаем скрипт Карты, в котором после key= вписываем полученный API-ключ: http://api.yandex.ru/maps/form.xml
<script src=”http://api-maps.yandex.ru/1.0/?key=ключ”
type=”text/javascript”></script>
// После этого переходим к построению карты:
<script type=”text/javascript”>
// Создаем карту с центром в Москве:
var map, geoResult;
window.onload = function () {
map = new YMaps.Map(document.getElementById(“YMapsID”));
map.setCenter(new YMaps.GeoPoint(37.64, 55.76), 10);
// Добавляем элементы управления на карту:
map.addControl(new YMaps.TypeControl());
map.addControl(new YMaps.ToolBar());
map.addControl(new YMaps.Zoom());
map.addControl(new YMaps.MiniMap());
map.addControl(new YMaps.ScaleLine());
// Загружаем информацию о точках из специального XML файла и выводим их в виде маркеров на карту:
var ml = new YMaps.YMapsML( ‘http://yazarulem.ru/moiki.xml’ );
map.addOverlay(ml);
}
// Добавляем функцию, которая будет принимать введенный адрес, отправлять запрос геокодеру и показывать его местонахождение на карте если адрес нашелся с помощью балуна:
function showAddress (value) {
map.removeOverlay(geoResult);
var geocoder = new YMaps.Geocoder(value, {results: 1, boundedBy: map.getBounds()});
YMaps.Events.observe(geocoder, geocoder.Events.Load, function () {
if (this.length()) {
geoResult = this.get(0);
map.addOverlay(geoResult);
map.setBounds(geoResult.getBounds());
}else {
alert(“Ничего не найдено”)
}
});
}
</script>
</head>
<body>
// Добавляем в боди форму для поиска:
<form action=”#” onsubmit=”showAddress( this.address.value );return false;”>
<p>
<input id=”address” style=”width:725px;” value=”Москва” />
<input type=”submit” value=”Искать” />
</p>
// Выводим саму карту:
<div id=”YMapsID” style=”height:700px; width:700px;”></div>
</form>
</body>
Более подробно читайте на сайте API Яндекс.Карт.
Содержание XML файла с точками:
// Начинаем XML файл:
<?xml version=”1.0″ encoding=”windows-1251″?>
<ymaps xmlns=”http://maps.yandex.ru/ymaps/1.x” xmlns:gml=”http://www.opengis.net/gml”>
<Representation xmlns=”http://maps.yandex.ru/representation/1.x”>
<View>
<mapType>MAP</mapType>
<gml:boundedBy>
<gml:Envelope>
<gml:upperCorner>37.8 55.85</gml:upperCorner>
<gml:lowerCorner>37.4 55.65</gml:lowerCorner>
</gml:Envelope>
</gml:boundedBy>
</View>
// Создаем стиль для отображения маркера:
<Style gml:id=”styleService”>
<parentStyle>#customIconStyle</parentStyle>
<iconStyle>
<href>http://yazarulem.ru/images/moiki.png</href>
<size x=”19″ y=”29″/>
<offset x=”-11″ y=”-28″/>
</iconStyle>
</Style>
</Representation>
// Вводим данные и стиль точки:
<GeoObjectCollection>
<gml:featureMembers>
<GeoObject id=”gas1″>
<gml:description>Мойка на “Фрунзенской” Тел. +7(926)8209434</gml:description>
<gml:name>Мойка</gml:name>
<gml:Point>
<gml:pos>37.585952 55.726857</gml:pos>
</gml:Point>
<style>#styleService</style>
</GeoObject>
</gml:featureMembers>
</GeoObjectCollection>
</ymaps>
В результате мы получаем полноценную карту с маркерами, которые имеют собственный стиль и информация о которых хранится в отдельном файле, наверное такое решение будет универсальным практически для любого сайта. При установке кода удалите комментарии, потому что они расставлялись уже непосредственно в статье и могут повлиять на корректность работы кода.
Постовой: Кондиционер можно купить в сети.
Посмотреть цены на подержанные автомобили.
Блог “Просто о создании сайтов” проводит акцию по обмену постовыми.
Еще посты по теме!
Yandex News
Яндекс.Деньги: от карт РБР к картам КБ Открытие.
New Wallpapers Pack: Радуга, Звездочки, Котята, Огоньки…
Москва.Фото: Подготовка к 9 Мая, Люди, Слова + HTML в балуне на API Яндекс.Картах и Пополнение В Моем Дизайн Портфолио
Яндекс не дремлит.
Временная лента
Комментарии ( 9 )
[...] я писал о том, как добавить на свой сайт Яндекс.Карты и разместить на них точки со своим стилем и балуном. [...]
Москва.Фото: Подготовка к 9 Мая, Люди, Слова + HTML в балуне на API Яндекс.Картах и Пополнение В Моем Дизайн Портфолио - ON Life added these pithy words on May 04 09 at 11:34Честно сказать, начал читать статью об одном, а закончил непонятно чем. Мое мнение – нужно было сделать три отдельных статьи. Стало интересно про первомай в Яндеске, а тут на тебе какието Яндекс.карты
g1obus added these pithy words on
May 16 09 at
23:18
Изначально и должно было быть три отдельных статьи, но потом я решил что Я будет слишком жирно)
admin added these pithy words on
May 17 09 at
01:40
А с АПИ директа не сталкивались? Я сейчас его разбираю…
Seoed added these pithy words on
Nov 19 09 at
23:40
Seoed, буду рад гостевому посту в таком случае на эту тему
admin added these pithy words on
Nov 20 09 at
17:03
Гостевой пост – это пост в мой блог другого автора с указанием ссылки на его ресурс, в данном случае блог.
Включает в себя уникальный контент по тематике моего блога и затрагивающий интересы блога гостя.
Приносит профит как мне – новый свежий контент, так и автору поста – ссылка на блог с тематического ресурса и тематической статьи.
admin added these pithy words on
Nov 21 09 at
01:50
Хорошо, мне на одном из форумов дали дельный совет, до чего то сам дошел, как этот АПИ Яндекса устроен. Доразберусь тогда и напишу что там получилось в результате
Seoed added these pithy words on
Nov 21 09 at
15:55
