Как разместить Яндекс.Карту на сайте

Пошаговая инструкция по вставке Яндекс карты на любые сайты. Полезные советы начинающим разработчикам.

Поведения

Карта обладает набором поведений, определяющих реакцию карты на действия, производимые пользователем. Например, при перемещении курсора мыши в области показа при нажатой левой кнопке карта сдвигается вслед за курсором.

При инициализации карты ей присваивается набор поведений, который в дальнейшем можно изменить. Доступ к поведениям карты предоставляется полем .

Собственные поведения определяются с помощью реализации интерфейса IBehavior. Для создания собственного поведения достаточно создать класс и определить его свойства: менеджер опций поведения и менеджер событий. Также необходимо определить методы класса: , , и . Затем класс добавляется в хранилище поведений карты , после чего менеджер поведений создаст экземпляр этого класса — новое поведение.

HTML-карта и ее функции

Sitemap HTML — это статический каталог всех основных разделов сайта, размещенных в соответствии с их иерархией. Проще говоря, это одновременно путеводитель и оглавление сайта.

Чаще всего у HTML-карты древовидная структура, а ссылка на нее размещена в футере сайта:

Основное предназначение карты для пользователей — это визуализация структуры сайта и упрощение навигации.

Роботы при сканированииHTML-карты получают список ссылок на приоритетные страницы сайта (которые вы сами считаете такими), что может ускорить сканирование этих самых страниц.

«Влияет ли HTML карта на SEO? Да, иногда. Без сомнений, это целесообразно, когда с помощью этого файла осуществляют разметку страниц категорий и описаний. Это особенно нужно именно тогда, когда робот не может просканировать сайт нормально. Так что, если на вашем сайте действительно сложная навигация и нет логически выстроенной структуры, то именно HTML-карта позволит Google проанализировать структуру вашего сайта.»

Джон Мюллер, ведущий аналитик Google

Как правильно сформировать HTML-карту сайта?

Три главных принципа, которые лежат в основе построения карты такие:

  1. Простота. У пользователей не должно возникать сложностей в поиске необходимой страницы.
  2. Актуальность. В карте должны быть ссылки только на актуальные для продвижения страницы — никаких ссылок на битые или закрытые от индекса страницы.
  3. Структурированность. Карта должна максимально точно отражать существующую структуру сайта.

Помимо базовых принципов существует ряд правил и рекомендаций, которые необходимо соблюдать при формировании HTML-карт:

  1. Нужно перечислить ссылки на все страницы сайта, которые открыты для индексации. При этом исключив типы страниц с доминирующим количеством в структуре сайта (более 90%). Например, страницы:
  • конкретных товаров;
  • постов;
  • статей;
  • пагинации.

Карта должна регулярно автоматически обновляться. Это позволит поддерживать актуальность списка страниц.

  1. Если карта сайта включает в себя более 150 ссылок, то ее следует реализовывать на многостраничной основе.

Последняя рекомендация подходит большим сайтам со сложной структурой. Также для таких сайтов используют несколько HTML-карт с дополнительным уровнем вложенности. Например, карта сайта Airbnb.

Общая карта со ссылками на другие HTML-карты по странам:

HTML-карта страны, реализованная на многостраничной основе:

  1. Необходимо реализовать визуальное разделение по темам/категориям. Это позволяет улучшить восприятие и упростить навигацию по карте. Например, как на сайте ebay.com или на www.olx.ua.
  1. Ссылки на страницы должны быть расположены в логичной форме и в соответствии с иерархией страниц, то есть: от разделов к категориям, от категорий к подкатегориям. Например, так выглядит карта блога Netpeak — все красиво сортировано по рубрикам.
  1. Следует использовать релевантные ключевые слова для анкоров ссылок — никаких транзакционных ключевых фраз со словами «цена», «купить», «заказать» и прочее.
  1. Ссылку на HTML-карту нужно разместить на всех страницах в футере сайта.

Существует несколько способов создания карты сайта:

  1. Вручную реализовать HTML-документ со всеми необходимыми ссылками — подойдет для опытных пользователей и небольшого сайта.
  2. Воспользоваться сервисом SiteMap Generator. Позволяет сформировать сразу несколько видов карт, но бесплатно — лишь для сайтов до 500 страниц.
  3. Использовать плагины для различных CMS. Например, Dagon Design Sitemap Generator для WordPress удобен, упрощает процесс создания и поддержки пользовательской карты сайта.

