Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Customising the CMS /

Easy Google Maps 'Plugin' for Silverstripe


Go to End
Reply


24 Posts   10211 Views

Avatar
MikeOne

Community Member, 40 Posts

24 December 2009 at 7:18am

Hi Eric,

Not sure what the problem could be. Where does the error come from? Script? PHP? SilverStripe?

I guess I can only advice to carefully follow the steps outlined in the readme file. A common problem seems to be that people miss the fact that you have to put your API key in 2 (!!) places in the code.

Please let me know.
Cheers,
Michiel.

Avatar
EricW

Community Member, 6 Posts

26 December 2009 at 7:06am

Hey mike, thanks for the reply.

I guess I am just having trouble unzipping the files. I have not attempted to solve this problem since I first wrote. I am sure it is just user error. I will post again once I make it work.

Merry Christmas!
Eric

Avatar
kiwiot

Community Member, 8 Posts

19 May 2010 at 12:33am

Edited: 19/05/2010 12:35am

Hi Mike,

I wanted to apply your google maps module to Silverstripe 2.4. The main issue was that 2.4 no longer uses jsparty (see : http://doc.silverstripe.org/upgrading:2.4.0#removed_jsparty) which basically meant that the file structure of the installation needed to be updated.

I hope you dont' mind but I have rewritten the first part of the installation file readme.rtf file below for anyone out there who also wants to use this fantastic little gem of a module.

To install for silverstripe 2.4 use the following steps:

- Copy the 'googlemapsjs' folder to the '/sapphire/thirdparty/' directory
- Copy the 'googlemaps' folder to '/sapphire/thirdparty/tinymce/plugins' directory
- Open your 'mysite/_config.php' and add the following block:

------------------------------------------------------------------------------------------------------------------------------------------------------------------------
// Enable Google Maps in the CMS
// Enter you Google Mans API key here
$GMap_api_key = "API_KEY_HERE";
   
HtmlEditorConfig::get('cms')->enablePlugins('googlemaps');
HtmlEditorConfig::get('cms')->insertButtonsAfter('tablecontrols', 'googlemaps');
Requirements::javascript("sapphire/thirdparty/jquery/jquery-packed.js");
Requirements::javascript("http://www.google.com/jsapi?key=".$GMap_api_key);
Requirements::javascript("sapphire/thirdparty/googlemapsjs/mapsloader.js");

// End Google Maps stuff
------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Open gmapsapp.js now located in 'sapphire/thirdparty/googlemapsjs/gmapsapp.js'

and update the var scriptURL from

var scriptURL = 'jsparty/googlemapsjs/gmapsapp.js';

to

var scriptURL = 'sapphire/thirdparty/googlemapsjs/gmapsapp.js';

See the rest of the readme.rtf for final instructions and creating a Google Maps API key.

Regards,
Jared

Avatar
MikeOne

Community Member, 40 Posts

19 May 2010 at 1:47am

Hey kiwiot,

Brilliant. Thanks!

I haven't had a chance yet to look at 2.4 but I will do soon!

Cheers,
Mike.

Avatar
innyinskip

Community Member, 46 Posts

16 July 2010 at 8:45pm

Awesome!

First plugin ive actually managed to get working!
Works a treat on 2.4
Great work mate, loving it!

Avatar
potion_maker

Community Member, 36 Posts

5 November 2010 at 9:38am

Edited: 05/11/2010 10:31am

/thirdparty/tinymce/plugins/googlemaps/googlemaps.php = /thirdparty/tinymce/plugins/googlemaps/googlemaps.html

You need to edit the html file so that the php code is removed and your google maps API key is added throughout the file.

//Remove
<?php $GMap_api_key = "API_KEY_HERE" ?>

//Replace
<?php echo $GMap_api_key?> //and
<?php echo $GMap_api_key ?> //note the extra space that you might miss with search and replace

//With your actual google maps API key

Lastly, if you want to hide your API key from the CMS user you can hide the API key field in:
/thirdparty/tinymce/plugins/googlemaps/googlemaps.html

<fieldset style="margin-top:10px;">
<legend>API-KEY:</legend>
<div style="padding:4px">API KEY HIDDEN<input id="akey" readonly="readonly" name="akey" type="hidden" value="YOUR_API_KEY_HERE" class="text" style="width:570px" /></div>
</fieldset>

And finally you have to open /thirdparty/tinymce/plugins/googlemaps/editor_plugin_src.js and change
(located at line 17)
file : url + '/googlemaps.php', becomes file : url + '/googlemaps.html',
Otherwise it will continue to look for the php file that no longer exists

Avatar
arthurdent

Community Member, 184 Posts

31 May 2011 at 4:59pm

Edited: 29/06/2011 8:14pm

Hi - downloaded the Version 3 beta and installed, added API to config.php and did /Dev/Build - no extra button in CMS toolbox. Any ideas as to where I went wrong? Thanks in advance...

<later> Always pays to read back over the thread. I'm using SilverStripe 2.4 which no longer has 'jsparty'... so I've updated the relevant paths as Kiwiot mentioned above. So I have my 'Maps' tool in Sapphire, I can enter the street address and produce a map in the CMS that can be inserted on the page... so now all I need to do is work out why I get a gray square on the page... </later>

Re-read Kiwiot's instructions... missed the following updated line in the gmapsapp.js file:

var scriptURL = sapphire/thirdparty/googlemapsjs/gmapsapp.js

Actually the original line wasn't even there... so I simply added this line of code. All sorted now thanks!

Avatar
Platypus

Community Member, 43 Posts

12 September 2011 at 12:51am

Edited: 21/10/2011 11:59am

var scriptURL = 'jsparty/googlemapsjs/gmapsapp.js';

This line needs to be changed/updated in the file mapsloader.js

to:

var scriptURL = 'sapphire/thirdparty/googlemapsjs/gmapsapp.js';

Thanks for this nice module, it should be mentioned in the modules section.

Go to Top