ThemeShaper Forums » Thematic

[closed]

How to add Google map in thematic?

(2 posts)
  • Started 10 years ago by gezzeg
  • Latest reply from gezzeg
  • This topic is resolved
  1. Hi,

    i would like to add google map in thematic. I try to search for tutorial or problem but couldnt find any. Anyone can guide me about this?

    Posted 10 years ago #
  2. Ok already got the solution.

    Add this to ur function.php

    function init_google_map(){
    wp_enqueue_script('google-maps' , 'http://maps.google.com/maps/api/js?sensor=true' , false , '3');
    }
    add_action('init', 'init_google_map');
    
    function loadmap(){
    
       // register your script location, dependencies and version
       wp_register_script('custom_script',
           get_bloginfo('url') . '/wp-content/themes/gdirectory/gdirectory.js',
           false,
           '1.0' );
       // enqueue the script
       wp_enqueue_script('custom_script');
    }
    add_action('init', 'loadmap');

    Create JS file

    function initialize() {
       //MAP
      var latlng = new google.maps.LatLng(3.8032152414569946,103.32394294379424);
      var options = {
        zoom: 16,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.SATELLITE
      };
    
      map = new google.maps.Map(document.getElementById("map_canvas"), options);
    
      //GEOCODER
      geocoder = new google.maps.Geocoder();
    
      marker = new google.maps.Marker({
        map: map,
        draggable: true
      });
    
    }

    Create custom page in admin

    add_action('admin_menu', 'business_menu');
    
    function business_menu(){
    add_menu_page('Business Profile', 'Business Profile Page', '5', 'business_page', 'business_page');
    }
    
    function business_page(){
    echo '<div class="wrap">';
    echo '
    <div>
    <h2>Business Profile</h2>
    <label>Address: </label><input id="address"  type="text"/>
    <div id="map_canvas" style="width:800px; height:500px"></div>
    <label>latitude: </label><input id="latitude" type="text"/>
        <label>longitude: </label><input id="longitude" type="text"/>
    ';
    	echo '</div>';
    }
    Posted 10 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.