Title: Google maps function without a plugin
Last modified: August 21, 2016

---

# Google maps function without a plugin

 *  [Dvd709](https://wordpress.org/support/users/dvd709/)
 * (@dvd709)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/)
 * Hi guys,
 * I need to implement Google maps into this website without using a plugin, though
   I have a custom written jscript function in my scripts.js.
 * Now i’m left puzzled on how to make this visual on wordpress. What I tried so
   far is this, and i’m not sure how to otherwise.
 *     ```
       //Google Maps
       function gmaps_header(){
       ?>
       	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
       <?php
       }
       add_action('wp_head','gmaps_header');
   
       function gmap() {
       if ( is_page('contact') ) {
       	    wp_register_script('initialize', ("". get_template_directory_uri() ."/scripts/script.js"));
       	wp_enqueue_script('initialize'); }
       }
       add_action( 'wp_print_scripts', 'gmap');
       ```
   

Viewing 15 replies - 1 through 15 (of 16 total)

1 [2](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/page/2/?output_format=md)

 *  [yuri06](https://wordpress.org/support/users/yuri06/)
 * (@yuri06)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501294)
 * <iframe width=”425″ height=”350″ frameborder=”0″ scrolling=”no” marginheight=”
   0″ marginwidth=”0″ src=”[https://maps.google.it/?ie=UTF8&ll=45.657417,9.96278&spn=3.873965,8.113403&t=m&z=8&output=embed”></iframe&gt](https://maps.google.it/?ie=UTF8&ll=45.657417,9.96278&spn=3.873965,8.113403&t=m&z=8&output=embed”></iframe&gt);
 * copy this in to your post, if you want to change the position modify the ll=45.657417,9.96278
   and for the zoom z=8
 *  Thread Starter [Dvd709](https://wordpress.org/support/users/dvd709/)
 * (@dvd709)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501297)
 * Into my post as in the page I want it in or?
 *  [yuri06](https://wordpress.org/support/users/yuri06/)
 * (@yuri06)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501298)
 * Yes in the page you want to show the map
 *  Thread Starter [Dvd709](https://wordpress.org/support/users/dvd709/)
 * (@dvd709)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501299)
 * I did that and it’s not helping :S.
 *     ```
       <?php get_header(); ?>
   
       <?php if ( have_posts() ) :
             while ( have_posts() ) : the_post(); ?>
   
       <?php wp_nav_menu( array( 'theme_location' => 'header-menu'));  ?>
       <?php if ( dynamic_sidebar('example_widget_area_name') ) : else : endif; ?>
   
       <?php the_title(); ?>
       <?php the_content(); ?>
   
       <div id="map_canvas">
       <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.it/?ie=UTF8&ll=45.657417,9.96278&spn=3.873965,8.113403&t=m&z=8&output=embed"></iframe>
       </div>
   
       <?php endwhile; endif; ?>
   
       <?php get_footer(); ?>
       ```
   
 * By the way <map_canvas> should’ve been where it should have appeared according
   to my custom js.
 *  [yuri06](https://wordpress.org/support/users/yuri06/)
 * (@yuri06)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501300)
 * Copy the code in the page, like if you want to write a normal text, just copy
   the code, nothing happens?
 *  Thread Starter [Dvd709](https://wordpress.org/support/users/dvd709/)
 * (@dvd709)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501303)
 * Yea if I do that it’ll paste the exact code on the page(I’m assuming you mean
   through the CMS), just like writing this <?php echo ‘<html></html>’; you’d see
   the html as text that’s what’s happening now >.<
 *  [yuri06](https://wordpress.org/support/users/yuri06/)
 * (@yuri06)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501305)
 * Also if you copy the code in Text and not in Visual?
 *  Thread Starter [Dvd709](https://wordpress.org/support/users/dvd709/)
 * (@dvd709)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501306)
 * Yes 🙁
 *  Thread Starter [Dvd709](https://wordpress.org/support/users/dvd709/)
 * (@dvd709)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501307)
 * Oh hey wait I figured it out I got it on visual now! All I have to do now is 
   combine it with my JS code because it’s not allocated to me but just somewhere
   random, any idea how I can do this?
 *  [yuri06](https://wordpress.org/support/users/yuri06/)
 * (@yuri06)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501309)
 * No I’m sorry but this I don’t knwo..maybe try to start a new thread!
 *  Thread Starter [Dvd709](https://wordpress.org/support/users/dvd709/)
 * (@dvd709)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501310)
 * Thanks anyway! 🙂
 *  [parcodeisuoni](https://wordpress.org/support/users/parcodeisuoni/)
 * (@parcodeisuoni)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501311)
 * Hi,
    from the [Google Maps API samples](https://developers.google.com/maps/documentation/javascript/examples/map-simple?hl=it),
   seems quite simple to get a map…
 * once you enqueued the js, and set a div to show the map, you can set it up via
   you script.js as you need (like in the samples)
 *  [parcodeisuoni](https://wordpress.org/support/users/parcodeisuoni/)
 * (@parcodeisuoni)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501313)
 * …sorry for my bad english…
 *  [yuri06](https://wordpress.org/support/users/yuri06/)
 * (@yuri06)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501314)
 * secondo te perchè se copia solo quel codice che gli ho postato non gli funziona?
 *  [parcodeisuoni](https://wordpress.org/support/users/parcodeisuoni/)
 * (@parcodeisuoni)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/#post-4501319)
 * Ciao, ok…
    I answer in english so others can benefit from this thread….
 * Gmaps generates an iframe code to be directly copied into a web page, and this
   will show the map without having the possibility to control it.
 * with gmaps API you need to:
    – include gmaps js (possibly [the right way](http://codex.wordpress.org/Function_Reference/wp_enqueue_script)..)–
   set css dimensions to map_canvas class (created from the API) – create a div 
   where you need it in your html structure, and give it a class “map_canvas” – 
   initialise the map as well as settings and controls via a custom js (in this 
   case, inside script.js)

Viewing 15 replies - 1 through 15 (of 16 total)

1 [2](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/page/2/?output_format=md)

The topic ‘Google maps function without a plugin’ is closed to new replies.

## Tags

 * [custom function](https://wordpress.org/support/topic-tag/custom-function/)
 * [function](https://wordpress.org/support/topic-tag/function/)
 * [function.php](https://wordpress.org/support/topic-tag/function-php/)
 * [show on page](https://wordpress.org/support/topic-tag/show-on-page/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 16 replies
 * 3 participants
 * Last reply from: [parcodeisuoni](https://wordpress.org/support/users/parcodeisuoni/)
 * Last activity: [12 years, 4 months ago](https://wordpress.org/support/topic/google-maps-function-without-a-plugin/page/2/#post-4501322)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics