This week I want to look at how you can embed Google Maps into Moodle courses. Google provides a very simple interface for generating the right code you need, all you have to do is make sure you copy and paste it into the right place. You can embed simple maps, or choose to add the satellite view or Google Earth plugin. Once in your Moodle course the maps are still interactive- students can move around and zoom just as they can in the Google interface.
Two examples of this below; adding a map to a page, and following on from the topic label post adding a map to a label. However, the first job is to find the correct map on Google Maps and copy the code. To do this:
- Go to Google Maps
- Set the map on the view you would like
- Click the ‘Link’ option at the top right of the map and then ‘Customise and preview embedded map’
- Pick appropriate size and view options
- Copy the code at the bottom of the window to your clipboard
Now you have the code for the map you want we can add it to our Moodle course.
1) Adding a map to a web page
This option places the map in a new resource on your course. You can add any other text/images to this to create something similar to the image above.
- Turn editing on for your course and select ‘Add Resource’, ‘Compose a web page’
- Add a title and description for you page, and then any text you want using the editor
- Now, turn on code view for the editor. (button on the far right, looks like <> )
- Paste the code copied in stage one into the correct place in your document
- Turn code view off and carry on editing your page. Once complete hit save
2) Adding a map to a topic label
This version adds the map to your main course page. In general you would want to pick smaller maps for this option.
- Turn editing on for your course, and click the edit button for the topic label you want to add the map to. Or, select ‘Insert label’ from the add resource menu to create a new label
- Add any text to your label you wish
- Switch to code view (button on the right of the editor like this <> )
- Paste the map code into the box and return to normal view by hitting the code button again
- Make any final format changes and press save
This week I have also made screencasts of each stage of the process. If you prefer to watch a video example than following text instructions use the YouTube links below.
Once you’ve mastered the idea of embedding code into Moodle, you can achieve the same with lots of other things. YouTube and Google Calendar are good examples here- almost exactly the same process, you just need to find the embed code. Posts to follow on embedding these resources if you need more help.
Moodle Mondays are a new section of Moodlenews provided by Tim Dalton (@timdalton). You can read this, and many other helpful posts over at Tim’s regular blog, http://tdalton.co.uk/. Tune in every Monday for a Moodle Monday tip.
