Как устанавливать скрипты?

Если уж так хочется пойти именно этим путем. (Но я бы прислушался к Flector)

1. Создайте новый шаблон страницы на базе существующего.
2. Создайте новую страницу на базе этого шаблона.
3. Если это не вызвало у вас трудностей, то вставьте указанный код в файл нового шаблона.

1. В папке с Темой создайте папку: page-templates
2. Создайте там файл шаблона map.php (не забудьте про UTF-8-BOM)
3. В этот шаблон (использовал на основе шаблона Twenty_Fourteen) вставьте этот код:

<?php
/**
 * Template Name: Page Width Map
 *
 * @package WordPress
 * @subpackage Twenty_Fourteen
 * @since Twenty Fourteen 1.0
 */
 
get_header(); ?>
 
<div id="main-content" class="main-content">
 
<?php
    if ( is_front_page() && twentyfourteen_has_featured_posts() ) {
        // Include the featured content template.
        get_template_part( 'featured-content' );
    }
?>
 
    <div id="primary" class="content-area">
        <div id="content" class="site-content" role="main">
            <?php
                // Start the Loop.
                while ( have_posts() ) : the_post();
 
                    // Include the page content template.
                    get_template_part( 'content', 'page' );
 
                    // If comments are open or we have at least one comment, load up the comment template.
                    if ( comments_open() || get_comments_number() ) {
                        comments_template();
                    }
                endwhile;
            ?>
        </div><!-- #content -->
    </div><!-- #primary -->
</div><!-- #main-content -->

	<style>
	  #map_canvas {
		height: 200px;
		margin-right: 20px;
	  }
	</style>
	
	<script async defer src="https://maps.googleapis.com/maps/api/js?key=СЮДА ВСТАВЬТЕ ВАШ KEY&callback=initialize" type="text/javascript"></script>
	<div id="map_canvas"></div>
	<script>
		function initialize () {
			var myLatLng = {lat: 56, lng: 37};
			var map;

			var Options = {
				center: new google.maps.LatLng(56, 37),
				zoom: 8,
				mapTypeId: google.maps.MapTypeId.ROADMAP
			};

			map = new google.maps.Map(document.getElementById("map_canvas"), Options);

			var marker = new google.maps.Marker({
				position: myLatLng,
				map: map,
				title: 'latitude: 56, longitude: 37'
			});
		}
	</script>

<?php
get_footer();

4. Получите KEY для вашей Карты тут: https://developers.google.com/maps/documentation/javascript/get-api-key
5. Вставьте KEY в скрипт вместо «СЮДА ВСТАВЬТЕ ВАШ KEY»
6. Создайте новую страницу
7. Укажите для нее шаблон «Page Width Map»
8. Наслаждайтесь.

Добавил вам вывод метки.

• Ответ изменён 7 лет, 4 месяца назад пользователем wpgear.
• Ответ изменён 7 лет, 4 месяца назад пользователем wpgear.

а консоль говорит, что api ключ не найден.
полагаю из-за пробела в урле с key…