Сделаем функционал привязки записи (любого типа) к картам Google или Yandex. Это может быть востребовано для контактов дилерских центров, филиалов и т.п. Это статья является как бы вступительной теоретической. Более практическая статья по данному функционалу здесь.

Создание контентной части

Создадим новый тип записей city. Мы будем создавать под каждый город отдельную страницу это и удобно в использовании и для SEO хорошо.

// Добавляем произвольный тип записей
add_action( 'init', 'register_post_type_city' ); // Использовать функцию только внутри хука init
 
function register_post_type_city() {
	$labels = array(
	    'name' => 'Где купить',
	    'singular_name' => 'Sity', // админ панель Добавить->Функцию
		'add_new' => 'Добавить город',
		'add_new_item' => 'Добавить новый город', // заголовок тега <?title>
		'edit_item' => 'Редактировать город',
		'new_item' => 'Новый город',
		'all_items' => 'Все города',
		'view_item' => 'Просмотр страницы города на сайте',
		'search_items' => 'Искать город',
		'not_found' =>  'Город не найден.',
		'not_found_in_trash' => 'В корзине нет города.',
		'menu_name' => 'Где купить' // ссылка в меню в админке
	);
	$args = array(
		'labels' => $labels,
		'public' => true,
		'show_ui' => true, // показывать интерфейс в админке
		'has_archive' => true, // показывать страницу архива данного типа записей
		'menu_icon' => 'dashicons-location-alt', // иконка dashicons в меню
		'menu_position' => 20, // порядок в меню
		'supports' => array( 'title', 'editor', 'comments', 'author', 'thumbnail'),
	    'taxonomies' => array('post_tag') // добавляем поддержку стандартных таксономий 'post_tag', 'category', либо пользовательскую 'album' (через запятую)
	);
	register_post_type('city', $args);
}


// Тексты уведомлений для типа постов
add_filter( 'post_updated_messages', 'true_post_type_messages_city' );
 
function true_post_type_messages_city( $messages ) {
	global $post, $post_ID;
 
	$messages['city'] = array( // city - название созданного нами типа записей
		0 => '', // Данный индекс не используется.
		1 => sprintf( 'Город обновлен. <?a href="%s">Просмотр<?/a>', esc_url( get_permalink($post_ID) ) ),
		2 => 'Город обновлён.',
		3 => 'Город удалён.',
		4 => 'Город обновлен.',
		5 => isset($_GET['revision']) ? sprintf( 'Город восстановлен из редакции: %s', wp_post_revision_title( (int) $_GET['revision'], false ) ) : false,
		6 => sprintf( 'Город опубликован на сайте. <?a href="%s">Просмотр<?/a>', esc_url( get_permalink($post_ID) ) ),
		7 => 'Город сохранен.',
		8 => sprintf( 'Отправлен на проверку. <?a target="_blank" href="%s">Просмотр<?/a>', esc_url( add_query_arg( 'preview', 'true', get_permalink($post_ID) ) ) ),
		9 => sprintf( 'Запланирован на публикацию: <?strong>%1$s<?/strong>. <?a target="_blank" href="%2$s">Просмотр<?/a>', date_i18n( __( 'M j, Y @ G:i' ), strtotime( $post->post_date ) ), esc_url( get_permalink($post_ID) ) ),
		10 => sprintf( 'Черновик обновлён. <?a target="_blank" href="%s">Просмотр<?/a>', esc_url( add_query_arg( 'preview', 'true', get_permalink($post_ID) ) ) ),
	);
 
	return $messages;
}


// Произвольные поля для пользовательского типа записей
function true_custom_fields_city() {
add_post_type_support( 'city', 'custom-fields'); // в качестве первого параметра укажите название типа поста
}
 
add_action('init', 'true_custom_fields_city');

Создаем шаблоны архива записей city и отдельной записи city — archive-city.php и single-city.php соответственно.

Создавая запись называем ее по названию города, а в теле записи будем прописывать шорткод с указанием конкретных точек. Для этого будем использовать плагин Oi Yandex.Maps for WordPress (9000+). Синтаксис шорткода следующий:

[showyamap zoom="12" placemark="islands#darkBlueDotIcon"]
	[placemark address="г. Ростов-на-Дону, ул. Текучева 368А" body="г. Ростов-на-Дону, ул. Текучева 368А"]
	[placemark address="г. Ростов-на-Дону, ул. Белорусская, 211А" ]
	[placemark address="г. Ростов-на-Дону г, пер. Певчий, 4"]	
[/showyamap]

zoom — это масштаб карты, placemark — это вариант значка (иконки) точки на карте. body, header, footer — это информация при нажатии на точку.

Таким образом на странице конкретного города будет выводиться карта с точками.

Варианты значков (иконок) на карте

