UPDATE 23 February 2016:

I ended with the following using unor's help:

<script type="application/ld+json">
     {
          "@context": "http://schema.org",
          "@graph": [{
               "@type": "WebSite",
               "name": "My Website Name",
               "url": "http://www.example.com"
          }, {
               "@type": "WebPage",
               "name": "My Website Name",
               "url": "http://www.example.com"
          }, {
               "@type": "Organization",
               "name": "My Website Name",
               "url": "http://www.example.com",
               "sameAs": [
                    "http://www.facebook.com/example-com",
                    "http://www.instagram.com/example-com"
               ]
          }]
     }
</script>

How do you add more than one schema to a web page?

I am using the Organization and Website schemas on my home page. I am writing the markup in JSON-LD format.

The Organization schema for the knowledge graph:

<script type="application/ld+json">
     {
          "@@context": "http://schema.org",
          "@@type": "Organization",
          "name": "My Website Name",
          "url": "http://www.example.com",
          "sameAs": [
               "http://www.facebook.com/example-com",
               "http://www.instagram.com/example-com"
          ]
     }
</script>

..and the Website schema to include my site name in search results (if Google ever decides to implement this):

<script type="application/ld+json">
     {
          "@context" : "http://schema.org",
          "@@type" : "WebSite",
          "name" : "My Website Name",
          "url" : "http://www.example.com"
     }
</script>

As you can see they both have the same name and url properties.

Do I need to specify the 2 separate like I did or can just concatenate the 2? Any preference of which has to go first on the page?

How do you add more than one schema to a web page?

I am using the Organization and WebSite schemas on my home page. I am writing the markup in JSON-LD format.

The Organization schema for the knowledge graph:

<script type="application/ld+json">
     {
          "@@context": "http://schema.org",
          "@@type": "Organization",
          "name": "My Website Name",
          "url": "http://www.example.com",
          "sameAs": [
               "http://www.facebook.com/example-com",
               "http://www.instagram.com/example-com"
          ]
     }
</script>

and the WebSite schema to include my site name in search results (if Google ever decides to implement this):

<script type="application/ld+json">
     {
          "@context" : "http://schema.org",
          "@@type" : "WebSite",
          "name" : "My Website Name",
          "url" : "http://www.example.com"
     }
</script>

As you can see they both have the same name and url properties.

Do I need to specify the 2 separate like I did or can just concatenate the 2? Any preference of which has to go first on the page?