Bird Watch Website 1.0

Adding a Map or Video

YouTube provides an easy way to add its videos to your website. Adding elements from other online sources to your website is also called embedding.

  • Find a video on YouTube that you want to show on your website.

  • Click on the Share button below the video. Select the option Embed.

You will see a text box with all the text selected. If you accidentally unselect the text, you can select it all again by clicking on it and pressing the Ctrl (or cmd on a Mac) and A keys at the same time.

YouTube's embed option with code selected

  • Press the Ctrl (or cmd on a Mac) and C keys together to copy the text.

  • Then go back to your website’s HTML code, and click in the place where you want to put the video, for example below a heading or paragraph. Paste the code by pressing Ctrl (or cmd on a Mac) and V on your keyboard at the same time. Don’t worry about understanding all the code you just pasted!

Example of the embedding code pasted into a HTML page

You should see the video appear on your webpage.

The same technique works for Google maps as well. Give it a go!

  • Go here and search for a place you want to show on your website. Note: do not share personal information such as your home address on a website!

  • Click on the result, then click the Share button, and copy the code and add it to your website as above.
    Embed option selected in Google Maps

  • If you look carefully, you should find width and height attributes in the pasted code. You can change their values to make the map appear bigger or smaller.

Example of embedded Google Map with width and height attributes selected