Метки с текстом:
islands#blueIcon
islands#darkGreenIcon
islands#redIcon
islands#violetIcon
islands#darkOrangeIcon
islands#blackIcon
islands#nightIcon
islands#yellowIcon
islands#darkBlueIcon
islands#greenIcon
islands#pinkIcon
islands#orangeIcon
islands#grayIcon
islands#lightBlueIcon
islands#brownIcon
islands#oliveIcon

Метки с текстом (иконки тянутся под контент)

islands#blueStretchyIcon
islands#darkGreenStretchyIcon
islands#redStretchyIcon
islands#violetStretchyIcon
islands#darkOrangeStretchyIcon
islands#blackStretchyIcon
islands#nightStretchyIcon
islands#yellowStretchyIcon
islands#darkBlueStretchyIcon
islands#greenStretchyIcon
islands#pinkStretchyIcon
islands#orangeStretchyIcon
islands#grayStretchyIcon
islands#lightBlueStretchyIcon
islands#brownStretchyIcon
islands#oliveStretchyIcon

Метки без содержимого с точкой в центре

islands#blueDotIcon
islands#darkGreenDotIcon
islands#redDotIcon
islands#violetDotIcon
islands#darkOrangeDotIcon
islands#blackDotIcon
islands#nightDotIcon
islands#yellowDotIcon
islands#darkBlueDotIcon
islands#greenDotIcon
islands#pinkDotIcon
islands#orangeDotIcon
islands#grayDotIcon
islands#lightBlueDotIcon
islands#brownDotIcon
islands#oliveDotIcon

Метки в виде кругов с текстом

islands#blueCircleIcon
islands#darkGreenCircleIcon
islands#redCircleIcon
islands#violetCircleIcon
islands#darkOrangeCircleIcon
islands#blackCircleIcon
islands#nightCircleIcon
islands#yellowCircleIcon
islands#darkBlueCircleIcon
islands#greenCircleIcon
islands#pinkCircleIcon
islands#orangeCircleIcon
islands#grayCircleIcon
islands#lightBlueCircleIcon
islands#brownCircleIcon
islands#oliveCircleIcon

Метки в виде кругов с точкой в центре

islands#blueCircleDotIcon
islands#darkGreenCircleDotIcon
islands#redCircleDotIcon
islands#violetCircleDotIcon
islands#darkOrangeCircleDotIcon
islands#blackCircleDotIcon
islands#nightCircleDotIcon
islands#yellowCircleDotIcon
islands#darkBlueCircleDotIcon
islands#greenCircleDotIcon
islands#pinkCircleDotIcon
islands#orangeCircleDotIcon
islands#grayCircleDotIcon
islands#lightBlueCircleDotIcon
islands#brownCircleDotIcon
islands#oliveCircleDotIcon

Метки со значком

Ключ для данного типа меток формируется по следующему правилу: ‘islands#{цвет}{значок}Icon’. Например, ‘islands#blueHomeIcon’. Ниже приведен список доступных значков и соответствующих для них ключей. Список доступных цветов можно посмотреть в любой другой таблице.

Значок	Ключ	Значок	Ключ
	‘islands#blueAirportIcon’		‘islands#blueAttentionIcon’
	‘islands#blueAutoIcon’		‘islands#blueBarIcon’
	‘islands#blueBarberIcon’		‘islands#blueBeachIcon’
	‘islands#blueBicycleIcon’		‘islands#blueBicycle2Icon’
	‘islands#blueBookIcon’		‘islands#blueCarWashIcon’
	‘islands#blueChristianIcon’		‘islands#blueCinemaIcon’
	‘islands#blueCircusIcon’		‘islands#blueCourtIcon’
	‘islands#blueDeliveryIcon’		‘islands#blueDiscountIcon’
	‘islands#blueDogIcon’		‘islands#blueEducationIcon’
	‘islands#blueEntertainmentCenterIcon’		‘islands#blueFactoryIcon’
	‘islands#blueFamilyIcon’		‘islands#blueFashionIcon’
	‘islands#blueFoodIcon’		‘islands#blueFuelStationIcon’
	‘islands#blueGardenIcon’		‘islands#blueGovernmentIcon’
	‘islands#blueHeartIcon’		‘islands#blueHomeIcon’
	‘islands#blueHotelIcon’		‘islands#blueHydroIcon’
	‘islands#blueInfoIcon’		‘islands#blueLaundryIcon’
	‘islands#blueLeisureIcon’		‘islands#blueMassTransitIcon’
	‘islands#blueMedicalIcon’		‘islands#blueMoneyIcon’
	‘islands#blueMountainIcon’		‘islands#blueNightClubIcon’
	‘islands#blueObservationIcon’		‘islands#blueParkIcon’
	‘islands#blueParkingIcon’		‘islands#bluePersonIcon’
	‘islands#bluePocketIcon’		‘islands#bluePoolIcon’
	‘islands#bluePostIcon’		‘islands#blueRailwayIcon’
	‘islands#blueRapidTransitIcon’		‘islands#blueRepairShopIcon’
	‘islands#blueRunIcon’		‘islands#blueScienceIcon’
	‘islands#blueShoppingIcon’		‘islands#blueSouvenirsIcon’
	‘islands#blueSportIcon’		‘islands#blueStarIcon’
	‘islands#blueTheaterIcon’		‘islands#blueToiletIcon’
	‘islands#blueUnderpassIcon’		‘islands#blueVegetationIcon’
	‘islands#blueVideoIcon’		‘islands#blueWasteIcon’
	‘islands#blueWaterParkIcon’		‘islands#blueWaterwayIcon’
	‘islands#blueWorshipIcon’		‘islands#blueZooIcon’

Метки в виде круга со значком

Ключ для данного типа меток формируется по следующему правилу: ‘islands#{цвет}{значок}CircleIcon’. Например, ‘islands#blueHomeCircleIcon’. Ниже приведен список доступных значков и соответствующих для них ключей. Список доступных цветов можно посмотреть в любой другой таблице.
islands#blueHomeCircleIcon
islands#blueScienceCircleIcon
islands#blueAirportCircleIcon
islands#blueAttentionCircleIcon
islands#blueAutoCircleIcon
islands#blueBarCircleIcon
islands#blueBarberCircleIcon
islands#blueBeachCircleIcon
islands#blueBicycleCircleIcon
islands#blueBicycle2CircleIcon
islands#blueBookCircleIcon
islands#blueCarWashCircleIcon
islands#blueChristianCircleIcon
islands#blueCinemaCircleIcon
islands#blueCircusCircleIcon
islands#blueCourtCircleIcon
islands#blueDeliveryCircleIcon
islands#blueDiscountCircleIcon
islands#blueDogCircleIcon
islands#blueEducationCircleIcon
islands#blueEntertainmentCenterCircleIcon
islands#blueFactoryCircleIcon
islands#blueFamilyCircleIcon
islands#blueFashionCircleIcon
islands#blueFoodCircleIcon
islands#blueFuelStationCircleIcon
islands#blueGardenCircleIcon
islands#blueGovernmentCircleIcon
islands#blueHeartCircleIcon
islands#blueHomeCircleIcon
islands#blueHotelCircleIcon
islands#blueHydroCircleIcon
islands#blueInfoCircleIcon
islands#blueLaundryCircleIcon
islands#blueLeisureCircleIcon
islands#blueMassTransitCircleIcon
islands#blueMedicalCircleIcon
islands#blueMoneyCircleIcon
islands#blueMountainCircleIcon
islands#blueNightClubCircleIcon
islands#blueObservationCircleIcon
islands#blueParkCircleIcon
islands#blueParkingCircleIcon
islands#bluePersonCircleIcon
islands#bluePocketCircleIcon
islands#bluePoolCircleIcon
islands#bluePostCircleIcon
islands#blueRailwayCircleIcon
islands#blueRapidTransitCircleIcon
islands#blueRepairShopCircleIcon
islands#blueRunCircleIcon
islands#blueScienceCircleIcon
islands#blueShoppingCircleIcon
islands#blueSouvenirsCircleIcon
islands#blueSportCircleIcon
islands#blueStarCircleIcon
islands#blueTheaterCircleIcon
islands#blueToiletCircleIcon
islands#blueUnderpassCircleIcon
islands#blueVegetationCircleIcon
islands#blueVideoCircleIcon
islands#blueWasteCircleIcon
islands#blueWaterParkCircleIcon
islands#blueWaterwayCircleIcon
islands#blueWorshipCircleIcon
islands#blueZooCircleIcon

Пиктограммы

islands#geolocationIcon’

Значки кластеров

islands#blueClusterIcons
islands#invertedBlueClusterIcons
islands#redClusterIcons
islands#invertedRedClusterIcons
islands#darkOrangeClusterIcons
islands#invertedDarkOrangeClusterIcons
islands#nightClusterIcons
islands#invertedNightClusterIcons
islands#darkBlueClusterIcons
islands#invertedDarkBlueClusterIcons
islands#pinkClusterIcons
islands#invertedPinkClusterIcons
islands#grayClusterIcons
islands#invertedGrayClusterIcons
islands#brownClusterIcons
islands#invertedBrownClusterIcons
islands#darkGreenClusterIcons
islands#invertedDarkGreenClusterIcons
islands#violetClusterIcons
islands#invertedVioletClusterIcons
islands#blackClusterIcons
islands#invertedBlackClusterIcons
islands#yellowClusterIcons
islands#invertedYellowClusterIcons
islands#greenClusterIcons
islands#invertedGreenClusterIcons
islands#orangeClusterIcons
islands#invertedOrangeClusterIcons
islands#lightBlueClusterIcons
islands#invertedLightBlueClusterIcons
islands#oliveClusterIcons
islands#invertedOliveClusterIcons

Общая карта городов

В шаблоне archive-city.php выведем все имеющиеся города на карте.

Практика как это реализовать описана в статье Посты — метки на карте

Поделиться в соц. сетях: