Если ваш блог посвящен путешествиям, или туристическому бизнесу, или просто вы хотите показать места, где побывали, то наверняка для демонстрации точного местоположения используете онлайновые картографические сервисы. Одним из самых популярных является Google Maps. Этот сервис для вставки своих карт предлагает использовать ссылки или объекты, внедряемые через iframe. Но дело в том, что в зависимости от роли пользователя, у него может не получиться вставить iframe – редактор его вырежет. Чтобы этого не происходило, можно сделать так, что iframe будет вставляться не при сохранении поста, а при выводе страницы в браузере – с помощью шорткода.
Давайте создадим простейший шорткод для вставки карт Google Maps на страницы блога и в посты. Для этого вставим следующий код в файл functions.php используемой вами темы:
function tp_googlemap($atts, $content = null) {
extract(shortcode_atts(array(
"width" => '960',
"height" => '540',
"slyle" => 'normal',
"src" => ''
), $atts));
return '<div style="gmap-div gmap-style-'.$style.'">
</div>
';
}
add_shortcode("gmap", "tp_googlemap");
В файл style.css используемой вами темы вставим:
.gmap-div {display:block; margin:20px 0; padding:0}
.gmap-style-normal {display:block; margin:20px 0; padding:0}
.gmap-style-left {display:inline-block; margin: 0 0 20px 20px; padding:0; float:left}
.gmap-style-right {display:inline-block; margin: 0 20px 0 20px; padding:0; float:right}
Мы создали шорткод [codei_php]gmap[_php]. Он имеет один обязательный параметр src – ссылку на карту.
[gmap src="ссылка на карту"]
В шорткоде есть еще три параметра, которые использовать не обязательно. Они созданы для того, чтобы задать карте расположение в тексте, а так же ширину и высоту – width, height, style. Если эти параметры не вставлять в шорткод, то будут использоваться значения по умолчанию:
- width – ширина карты в px. По умолчанию равна 960px.
- height – высота карты в px. По умолчанию равна 540px.
- style – параметр, определяющий положение на странице. Может иметь значение normal, left и right. Если выбрать normal, то карта будет располагаться отдельной строкой. Если использовать left или right, то карта будет расположена слева и справа, текст страницы будет ее обтекать.
Пример использования шорткода с параметрами:
[gmap src="ссылка на карту" width="480" height="320" style="right"]
Манипулируя параметрами шорткода, можно добиться наиболее удобного расположения карты на странице.