Как оформить идеальную HTML-карту сайта

Напоследок, несколько примеров оригинального подхода к оформлению HTML-карт. Смотрите для вдохновения:

1. The New York Times. В карте сайта есть ссылки на статьи за январь 1851 года.

2. IMDb. Чтобы предоставить пользователю максимально точную и при этом лаконичную информацию о том, куда он попадет, к каждой ссылке добавлена небольшая аннотация.

3. Daily Mail. Карта сайта оформлена наглядно, ярко и при этом не нарушает общую стилистику оформления сайта:

Технические вопросы

Как подключить фиксированную версию JavaScript API?

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

Примечание. Со временем мы можем отключить устаревшую JavaScript API. Если вы использовали эту версию в своем проекте, то у вас автоматически подключится последняя версия API.

Как вставить карту в блог, если в нем запрещены скрипты?

Если ваш блогохостинг запрещает использование скриптов, то вставить интерактивную карту с помощью JavaScript API не получится. Для вставки интерактивной карты вы можете воспользоваться . При добавлении Виджета на сайт карта будет размещена в отдельном iframe.

Вы также можете использовать статическое изображение карты. Для получения изображения карты воспользуйтесь Конструктором карт либо Static API.

Я перешел с JavaScript API 2.0 на версию 2.1, но код перестал работать. Есть ли инструкции по переходу?

Версии 2.0 и 2.1 являются обратно несовместимыми. Ознакомьтесь с Руководством по переходу на JavaScript API 2.1.

Можно ли использовать API карт на сайте с CSP?

Можно. Подробнее читайте в документации в разделе .

Я размещаю на сайте карту с помощью JavaScript API, но карта не отображается. Что я делаю не так?

  1. Убедитесь, что при подключении АПИ вы передаете правильный ключ. Если у вас нет ключа, получите его в Кабинете разработчика.
  2. Убедитесь, что при создании экземпляра карты вы указали верный идентификатор DOM-элемента.
  3. Проверьте, заданы ли размеры контейнера, в котором размещается карта (они должны быть ненулевыми).
  4. Карта не отобразится, если на момент ее создания код API еще не был загружен. Чтобы при работе с картой код API был гарантированно загружен, его рекомендуется размещать в функции ymaps.ready(). Подробнее см. в разделе .

Можно ли сохранить состояние карты в URL?

Можно, см. пример.

Как добавить на карту собственный слой?

См. пример.

Почему на моем сайте геолокация перестала работать или стала определять неточное положение?

Вероятнее всего ваш сервис расположен на http-домене. Google запретил определение местоположения средствами браузера на не https-доменах. В этом случае в консоли браузера выводится соответствующая информация: https://sites.google.com/a/chromium.org/dev/Home/chromium-security/deprecating-powerful-features-on-insecure-origins

Я задаю свойства/опции объектам карты, но они не применяются. В чем может быть проблема?

Возможно, вы неправильно используете систему префиксов при задании свойств или опций. Например, чтобы задать свойства для значка метки, нужно использовать префикс ‘icon’ (), чтобы задать свойства для значка кластера, нужно использовать префикс ‘clusterIcon’ (). Кроме того, использование префиксов зависит от того, на каком уровне задаются свойства — через сам объект, через его коллекцию или на уровне карты. Подробнее см. .

Можно ли изменить внешний вид точек маршрута?

Можно. Пример в песочнице: Настройка отображения мультимаршрута.

Почему при использовании кластеризации метки не отображаются на карте?

Возможно, вы добавляете на карту одновременно и кластер, и отдельные метки, входящие в этот кластер. Добавлять нужно только кластер. Подробнее см. .

Я хочу рассчитать площадь полигона/прямоугольника/круга на геодезической поверхности. Есть ли в API специальный инструмент?

Для вычисления геодезической площади фигур можно воспользоваться внешним модулем: https://github.com/yandex/mapsapi-area. Модуль может использоваться совместно с API.

Геокодер возвращает пустой результат или не тот результат, который я хочу увидеть. Что делать в этом случае?

  1. Если вы используете обратное геокодирование, убедитесь, что в запросе указаны координаты в правильной последовательности. По умолчанию Геокодер принимает координаты в последовательности «долгота, широта». Изменить порядок координат можно в параметре .
  2. Убедитесь, что вы указали корректные границы поиска (параметры или ). Возможно, искомый объект находится за пределами заданной области поиска.
  3. Если искомого объекта нет на самой карте Яндекса, вы можете нарисовать его на Народной карте или сообщить об ошибке на странице Яндекс.Карт.

При нажатии на кнопку «Открыть в Яндекс.Картах» пропадает часть маркеров. Почему?

Как добавить компанию на карты Google

Необходимо создать страницу в сервисе Google Мой бизнес.

Что это даёт? В первую очередь — возможности:

  • информировать пользователей о ценах, времени работы, событиях и новостях организации;
  • следить за отзывами и быстро реагировать на них;
  • анализировать просмотры информации о бизнесе (количество просмотров данных о компании, просмотры фото, видеозаписей);
  • прикреплять карты с маршрутом к организации;
  • укреплять репутацию благодаря оценкам пользователей.

Блок Google Мой Бизнес в поисковой выдаче

Алгоритм добавления компании.

1. Зайдите на сайт Google Мой бизнес и нажмите «Добавить данные о компании в Google».

2. Войдите в существующий или зарегистрируйте новый аккаунт Google.

3. На открывшейся странице в поле «Название» укажите полное название своей организации:

  • если в выпадающем списке вы нашли свою компанию, выберите её (все остальные данные подтянутся) и нажмите «Продолжить»;
  • если вашей компании нет в списке, нажмите «Далее» и заполните все поля.

4. Добавьте данные о территории обслуживания:

5. Выберите категорию, которая наиболее точно описывает вашу деятельность:

6. Заполните контактную информацию (можно зарегистрировать даже те компании, у которых нет собственного сайта):

7. Проверьте все введенные данные и подтвердите создание аккаунта Google Мой Бизнес:

8. Далее появится форма подтверждения компании через почту.

На указанный физический почтовый адрес будет отправлено письмо с кодом для подтверждения. Письмо приходит обычно через 1-2 недели после подачи заявки.

Если вы не получите письмо в течение 3-4 недель, смело пишите в техподдержку: «Письмо не пришло, что мне делать?». Google предложит пройти процедуру подтверждения вручную.

Для этого нужно будет отправить несколько фотографий:

9. После этого вы попадете в личный кабинет своей компании:

На странице «Информация» необходимо предоставить наиболее полную информацию о вашей компании:

  • добавьте дополнительные категории, которые соответствуют вашей деятельности;
  • добавьте описание вашей компании;
  • укажите часы работы;
  • способы оплаты товаров и услуг;
  • добавьте фотографии и видео;
  • а также дополнительные сведения.

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

Чем полнее и качественнее будет представлена информация о вашей компании, тем больше вероятность, что её увидят пользователи Google.

Узнайте новые и полезные лайфхаки интернет-маркетинга — подпишитесь на рассылку блога:

Наши подписчики всегда получают больше.

Параметры загрузки API

Для бесплатной версии API ссылка для загрузки имеет вид:

Для платной версии API ссылка имеет вид:

В таблице ниже описаны параметры, которые можно указать при загрузке API.

Параметр Описание
* Обязательный параметр.»}}»>* Обязательный параметр.

API-ключ. Получить ключ можно в Кабинете разработчика.

* Обязательный параметр.

«}}»>*

Обязательный параметр.

Локаль. Задается в виде:

  • language — двузначный код языка. Указывается в формате ISO 639-1. Задает язык объектов на карте (топонимов, элементов управления).
  • region — двузначный код страны. Указывается в формате ISO 3166-1. Определяет региональные особенности, например единицу измерения (для обозначения расстояния между объектами или скорости движения по маршруту).
    Примечание. Для регионов , и расстояние показывается в километрах, для — в милях.

На данный момент поддерживаются следующие локали:

  • ;
  • ;
  • ;
  • ;
  • ;
  • .
coordorder Порядок задания географических координат при работе API.

Возможные значения:

  • —  — используется по умолчанию;
  • — .
load Список загружаемых модулей.

Имена модулей перечисляются через запятую. Например, .

По умолчанию загружаются все компоненты API (), однако в целях минимизации объема трафика, передаваемого клиентскому приложению, вы можете указать список конкретных сущностей API, с которыми работает ваше приложение.

Примечание. package.full оптимизирован таким образом, чтобы подгружать функциональность в момент ее фактического использования, поэтому в большинстве случаев нет необходимости настраивать параметр .

Компоненты также можно загружать «по требованию», используя функцию require.

Значение по умолчанию: .

mode Режим загрузки API.

Код API может быть загружен в упакованном виде для минимизации трафика и скорости исполнения в браузере (), а также в виде исходного кода ().

Загрузка в виде исходного кода удобна для отладки JavaScript-компонентов — код всех загруженных компонентов доступен для просмотра. Кроме того, в этом режиме в консоль выводятся сообщения об ошибках и исключениях. При загрузке в упакованном виде эти сообщения не выводятся.

Значение по умолчанию: .

csp Включает режим использования CSP. Может принимать значение true. Подробнее см. .
ns Пространство имен, в котором локализованы программные компоненты API.

По умолчанию все объекты принадлежат пространству имен (например, ymaps.Map). Если при загрузке API указать , то объекты будут доступны уже как .Map.

Использование пространства имен позволяет избежать пересечения названий функций и прочих программных компонентов, используемых в API и пользовательском/стороннем коде.

Вы можете задать пустое значение ns. В этом случае API не будет создавать объектов в глобальной области видимости, и доступ к функциональности API получит только функция, указанная в параметре .

Значение по умолчанию: .

onload Имя функции, которую необходимо вызвать после того, как компоненты API будут загружены и готовы к использованию (callback). В эту функцию в качестве аргумента будет передан объект-неймспейс с функциональностью API.

Допускается использование вложенных пространств имен:

Пример использования приведен в ниже.

onerror Имя callback-функции, которая будет вызвана в случае ошибки загрузки API. В эту функцию в качестве аргумента будет передан объект, содержащий информацию об ошибке.

Задание стиля метки

API предоставляет возможность выбрать стиль для значка метки из набора встроенных стилей. С помощью стилей задается цвет значка метки, а также его тип (например, значок без содержимого или значок, растягивающийся под контент).

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

Примечание. Стилем по умолчанию является .

В качестве значка метки можно использовать также собственное изображение. Для этого необходимо в опции указать URL графического файла значка. При необходимости можно указать опции и — размер изображения и его сдвиг относительно точки привязки соответственно.

Если же на карту необходимо добавить большое число меток с разными пользовательскими значками, то целесообразно использовать технологию CSS спрайтов. Суть технологии заключается в том, что все изображения объединяются в одном графическом файле — спрайте. Посредством CSS нужное изображение извлекается из спрайта и устанавливается в качестве значка определенной метки.

Ниже приведен пример спрайта, содержащего три изображения:

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

  • — позиция нужного изображения в спрайте. Определяется пиксельными координатами левого верхнего и правого нижнего углов прямоугольника, в котором размещается изображение.
  • — URL спрайта;

При необходимости можно указать опции и .

Примечание. С помощью спрайтов можно задавать изображения также и для других объектов, добавляемых на карту (например, для кластеров или элементов управления).

Использование технологии спрайтов позволяет сократить число HTTP-запросов к серверу, так как вместо большого числа изображений загружается только одно.

Способ добавить Google карту на сайт № 3

Не поверите, есть еще и 3-й способ размещения Google карты на Вордпресс сайте без плагина.

Правда эта карта будет несколько отличатся от предыдущих. Чем? Тем, что ее можно редактировать. Можно изменять, задавать своим метки (маркеры) со своими названиями и описаниями.

Вбиваем интересующий город или адрес.

Возле блока с поиском вы увидите инструменты, с помощью которых можно редактировать карту:

Первая кнопка (из выделенных) – маркер, позволяет создать точку на карте с возможностью задать название и описание:

Это более чем существенное преимущество по сравнению с предыдущими вариантами.

