質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Q&A

解決済

1回答

228閲覧

プラグインの修正がうまくいかない

退会済みユーザー

退会済みユーザー

総合スコア0

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

0グッド

0クリップ

投稿2017/12/26 08:01

編集2017/12/26 15:52

wordpressのプラグイン「TCD Google Maps」を
1ページにいくつも地図が表示できるように
こちらのサイトを参考に修正を試みているのですが、リンク先の問題点2として挙げられているJavascriptのエラーが直らず困っております。

javascriptが1回だけ読み込まれるようにしたいのですが
下記コードの1、2、は3のどこに入れればよいのでしょう、、
ファイルが読み込まれる前と思い
function tcd_script_enqueue()の前に1と2を挿入したのですがうまくいきません・・・
どうかお教えいただけませんでしょうか。。。宜しくお願い致します。。。

1、地図の出現数をカウントし1以上ならscriptタグを読み込まないようにする

php

1$obj = TcdCount::getInstance(); 2if($obj->count() > 1) { 3$script = ""; 4}

2、地図の出現数をカウントするシングルトンクラスを追加する

php

1class TcdCount { 2private static $uniqueInstance; 3private $count = 0; 4private function __construct() { 5} 6public static function getInstance() { 7if ( ! isset( static::$uniqueInstance ) ) { 8static::$uniqueInstance = new TcdCount(); 9} 10return static::$uniqueInstance; 11} 12public function count() { 13$this->count = $this->count + 1; 14return $this->count; 15} 16}

3、修正したいファイル

php

