source

wordpress 고급 사용자 지정 필드 Google map api 키

manysource 2023. 4. 5. 22:02

wordpress 고급 사용자 지정 필드 Google map api 키


Advanced Custom Field 플러그인으로 Google 맵을 로드하는 데 문제가 있습니다.여기 https://www.advancedcustomfields.com/resources/google-map에서 플러그인 페이지의 설명과 같이 모든 것을 만듭니다.
ACF에 google-map 필드를 추가합니다만, 그것이 있어야 할 페이지에 잠깐 표시되었다가, 「Oops!」라고 써넣고 사라집니다.뭔가 잘못됐어.이 페이지는 Google 지도를 올바르게 로드하지 않았습니다.자세한 내용은 JavaScript 콘솔을 참조하십시오.(스크린샷 참조)콘솔에서 구글 API 키를 설정해야 한다고 합니다.ACF 명령에서 .js 파일의 문자열도 수정해야 할 것 같습니다만, 어떤 문자열인지 알 수 없습니다.누군가 도울 수 있을지도 몰라
잘 부탁드립니다.
스크린샷

ACF가 Google 지도 문서를 업데이트했습니다.

먼저 Maps API 키를 가져와 다음 API를 활성화해야 합니다.

  • JavaScript API 매핑
  • 지오코딩 API
  • API 배치

그런 다음 API 키를 등록합니다.functions.php

ACF 프리 사용 시

function my_acf_google_map_api( $api ){
    $api['key'] = 'xxx';
    return $api;
}
add_filter('acf/fields/google_map/api', 'my_acf_google_map_api');

ACF Pro를 사용하는 경우

function my_acf_init() {
    acf_update_setting('google_api_key', 'xxx');
}

add_action('acf/init', 'my_acf_init');

저 같은 경우에는 필드를 삭제하고 다시 생성하여 올바르게 저장해야 했습니다.

해결책은 함수를 편집하는 것일 수 있습니다.템플릿의 php

//TODO: fix api key for advanced custom field
add_action('acf/fields/google_map/api', function($api){
$api['key'] = '<YOUR_API_KEY>';
return $api;
});

아니면 내 기사를 체크해서 완벽한 해결책을 찾을 수도 있다.

스크립트에 이 행을 추가합니다.키로 대체합니다.

<script src="javascripts/jquery.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=YOUR-API-KEY"></script>
<script type="text/javascript" src="javascripts/jquery.googlemap.js"></script>

이 문제에 대한 몇 가지 다른 해결책을 찾았지만, 어떻게 해야 하는지 설명하기 전에 구글 맵 API 키를 받는 것을 기억하십시오.저는 Listify 테마를 사용하고 있기 때문에 이 지침을 따랐습니다만, 가지고 계신 테마를 불문하고 분명 도움이 될 것입니다.

솔루션:

프런트 엔드

어디선가 (내 생각엔)functions.php또는 인your-awesome-widget.php)는, 다음과 같은 행이러닝이 필요합니다.

wp_enqueue_script( 'googlemaps_api' );

또는

wp_enqueue_script( 'googlemaps' );

제가 찾은 솔루션은 키를 큐잉하기 전에 스크립트 등록에 추가하는 것입니다.이렇게 해서

wp_register_script('googlemaps', 'http://maps.googleapis.com/maps/api/js?key='.$YOUR_API_KEY, false, '3');

wp_enqueue_script('googlemaps');

백엔드

이 제품은 ACF 지원이 이미 공식 솔루션에서 동작하고 있다고 들었기 때문에 플러그인 업데이트로 지워져도 문제 없습니다.

다음의 2개의 파일을 엽니다.

  • advanced-custom-fields/input.min.displays

  • advanced-custom-fields/input.displays(이론적으로 .min 버전을 사용하는 경우 이 버전은 사용할 수 없습니다)

이 코드 조각은 각 파일에서 두 번 반복됩니다.

google.load('maps', '3', { other_params: $.param(self.api), callback: function(){

이러한 방법으로 키를 쿼리 문자열로 추가하는 두 가지 발생을 변경합니다.

other_params: $.param(i.api) + 'key=YOUR_API_KEY', callback

에트보일라!그건 작동할 거야.

그 주제에 대한 공식 페이지는 여기에 있습니다.

도움이 됐으면 좋겠네요!

ACF의 최신 버전(4.4)에서는 기능을 찾을 수 있습니다.php를 사용하여 코드 끝에 추가합니다.

function my_acf_google_map_api( $api ){
    $api['key'] = 'YOUR_API_KEY';
    return $api;
}
add_filter('acf/fields/google_map/api', 'my_acf_google_map_api');

'YOUR_' 변경Google에서 생성된 API 키에 대한 API_KEY'입니다.

언급URL : https://stackoverflow.com/questions/38282612/wordpress-advanced-custom-fields-google-map-api-key