地図関連ページ目次
＊他にもあります。詳しくはトップページや各項目インデックスで…
Googleマップに広告を表示させる = Map Ad Unit サンプル =
〔お断り〕
この「Map Ad Unit」は、2015年11月に廃止になりました。
代替の仕組みについて検討しています。
・ Googleマップに Google AdSense の広告を表示させるには、Map Ad Unit に関するコードを書き足します。・ 表示させる広告の大きさ(フォーマット)や位置、色合い(スタイル)などを様々に変えることができます。このページは、どのように表示されるかのサンプルです。・ 広告の設置方法の解説はこちらにあります。 ▶Map Ad Unitの設置方法へ
《広告の設定に使える大きさ(フォーマット)、位置、スタイル》
007AdFormat.WIDE_SKYSCRAPER,
008AdFormat.VERTICAL_BANNER,
010AdFormat.SMALL_SQUARE,
012AdFormat.SMALL_RECTANGLE,
013AdFormat.MEDIUM_RECTANGLE,
014AdFormat.LARGE_RECTANGLE,
015AdFormat.SMALL_VERTICAL_LINK_UNIT,
016AdFormat.MEDIUM_VERTICAL_LINK_UNIT,
017AdFormat.LARGE_VERTICAL_LINK_UNIT,
018AdFormat.X_LARGE_VERTICAL_LINK_UNIT,
019AdFormat.SMALL_HORIZONTAL_LINK_UNIT,
020AdFormat.LARGE_HORIZONTAL_LINK_UNIT,
025ControlPosition.TOP_CENTER,
026ControlPosition.TOP_LEFT,
027ControlPosition.TOP_RIGHT,
028ControlPosition.RIGHT_TOP,
029ControlPosition.LEFT_TOP,
030ControlPosition.RIGHT_CENTER,
031ControlPosition.LEFT_CENTER,
032ControlPosition.BOTTOM_CENTER,
033ControlPosition.BOTTOM_LEFT,
034ControlPosition.BOTTOM_RIGHT,
035ControlPosition.LEFT_BOTTOM,
036ControlPosition.RIGHT_BOTTOM,
042backgroundColor: '#c4d4f3',
043borderColor: '#e5ecf9',
044titleColor: '#0000cc',
049backgroundColor: '#ffffff',
050borderColor: '#000000',
051titleColor: '#1155cc',
056backgroundColor: '#f5f5f5',
057borderColor: '#cccccc',
058titleColor: '#1155cc',
063backgroundColor: '#f1f1f1',
064borderColor: '#dd4b39',
065titleColor: '#4d90fe',
070backgroundColor: '#eeeeee',
071borderColor: '#666666',
072titleColor: '#333333',
077backgroundColor: '#666666',
078borderColor: '#555555',
079titleColor: '#ffcc00',
084backgroundColor: '#feeeff',
085borderColor: '#d1d1ed',
086titleColor: '#5577ee',
091backgroundColor: '#d6f8ff',
092borderColor: '#89d1ff',
093titleColor: '#3b8aeb',
098backgroundColor: '#f5ffe9',
099borderColor: '#449944',
100titleColor: '#009900',
《Google AdSense を表示させる地図のソース》
05<meta name="viewport" content="width=device-width, initial-scale=1">
06<title>Googleマップ GAdsManager</title>
10function initialize() {
13 center: new google.maps.LatLng(35.681382,139.766084)
15 map = new google.maps.Map(document.getElementById('map-canvas'),
17 var adUnitDiv = document.createElement('div');
19 format: google.maps.adsense.AdFormat.HALF_BANNER,//AdSenseの種類。18種類。
20 position: google.maps.ControlPosition.TOP_CENTER,//表示させる位置。12箇所。
21 /* Maps API default */ // 色を設定。以下5行を書かなければデフォルト。
22 backgroundColor: '#c4d4f3', // 色を設定。
23 borderColor: '#e5ecf9', // 色を設定。
24 titleColor: '#0000cc', // 色を設定。
25 textColor: '#000000', // 色を設定。
26 urlColor: '#009900', // 色を設定。
27 publisherId: 'pub-xxxxxxxxxxxx', //ご自身の GoogleAdSense の IDを記入。
31 var adUnit = new google.maps.adsense.AdUnit(adUnitDiv, adUnitOptions);
33google.maps.event.addDomListener(window, 'load', initialize);
37<div id="map-canvas" style="width: 600px; height: 400px"></div>
地図関連ページ目次
＊他にもあります。詳しくはトップページや各項目インデックスで…
