Summary

You can add the photostream code anywhere in your HTML document and give it a target. This way, you do not have to paste the code where you want the stream to show on the page.

What This Does

Here is an example HTML document with explicit targeting: https://storage.googleapis.com/gingr-embeddable/photostream.html.

Set a Target

Add a target property to the options object. It holds a CSS selector for a DOM element. In this example, it is a div with the ID exampleTargetContainer.

<script>
 window.GingrForms.createPhotoStream({
     subdomain: 'dev-prod',
     target: "div#exampleTargetContainer",
     limit: 50,
     days: 5
 })
</script>

Change the Number of Images

By default, the photo stream shows 50 images. Change the limit property to any number you want.

<script>
 window.GingrForms.createPhotoStream({
     subdomain: 'dev-prod',
     target: "div#exampleTargetContainer",
     limit: 100,
     days: 5
 })
</script>

In this example, the limit changed from 50 to 100. Gingr now shows up to 100 images.

Change the Number of Days

By default, the photo stream looks at the last 5 days when it loads images. Change the days property to any number you want.

<script>
 window.GingrForms.createPhotoStream({
     subdomain: 'yoursubdomain',
     target: "div#exampleTargetContainer",
     limit: 50,
     days: 10
 })
</script>

In this example, the days property changed from 5 to 10. The stream now includes photos from up to 10 days ago.

Related Articles

• Embeddable Report Card Photostream Topic Outline
• Embed Photostream on Website How-To