This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.
Please use forum.silverstripe.org for any new questions
(announcement).
The forum archive will stick around, but will be read only.
You can also use our Slack channel
or StackOverflow to ask for help.
Check out our community overview for more options to contribute.
Dear All,
I am very new in silverstripe, i start from the tutorial template and just finish to make some layout in the front page, now I try to add some javascript into the content of the main page.
example: add javascript of Google Maps API3, where should I add? page.ss or page.php??
Thanks.
Demmy
Hi,
My solution is probably not the best, but I usually :
- put the requirement to the googleapi js file in my page.php controller
Requirements::javascript('http://maps.googleapis.com/maps/api/js?sensor=false');<script type="text/javascript">function initialize() {... 
sometimes if you want to insert any JS in the head of the document, you can use Requirements::insertHeadTag function this is very useful when you want to include modernizr js etc.
Dear Stan,
Thanks, but i'm still not clear about this point,
- put the rest of js code in the template. It enables me to insert variables directly in the js code, so that the user can change parameters in the cms (lat/long, zoom factor, etc.).
can you explain a bit clearer than this?
Best Regards;
BOly
@Demmy, sorry if I wasn't clear. I give you an exemple : I wanted my client to be able to change the position of the "coloured pin" on his Google Map.
I added a DB field named "GPS" in my ContactPage.php (ContactPage.ss is the template where I display the map) :
<?php
class PageContact extends Page {
public static $db = array(
'GPS' => 'Text'
);
...
function getCMSFields() {
$fields = parent::getCMSFields();
$fields->addFieldToTab('Root.Content.GoogleMap', new TextField('GPS', 'Coordonnées GPS (format : 47.338979,1.00158)')); return $fields;
}And in ContactPage.ss :
<% if GPS %>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(
{$GPS});
var myOptions = {
zoom: 15,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("GMap"),
myOptions);
var marker = new google.maps.Marker({
position: latlng,
map: map,
title:"$SiteConfig.Title",
visible:true
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<div id="GMap">
</div>
<% end_if %>The map displayed in the site is centered on the position entered by the client in the CMS.
@Nivanka - Thanks, I didn't know there was a way to choose scripts that have to be in the <head> section, while the others remain at the end of the document !
Dear Stan,
Many thanks. Many thanks.
I try it now, and i did not see any error, but i cannot see the Google map display on my page, its just blank screen.
do you know what is the problem?
Best Regards;
Boly
PS: If you don't mind, can you give me an email address? and can I ask you directly by email?
If possible, can you give me the URL of your project ?
My e-mail : stallain@gmail.com