Вторая кнопка – выделение области:

3 – я кнопка – добавление маршрута.

Прежде чем добавлять карту на сайт, необходимо нажать кнопку «поделиться», расположенную в правой верхней части экрана. И задать название для ново созданной карты:

Измените уровень доступа на «общедоступный в интернете»:

Осталось дело за малым: необходимо получить код Google карты, сделать это можно нажав на значок папки:

После чего, копируем из всплывшего окошка код карты и вставляем на свой сайт, в результате получаем следующее:
Фух…пожалуй на этом все, добавление Яндекс карты я распишу ближе к вечеру, а статья про плагины Яндекс и Google карт будет завтра.

Коллекции геообъектов

Геообъекты могут объединяться в коллекции, которые позволяют определять свойства сразу всех своих членов и проводить групповые операции над ними.

В API Яндекс.Карт реализовано два вида коллекций: упорядоченные (GeoObjectArray) и неупорядоченные (GeoObjectCollection). Первые реализованы на основе массивов, вторые — на основе двусвязных списков.

Геообъект может принадлежать только одной коллекции. При добавлении геообъекта, принадлежащего одной коллекции, в другую коллекцию, он будет удален из первой.

При реализации собственных коллекций на основе этих классов рекомендуется использовать неупорядоченные коллекции во всех случаях, когда нет необходимости обращаться к элементу по порядковому номеру. Удаление элементов из неупорядоченной коллекции производится значительно быстрее, чем из упорядоченной.

Способ вставить Google карту на сайт № 2

Не знаю по какой причине, но Гугл карты доступны по двум разным адресам (URL) и имеют несколько отличающийся интерфейс.

Как бы там ни было, рассмотрим добавление Гугл карт альтернативным способом.

Ищем в поиске интересующий дом или объект.

Слева есть блок с кнопками:

Нажимаем кнопку, выделенную красным (скриншот выше), а далее все просто: появится блок, в котором будет размещен html-код, который нужно скопировать и добавить на сайт. Процесс добавления аналогичен тому, что я описал в начале статьи.

Само собой можно задать маршрут:

В итоге получился такой результат:

width=»425″ – изменяет значение в кавычках, для указания нужное ширины.

height=»350″ – высота.

Если вдруг встанет необходимость разместить блок с картой посредине (выравнивание по центру), то для этого достаточно заключить код с картой в теги

код карты…

Готовность API

Компоненты API Яндекс.Карт всегда загружаются асинхронно. Это происходит даже в том случае, если для подключения API используется тег и никаких специальных действий для асинхронной загрузки не производилось.

Чтобы быть уверенным, что компоненты загружены и готовы к использованию, необходимо использовать функцию ready или параметр загрузки .

Возникновение событий загрузки DOM-дерева или документа не сигнализирует об окончании загрузки API. То есть использование обработчиков событий типа , , и пр. не позволяет определить, готовы ли компоненты для использования.

Для инициализации карты необходимо, чтобы в DOM-дереве находился элемент, в котором она размещается.

Функция ready исполняет включенный в нее код после того, как будет загружены компоненты API и DOM-дерево документа.

Функция, переданная в параметр onload вызывается после загрузки API, но не отслеживает готовность DOM-дерева. В этом случае отслеживать доступность HTML-элемента, в который помещается карта, необходимо самостоятельно. Например, при помощи обработчиков событий, перечисленных выше.

Кластеры

Точечные геообъекты могут находиться настолько близко друг другу, что на каком-то масштабе их метки начинают накладываться друг на друга. В этом случае пользователю приходится тщательно «прицеливаться», чтобы попасть курсором мыши на видимый фрагмент нужной метки. Существует даже специальный термин, описывающий эффекты такого рода — pixel hunting (пиксель-хантинг).

Если метки находятся в одной точке и размеры их иконок совпадают, то наведение на перекрытые метки невозможно в принципе.

Стандартным способом решения проблемы является объединение близко расположенных объектов в группу (кластер) и использование для группы специальной кластерной иконки. Часто на иконке кластера указывается число содержащихся в нем элементов.

Для кластеризации объектов в API Яндекс.Карт используется класс Clusterer.

При увеличении масштаба кластер визуально распадается на отдельные метки и/или другие кластеры.