1<?php 2function tcd_script_enqueue() { 3 wp_enqueue_script('jquery-ui-core'); 4 wp_enqueue_script('jquery-ui-slider'); 5 6 wp_enqueue_script('google-maps', 'https://maps.googleapis.com/maps/api/js'); 7 wp_enqueue_script('angular', plugins_url('angular.js', __FILE__)); 8 wp_enqueue_script('angular-slider', plugins_url('angular-slider.js', __FILE__)); 9 10 wp_register_style('custom_wp_admin_css', plugins_url('admin.css', __FILE__), false, '1.0.0'); 11 wp_enqueue_style('custom_wp_admin_css'); 12 13 wp_register_style('jquery-ui', plugins_url('jquery-ui.css', __FILE__), false, '1.0.0'); 14 wp_enqueue_style('jquery-ui'); 15} 16 17add_action('admin_enqueue_scripts', 'tcd_script_enqueue'); 18 19 20 21 22 23load_plugin_textdomain( 'tcd-google-maps', false, basename( dirname( __FILE__ ) ) . '/languages' ); 24 25function tcd_add_google_js_css() { 26 // wp_enqueue_script('google-maps', 'https://maps.googleapis.com/maps/api/js'); 27 wp_enqueue_style('tcd-maps', plugins_url("admin.css", __FILE__)); 28} 29 30add_action('wp_enqueue_scripts', 'tcd_add_google_js_css'); 31 32function tcd_map_shortcode($opts){ 33 $mapId = (int)"map." + rand(100000, 999999); 34 35 $address = @$opts['address']; 36 $draggable = @$opts['draggable']; 37 $controls = @$opts['controls']; 38 $class = @$opts['class']; 39 40 if( isset($opts['style']) ){ 41 $style = $opts['style']; 42 } else { 43 $style = ''; 44 } 45 $width = @$opts['width']; 46 $zoom = ($opts['zoom'] ? $opts['zoom'] : '18'); 47 $height = ($opts['height'] ? $opts['height'] : '400px'); 48 $api = ($opts['api'] ? '?key=' . $opts['api'] : ''); 49 50 if( $opts['theme'] == "black" ){ 51} else { 52 $theme = '[]'; 53 } 54 55 56 if( 57 !wp_script_is( 'gmap', 'enqueued' ) && 58 !wp_script_is( 'gmaps', 'enqueued' ) && 59 !wp_script_is( 'g-map', 'enqueued' ) && 60 !wp_script_is( 'g-maps', 'enqueued' ) && 61 !wp_script_is( 'googlemap', 'enqueued' ) && 62 !wp_script_is( 'googlemaps', 'enqueued' ) && 63 !wp_script_is( 'google-map', 'enqueued' ) && 64 !wp_script_is( 'google-maps', 'enqueued' ) 65 ){ 66 $script = "<script src='https://maps.googleapis.com/maps/api/js$api' async defer></script>"; 67 } else { 68 $script = ""; 69 } 70 71 $map = <<<EOT 72 $script 73 74 <div id="$mapId" class="dp-google-map $class" style="height:$height; width:$width; $style"></div> 75 76<script type="text/javascript"> 77var loaded_$mapId = false 78setInterval(function(){ 79if( google && !loaded_$mapId ){ 80loaded_$mapId = true 81 82 // google.maps.event.addDomListener(window, 'load', function(){ 83 // }) 84 var disabled = $controls ? false : true 85 var draggable = $draggable 86 var geocoder = new google.maps.Geocoder(); 87 88 geocoder.geocode({address: '$address'}, function(results, status) { 89 if (status == google.maps.GeocoderStatus.OK){ 90 var mapOptions = { 91 draggable: jQuery(document).width() > 480 && draggable == true ? true : false, 92 center: results[0].geometry.location, 93 zoom: $zoom, 94 mapTypeId: google.maps.MapTypeId.ROADMAP, 95 scrollwheel: false, 96 disableDefaultUI: disabled, 97 disableDoubleClickZoom: disabled, 98 styles: $theme 99 } 100 101 var map = new google.maps.Map(document.getElementById('$mapId'), mapOptions) 102 var marker = new google.maps.Marker({ 103 map: map, 104 position: results[0].geometry.location 105 }) 106 107 setTimeout(function(){ google.maps.event.trigger(map, "resize") }, 500) 108 } 109 110 }) 111 } 112 }, 500) 113 </script> 114EOT; 115//the above line MUST be UNINDENTED 116 117 return $map; 118} 119 120function settings_page() { 121 include "file:///C|/Users/16126/Desktop/gmaps-options.php"; 122} 123 124function tcd_maps_plugin_setup_menu(){ 125 add_menu_page('TCD Google Maps', 'TCD Google Maps', 'manage_options', 'tcd-google-maps', 'settings_page'); 126} 127 128add_filter('widget_text', 'do_shortcode'); 129add_shortcode( 'map', 'tcd_map_shortcode' ); 130add_action('admin_menu', 'tcd_maps_plugin_setup_menu'); 131 132?> 133

追記、
他のMapのプラグインも試していますが、下記理由から本プラグインで実現できたらと考えております。
・デザインが豊富であること
・ショートコードの中に直接住所が表示されること
※カスタムフィードとの組み合わせで入力欄に住所を入力するだけで地図を表示させるようにしたい
どうかJavascriptに造詣の深い方がいらっしゃいましたらお知恵を御貸し頂けると幸いです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

『TCG Google Maps』がどこで入手できるのか分かりませんが、アップデートしたら上書きされて元に戻るので、配布されているプラグインなら手を加えるのは避けた方が良いと思いますが。
そのプラグインに拘るわけでないならば他の物を検討してはいかがですか?

Google Maps Easy
https://wordpress.org/plugins/google-maps-easy/
複数の地図を同一のページに表示できます。

追記
プラグインはコレでしょうか?
TCD Google Maps
https://ja.wordpress.org/plugins/tcd-google-maps/
もしそうなら正しい名称を書いてください。

こういうことでしょうかね。
そのまま全部貼りました。
https://pastebin.com/CsXP8N5W

投稿2017/12/26 09:15

編集2017/12/26 12:02
退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2017/12/26 09:27

Google Maps Easy、使い勝手がよさそうですね!ご教示ありがとうございます。 仰る通り手を加えるのは避けるべきと思います・・・。現在は他のプラグインで表示させているのですが、気に入ったスタイルを使える事とJavascriptの勉強としてこのプラグインの修正にトライしている次第です。
退会済みユーザー

退会済みユーザー

2017/12/26 09:43

↑の背景を質問文に記載しておらず申し訳ありません。 お教え頂いたマップを使ってみました。アイコンまで変えれて非常に気に入りました! Javascriptの勉強はまた腰を据えてゆっくり基礎を学んで取り組みます。 ご回答ありがとうございました!
退会済みユーザー

退会済みユーザー

2017/12/26 10:50

住所が記載されたショートコードが必要でした、、、質問再度受付中に致します。 ご無礼お許し下さい。。 マップのプラグインとしてはお教え頂いたものが一番気に入りました。 今後使わせて頂きます!ありがとうございます。
退会済みユーザー

退会済みユーザー

2017/12/26 16:09

誤記見落としておりました。申し訳ありません。 記載頂いた位置でエラー表示消えました!! ありがとうございます。不躾な質問にも真摯にお答えいただき感謝致します。 無知すぎて恐縮なのですが、、もしよろしければ どう考えてその位置に挿入されたかお教えいただけませんか。お願いいたします
退会済みユーザー

退会済みユーザー

2017/12/27 02:22

あ、よく見たら条件分岐は要りますね。 なので $script = "<script src='https://maps.googleapis.com/maps/api/js$api' async defer></script>"; } else { $script = ""; } $obj = TcdCount::getInstance(); if($obj->count() > 1) { $script = ""; } こうしておいた方がいいです。 なぜその位置なのか。 $scriptを定義しているのがそこであり、その下で$scriptが$mapに入れられているので、その間で判定しないと駄目だと思ったからです。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問