При щелчке на иконке кластера может произойти либо увеличение коэффициента масштабирования либо открытие балуна, в котором будет отображен список геообъектов кластера. Это поведение контролируется с помощью опции (true/false).

Примечание. Если при отображении кластера коэффициент масштабирования карты является максимальным, то кластер не будет распадаться на отдельные метки при щелчке на его маркере. В этом случае независимо от значения параметра всегда будет открываться балун.

Таким образом, отобразить информацию о близко расположенных геообъектах можно даже в том случае, если их метки накладываются друг на друга при максимальном коэффициенте масштабирования.

Использование кластеризатора позволяет значительно увеличить производительность при отображении большого количества геообъектов в браузере.

Отрисовка и обработка геообъекта — дорогостоящая с точки зрения потребления ресурсов операция, и чем больше объектов кластеризуется, тем больше ресурсов экономится. Сильное снижение производительности наблюдается уже при отображении нескольких сотен объектов без кластеризации.

Как разместить Google карту на сайт без плагина

С помощью данного метода можно добавить Google карту как на WordPress, так и на сайт, созданный с помощью любого другого движка, либо вовсе без его использования.

Первым делом, что необходимо сделать — это зайти на страничку сервиса Google maps:

И задать интересующий адрес в поиске:

Далее необходимо зайти в раздел настройки (шестеренка) и нажать «поделиться».

В открывшемся окне нужно перейти во вкладку «Код»:

Предварительно задайте необходимое масштабирование.

Осталось скопировать выделенный на скриншоте выше код карты и вставить его в соответствующее место на сайте.

Слева от выделенного фрагмента есть вкладка, где можно выбрать размер карты. Есть 4 варианта: маленькая, средняя и большая. Так же можно задать любой другой размер в пикселях, в зависимости от верстки сайта, что позволит подстроить размеры карты под любой сайт. В дальнейшем его можно будет поменять, поэтому если сразу не задали длину и ширину – не беда.

При вставке кода в WordPress запись или на страницу, обязательно переключитесь в режим «Текст», так как в визуальном редакторе вставить карту не получится.

Так же можно добавить Google карту в виджет WordPress, достаточно просто вставить нужный код с помощью «произвольного текста».

Обратите внимание на подчеркнутые строчки. Width – это ширина

Width – это ширина

Height – это высота.

Изменив эти параметры вы с легкостью сможете настроить нужные размеры карты для вашего сайта, если не задали их в предварительном форматировании.

В итоге получилось следующее:

Вот такая Google карта будет у вас на сайте, если следовать инструкции.

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

Есть еще очень много настроек, которых можно задать для карты:

Сделать карту-спутник:

Можно указать маршрут от одного места до другого.

Для этого необходимо указать место отправления и место прибытия.

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

Так же можно настроить отображение пробок, нажав на кнопку выделенную на скрине ниже.

Можно выбрать определенную точку на карте – маркер. Это может быть полезно, если необходимо указать адрес компании или организации.

Делается это двумя способами: либо указать в поиске полный адрес, либо кликом мыши.

Балун и хинт

На карте может быть отображен один балун (всплывающее окно) и один хинт (подсказка).

Балун и хинт отображаются в точке с заданными координатами, а их содержимое может содержать HTML-разметку. Ссылки на экземпляры классов балуна и хинта карты содержатся в полях и объекта карты.

Доступ к балуну и хинту карты имеют геообъекты и активные области. То есть балун/хинт может быть открыт над геообъектом или активной областью без непосредственного указания координат балуна/хинта.

Если в момент открытия балуна на карте уже есть открытый балун, то старый балун закрывается, и открывается новый. То же самое относится и к хинту.

Внешний вид балуна и хинта удобно настраивать с помощью или шаблонов.

Примечание

Обратите внимание, открытие балуна и хинта является асинхронной операцией, методы возвращают объекты Promise

Возможна ситуация, что балун выходит за границы карты. В таком случае балуну нужно задать дополнительно опцию :

Иллюстрация примера Пример
Скопировано
Рейтинг
( Пока оценок нет )
Понравилась статья? Поделиться с друзьями:
HOSTBOARD.RU
Добавить комментарий